[Dashboard] Remove use-scroll-position #5274

kien-ngo · 2024-11-03T03:51:21Z

Problem solved

Short description of the bug fixed or feature added

PR-Codex overview

This PR primarily focuses on removing the dependency on @n8tb1t/use-scroll-position and refactoring the HomepageTopNav component in Topnav.tsx to utilize @chakra-ui/react for styling and layout.

Detailed summary

Removed @n8tb1t/use-scroll-position dependency from package.json.
Eliminated the useScrollPosition hook from HomepageTopNav.
Introduced Box, Container, and Flex components from @chakra-ui/react for layout.
Adjusted the bgColor and backdropFilter properties in the Box component.

✨ Ask PR-Codex anything about this PR by commenting with /codex {your question}

vercel · 2024-11-03T03:51:25Z

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

Name	Status	Preview	Comments	Updated (UTC)
docs-v2	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Nov 5, 2024 4:26am
thirdweb_playground	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Nov 5, 2024 4:26am
thirdweb-www	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Nov 5, 2024 4:26am
wallet-ui	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Nov 5, 2024 4:26am

changeset-bot · 2024-11-03T03:51:25Z

⚠️ No Changeset found

Latest commit: 1e141f3

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

graphite-app · 2024-11-03T03:51:26Z

Your org has enabled the Graphite merge queue for merging into main

Add the label “merge-queue” to the PR and Graphite will automatically add it to the merge queue when it’s ready to merge. Or use the label “hotfix” to add to the merge queue as a hot fix.

You must have a Graphite account and log in to Graphite in order to use the merge queue. Sign up using this link.

kien-ngo · 2024-11-03T03:51:36Z

[Dashboard] Remove react-children-utilities #5275
[Dashboard] Remove use-scroll-position #5274 👈
main

This stack of pull requests is managed by Graphite. Learn more about stacking.

Join @kien-ngo and the rest of your teammates on Graphite

kien-ngo · 2024-11-03T03:53:11Z

apps/dashboard/src/components/product-pages/common/Topnav.tsx

@@ -1,43 +1,20 @@
-import { Box, Container, Flex, useBreakpointValue } from "@chakra-ui/react";
-import { useScrollPosition } from "@n8tb1t/use-scroll-position";


This navbar is only used in the few pages that (pretty sure) will be converted to Framer.

What it does is change the background color effects on scrolling down. We can achieve the same thing with useEffect(?) however I think it's not that big of a deal so we can just make it "static". (Less JS in overall)

codecov · 2024-11-03T03:53:45Z

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 45.56%. Comparing base (c63fefd) to head (1e141f3).
Report is 5 commits behind head on main.

Additional details and impacted files

@@           Coverage Diff           @@
##             main    #5274   +/-   ##
=======================================
  Coverage   45.55%   45.56%           
=======================================
  Files        1068     1067    -1     
  Lines       55514    55487   -27     
  Branches     4029     4031    +2     
=======================================
- Hits        25292    25282   -10     
+ Misses      29532    29515   -17     
  Partials      690      690

Flag	Coverage Δ		*Carryforward flag
legacy_packages	`65.68% <ø> (ø)`		Carriedforward from c63fefd
packages	`40.65% <ø> (+<0.01%)`	⬆️

*This pull request uses carry forward flags. Click here to find out more.

see 5 files with indirect coverage changes

github-actions · 2024-11-03T03:55:09Z

size-limit report 📦

Path	Size	Loading time (3g)	Running time (snapdragon)	Total time
thirdweb (esm)	43 KB (-0.02% 🔽)	860 ms (-0.02% 🔽)	3.6 s (+59.43% 🔺)	4.5 s
thirdweb (cjs)	103 KB (0%)	2.1 s (0%)	6.6 s (+28.14% 🔺)	8.6 s
thirdweb (minimal + tree-shaking)	4.85 KB (0%)	97 ms (0%)	332 ms (+53.89% 🔺)	429 ms
thirdweb/chains (tree-shaking)	506 B (0%)	10 ms (0%)	69 ms (-49.13% 🔽)	79 ms
thirdweb/react (minimal + tree-shaking)	17.51 KB (0%)	351 ms (0%)	624 ms (+6.09% 🔺)	975 ms

MananTank · 2024-11-04T19:12:09Z

apps/dashboard/src/components/product-pages/common/Topnav.tsx

-      backdropFilter={
-        isScrolled ? "saturate(180%) blur(20px)" : "saturate(100%) blur(0px)"
-      }
+      bgColor="rgba(0,0,0,0)"


this is not looking good when you scroll the page down

@MananTank I gave it a default blur-20px.

This page is very soon to be deleted by so it's up to you. I'm fine with closing this PR (it was a weekend idea anyway)

