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 react-router to v6 #1001

Merged
merged 2 commits into from
Sep 22, 2022
Merged

Conversation

buberdds
Copy link
Contributor

I did not find a way to use react-transition-group with router v6. There were issues with nested routes animations, app re-renders and console warnings. In order to use new router I am switching to framer-motion, but my preference would be not to use any animation lib for routes to keep things simple and wait for official v6 API to support routes animations.

@buberdds buberdds requested a review from lukaw3d September 19, 2022 15:32
@lukaw3d
Copy link
Member

lukaw3d commented Sep 19, 2022

react-router always breaking everything 🤦
Are nested animations problematic because it's missing something like "useNestedLocation"?

I agree with removing animations. If we do keep them though, I'd rather see

            <Route
              element={<FadeIn><HomePage /></FadeIn>}
              path="/"
            />

than <FadeIn> on the root of every page component.

@tjanez
Copy link
Member

tjanez commented Sep 20, 2022

I agree with removing animations

I would also rather (temporarily) remove animations. I would just file a GitHub issue to consider re-enabling/re-adding animations once react-router supports them natively.

@buberdds buberdds force-pushed the react-router-v6 branch 2 times, most recently from 4655968 to ba9ff03 Compare September 21, 2022 07:49
@codecov
Copy link

codecov bot commented Sep 21, 2022

Codecov Report

Merging #1001 (ba9ff03) into master (24c4762) will decrease coverage by 0.10%.
The diff coverage is 85.71%.

❗ Current head ba9ff03 differs from pull request most recent head 6e68989. Consider uploading reports for the commit 6e68989 to get more accurate results

Impacted file tree graph

@@            Coverage Diff             @@
##           master    #1001      +/-   ##
==========================================
- Coverage   88.77%   88.66%   -0.11%     
==========================================
  Files         101      100       -1     
  Lines        1764     1747      -17     
  Branches      407      405       -2     
==========================================
- Hits         1566     1549      -17     
  Misses        198      198              
Flag Coverage Δ
cypress 60.10% <85.71%> (-0.33%) ⬇️
jest 79.58% <85.71%> (-0.15%) ⬇️

Flags with carried forward coverage won't be shown. Click here to find out more.

Impacted Files Coverage Δ
src/app/index.tsx 100.00% <ø> (ø)
src/app/pages/HomePage/index.tsx 100.00% <ø> (ø)
src/app/pages/OpenWalletPage/index.tsx 100.00% <ø> (ø)
src/app/components/Sidebar/index.tsx 88.75% <50.00%> (ø)
src/app/pages/AccountPage/index.tsx 96.29% <100.00%> (ø)
src/app/useRouteRedirects.tsx 100.00% <100.00%> (ø)
src/app/lib/key.ts 85.71% <0.00%> (-8.04%) ⬇️
src/app/components/ShortAddress/index.tsx 100.00% <0.00%> (ø)

@buberdds
Copy link
Contributor Author

Commit with framer-motion was removed.

@buberdds buberdds merged commit d94e89b into oasisprotocol:master Sep 22, 2022
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.

3 participants