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: redux migration #6830

Merged
merged 23 commits into from
Aug 16, 2023
Merged

feat: redux migration #6830

merged 23 commits into from
Aug 16, 2023

Conversation

just-toby
Copy link
Contributor

@just-toby just-toby commented Jun 22, 2023

Description

introduces a version management system for the redux state - tests for the type of the App State, migrations which run when versions don't match, and an initial migration to move away from the old library.

Linear ticket: https://linear.app/uniswap/issue/WEB-2224/add-redux-migrations-to-the-interface
Relevant docs: https://www.notion.so/Redux-migrations-in-interface-30aca899626a4ac4af7b070f92ce976d

Screen capture

Before Migration

image

After Migration (updated 8/14 to show IndexedDB)

image image

Test plan

QA (ie manual testing)

  • manually tested the initial migration away from redux-localstorage-simple and ensured my old state was copied over

Automated testing

  • Unit tests - added
  • Integration/E2E test N/A

@vercel
Copy link

vercel bot commented Jun 22, 2023

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

Name Status Preview Comments Updated (UTC)
interface ✅ Ready (Inspect) Visit Preview 💬 Add feedback Aug 16, 2023 5:46pm

@socket-security
Copy link

socket-security bot commented Jun 22, 2023

New and removed dependencies detected. Learn more about Socket for GitHub ↗︎

Packages Version New capabilities Transitives Size Publisher
localforage 1.10.0 network +2 527 kB tofumatt
redux-persist 6.0.0 environment +0 418 kB rt2zz
tsafe 1.6.4 None +0 79.6 kB garronej

🚮 Removed packages: [email protected]

@cypress
Copy link

cypress bot commented Jun 22, 2023

1 flaky tests on run #13732 ↗︎

0 107 0 0 Flakiness 1

Details:

feat: redux migration
Project: Uniswap Interface Commit: a9de2e77de
Status: Passed Duration: 04:19 💡
Started: Aug 16, 2023 5:49 PM Ended: Aug 16, 2023 5:53 PM
Flakiness  cypress/e2e/token-explore-filter.test.ts • 1 flaky test • e2e

View Output Video

Test Artifacts
Token explore filter > should filter correctly by dao search term Output Screenshots

This comment has been generated by cypress-bot as a result of this project's GitHub integration settings.


persistStore(store)
// wait for the migration to complete
await new Promise((resolve) => setTimeout(resolve, 0))
Copy link
Contributor

Choose a reason for hiding this comment

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

they don't give us an await persistStore i guess

Copy link
Contributor

@natew natew left a comment

Choose a reason for hiding this comment

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

overall looks good

Copy link
Contributor

@JFrankfurt JFrankfurt left a comment

Choose a reason for hiding this comment

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

looks clean and I like the tests :)

Copy link
Contributor

@zzmp zzmp left a comment

Choose a reason for hiding this comment

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

I think you need a PersistGate (see https://www.npmjs.com/package/redux-persist) or something similar to make sure the state is loaded before the first render.

You may not want a PersistGate, to avoid a slow pageload experience, but it doesn't seem to pick up my previously connected wallet when I reload the page.

src/state/lists/hooks.ts Outdated Show resolved Hide resolved
src/state/transactions/reducer.ts Show resolved Hide resolved
src/state/user/reducer.ts Show resolved Hide resolved
src/state/index.ts Show resolved Hide resolved
cypress/support/commands.ts Outdated Show resolved Hide resolved
src/state/migrations.ts Show resolved Hide resolved
src/state/migrations.ts Outdated Show resolved Hide resolved
src/state/migrations.ts Outdated Show resolved Hide resolved
src/state/migrations.ts Outdated Show resolved Hide resolved
src/state/migrations.ts Outdated Show resolved Hide resolved
@zzmp
Copy link
Contributor

zzmp commented Aug 14, 2023

Can you also add an e2e test that ensures that saved state is being reflected in pageload?
This can be as small as setting selected wallet to INJECTED and ensuring that there is a connected wallet on pageload. This test passes for you right now because you are setting it in localStorage, but the main codepath here will have it set in indexedDB, and I believe that would make the e2e test fail as-written.

cypress/support/commands.ts Outdated Show resolved Hide resolved
src/index.tsx Outdated Show resolved Hide resolved
src/state/index.ts Outdated Show resolved Hide resolved
src/state/migrations.ts Outdated Show resolved Hide resolved
src/state/migrations/0.ts Show resolved Hide resolved
src/state/reducer.ts Show resolved Hide resolved
cypress/support/commands.ts Outdated Show resolved Hide resolved
Copy link
Contributor

@zzmp zzmp left a comment

Choose a reason for hiding this comment

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

awesome

...(options?.userState ?? {}),
},
},
'persist:interface'
Copy link
Contributor

Choose a reason for hiding this comment

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

This should be pulled out as a key from ../../src/state/user/reducer if it can be.

cypress/support/commands.ts Outdated Show resolved Hide resolved
@just-toby just-toby merged commit 38cce46 into main Aug 16, 2023
25 checks passed
@just-toby just-toby deleted the feat/redux-migrations branch August 16, 2023 17:56
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.

4 participants