https://www.notion.so/thirdweb/Pages-that-should-move-into-framer-or-be-removed-12e8141725338051a965daa7ae2e60dc

yeah let's not do this - also let's not waste time on pages that will be deleted or moved to framer soon, we have lots to do on "in app" pages :)

Understood ^

MananTank

address comments

jnsdls · 2024-11-05T04:51:05Z

apps/dashboard/src/components/product-pages/common/Topnav.tsx

-      backdropFilter={
-        isScrolled ? "saturate(180%) blur(20px)" : "saturate(100%) blur(0px)"
-      }
+      bgColor="rgba(0,0,0,0)"


yeah let's not do this - also let's not waste time on pages that will be deleted or moved to framer soon, we have lots to do on "in app" pages :)

kien-ngo marked this pull request as ready for review November 3, 2024 03:51

kien-ngo requested review from MananTank, jnsdls and joaquim-verges as code owners November 3, 2024 03:51

github-actions bot added the Dashboard Involves changes to the Dashboard. label Nov 3, 2024

vercel bot deployed to Preview – wallet-ui November 3, 2024 03:52 View deployment

vercel bot deployed to Preview – thirdweb_playground November 3, 2024 03:52 View deployment

kien-ngo commented Nov 3, 2024

View reviewed changes

vercel bot deployed to Preview – docs-v2 November 3, 2024 03:53 View deployment

vercel bot deployed to Preview – thirdweb-www November 3, 2024 04:00 View deployment

kien-ngo mentioned this pull request Nov 3, 2024

[Dashboard] Remove react-children-utilities #5275

Closed

gregfromstl assigned kien-ngo Nov 4, 2024

MananTank reviewed Nov 4, 2024

View reviewed changes

MananTank requested changes Nov 4, 2024

View reviewed changes

graphite-app bot added the merge-queue Adds the pull request to Graphite's merge queue. label Nov 4, 2024

update

1e141f3

kien-ngo force-pushed the kien/remove-use-scroll-position branch from 106b814 to 1e141f3 Compare November 5, 2024 04:16

vercel bot deployed to Preview – wallet-ui November 5, 2024 04:17 View deployment

vercel bot deployed to Preview – thirdweb_playground November 5, 2024 04:17 View deployment

vercel bot deployed to Preview – docs-v2 November 5, 2024 04:18 View deployment

kien-ngo requested a review from MananTank November 5, 2024 04:19

vercel bot deployed to Preview – thirdweb-www November 5, 2024 04:26 View deployment

jnsdls requested changes Nov 5, 2024

View reviewed changes

kien-ngo closed this Nov 5, 2024

kien-ngo deleted the kien/remove-use-scroll-position branch January 6, 2025 07:53

		@@ -1,43 +1,20 @@
		import { Box, Container, Flex, useBreakpointValue } from "@chakra-ui/react";
		import { useScrollPosition } from "@n8tb1t/use-scroll-position";

[Dashboard] Remove use-scroll-position #5274

[Dashboard] Remove use-scroll-position #5274

Conversation

kien-ngo commented Nov 3, 2024 • edited by pr-codex bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Problem solved

PR-Codex overview

Detailed summary

Uh oh!

vercel bot commented Nov 3, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

changeset-bot bot commented Nov 3, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

⚠️ No Changeset found

Uh oh!

graphite-app bot commented Nov 3, 2024

Your org has enabled the Graphite merge queue for merging into main

Uh oh!

kien-ngo commented Nov 3, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

kien-ngo Nov 3, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

codecov bot commented Nov 3, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Codecov Report

Uh oh!

github-actions bot commented Nov 3, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

size-limit report 📦

Uh oh!

MananTank Nov 4, 2024

Choose a reason for hiding this comment

Uh oh!

kien-ngo Nov 4, 2024

Choose a reason for hiding this comment

Uh oh!

kien-ngo Nov 5, 2024 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

jnsdls Nov 5, 2024

Choose a reason for hiding this comment

Uh oh!

kien-ngo Nov 5, 2024

Choose a reason for hiding this comment

Uh oh!

MananTank left a comment

Choose a reason for hiding this comment

Uh oh!

jnsdls Nov 5, 2024

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

kien-ngo commented Nov 3, 2024 •

edited by pr-codex bot

Loading

vercel bot commented Nov 3, 2024 •

edited

Loading

changeset-bot bot commented Nov 3, 2024 •

edited

Loading

kien-ngo commented Nov 3, 2024 •

edited

Loading

kien-ngo Nov 3, 2024 •

edited

Loading

codecov bot commented Nov 3, 2024 •

edited

Loading

github-actions bot commented Nov 3, 2024 •

edited

Loading

kien-ngo Nov 5, 2024 •

edited

Loading