Fix jumping stats table after switch to last page #713
Conversation
…into fix-jumping-stats-table
|
the cause of issue is when you zoom out to 90% of view in browser. when is 100% there is no bug on prod as well. static height made another bug when view is on 90% of zoom. |
|
bug is not fixed, view is still jumping, when you have zoom for 90% in browser. (btw on solana is the same issue to fix) |
|
the footer of the table should be the same height as header of the table. when there is only one page without pagination |
|
This pull request has been deployed to Vercel.
|
There was a problem hiding this comment.
Pull Request Overview
This PR addresses the issue of a jumping stats table after switching to the last page by updating style properties and simplifying pagination logic. Key changes include:
- Removing the dependency on the initialDataLength prop in style hooks.
- Standardizing the rendering of empty rows and adjusting inline styles for border handling.
- Simplifying pagination styling and recalculating page counts in PoolList.
Reviewed Changes
Copilot reviewed 8 out of 8 changed files in this pull request and generated no comments.
Show a summary per file
| File | Description |
|---|---|
| src/components/Stats/TokensList/style.ts | Removed usage of the initialDataLength parameter and added positioning/overflow styling. |
| src/components/Stats/TokensList/TokensList.tsx | Updated useStyles invocation and adjusted empty rows rendering and pagination styles. |
| src/components/Stats/TokenListItem/style.ts | Added fixed height and boxSizing settings. |
| src/components/Stats/TokenListItem/TokenListItem.tsx | Altered inline styling to use a transparent border for hiding bottom lines. |
| src/components/Stats/PoolListItem/style.ts | Added fixed height settings for list items and headers. |
| src/components/Stats/PoolListItem/PoolListItem.tsx | Updated inline style for border management similar to TokenListItem. |
| src/components/Stats/PoolList/style.ts | Removed initialDataLength dependency and adjusted container and empty row styling. |
| src/components/Stats/PoolList/PoolList.tsx | Updated useStyles, empty row mapping, pagination styling, and recalculated page count logic. |
Comments suppressed due to low confidence (3)
src/components/Stats/TokensList/TokensList.tsx:60
- The state variable 'initialDataLength' is now unused after removing it from useStyles; consider removing it to clean up the component.
const [initialDataLength, setInitialDataLength] = useState(initialLength)
src/components/Stats/PoolList/PoolList.tsx:87
- Since the initialDataLength prop is no longer passed to useStyles, the corresponding state variable appears unused; removing it may simplify the component.
const [initialDataLength, setInitialDataLength] = useState(initialLength)
src/components/Stats/PoolList/PoolList.tsx:226
- [nitpick] Ensure that calculating the page count using Math.ceil(data.length / 10) is consistent with other parts of the application and that no off-by-one issues occur.
pages={Math.ceil(data.length / 10)}
No description provided.