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

feat: useStorage update onFocus #1316

Merged
merged 2 commits into from
May 24, 2022
Merged

feat: useStorage update onFocus #1316

merged 2 commits into from
May 24, 2022

Conversation

tlgimenes
Copy link
Contributor

@tlgimenes tlgimenes commented May 24, 2022

What's the purpose of this pull request?

Update useStorage hook on focus.

How it works?

IndexedDB is consistent across multiple windows. Sadly, we don't have a way of hooking into indexedDB to know when it has changed or not with our current dependencies, idb-keyval.
To make the app consistent across multiple tabs, I propose the onFocus trick. The idea is to update the stored value on useStorage hook each time the tab is focused. This way, we ensure when the user sees a tab, it's in a consistent state.

How to test it?

Open two tabs and add items to cart. Make sure the two carts display the same products.
More info at: https://vtex.slack.com/archives/C01AKAJDUEQ/p1653391800179519

Starters Deploy Preview

@tlgimenes tlgimenes requested a review from a team as a code owner May 24, 2022 12:39
@vercel
Copy link

vercel bot commented May 24, 2022

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Updated
faststore ✅ Ready (Inspect) Visit Preview May 24, 2022 at 2:30PM (UTC)

@tlgimenes tlgimenes changed the title feat: useStorage revalidate onFocus feat: useStorage update onFocus May 24, 2022
@codesandbox-ci
Copy link

codesandbox-ci bot commented May 24, 2022

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit 028b5a8:

Sandbox Source
Store UI Typescript Configuration

Copy link
Contributor

@lucasfp13 lucasfp13 left a comment

Choose a reason for hiding this comment

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

Tested in NextJS store, working good 💯

Copy link
Contributor

@filipewl filipewl left a comment

Choose a reason for hiding this comment

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

Today I learned about this visibilitychange event!

@tlgimenes tlgimenes merged commit c9874d4 into main May 24, 2022
@tlgimenes tlgimenes deleted the feat/revalidate-on-focus branch May 24, 2022 14:27
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants