Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update the props store to support prefetching #281

Closed
wants to merge 3 commits into from

Conversation

pleek91
Copy link
Contributor

@pleek91 pleek91 commented Oct 10, 2024

Description

WIP attempt at updating the props store to allow for prefetching. Updates the setProps method to accept a prefetch boolean and attempts to accurately clear stale props from the store.

When prefetch is true props will be put into the store and then we exit. If prefetch is false then after putting props into the store we then go delete any props from the store that do not match the route that was passed in.

In both cases if a key already exists in the store we do not execute the prop callback for that match. If a key already exists then it was prefetched and shouldn't be fetched again.

@stackoverfloweth hopefully this aligns more with the mental model you had in mind for the props store and prefetching in general.

Note: This doesn't fix the issue with a single boolean not accurately reflecting the fact that a route has multiple matches and each match might have a different prefetch value for props. The prefetch option might need to include a callback to determine if the current match should prefetch props based on the PrefetchConfigs for that match.

Copy link

netlify bot commented Oct 10, 2024

Deploy Preview for kitbag-router ready!

Name Link
🔨 Latest commit 1b0dc86
🔍 Latest deploy log https://app.netlify.com/sites/kitbag-router/deploys/67074ae5fb93810008569a2b
😎 Deploy Preview https://deploy-preview-281--kitbag-router.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

setProps: (route: ResolvedRoute) => void,
getProps: (id: string, name: string, params: unknown) => MaybePromise<unknown> | undefined,
setProps: (route: ResolvedRoute, options: { prefetched: boolean }) => void,
getProps: (id: string, name: string, params: Record<string, unknown>) => unknown,
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

MaybePromise<unknown> | undefined is widened to unknown anyway.

}

export function createPropStore(): PropStore {
const store = reactive(new Map<string, unknown>())
const store: Map<string, unknown> = reactive(new Map())
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

reactive produces a mapped type because of ref unwrapping. Writing this way produces a simpler type for the store.

Comment on lines +30 to +32
if (store.has(key)) {
continue
}
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm not 100% sure skipping every time is the right thing to do here. But I think it makes sense?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant