Execution time for trades table #425

shoom3301 · 2023-04-05T13:59:20Z

Summary

Closes #424

Changes

For trades added fetching of blocks timestamps using web3.eth.getBlock()
The loading shimmer is displayed while blocks timestamps are loading
The trades table must be displayed even if we couldn't load timestamps (due to separated useEffect())

vercel · 2023-04-05T13:59:24Z

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

Name	Status	Preview	Comments	Updated (UTC)
explorer-dev	✅ Ready (Inspect)	Visit Preview	💬 Add feedback

📖 Storybook ↗︎

elena-zh · 2023-04-05T14:36:04Z

Hey @shoom3301 , great job!
One nitpick: when the shimmering effect is running, revert price option goes to the default state. Could we please not revert it back at this time?
Also, the screen is blinking when the data is updated. See the video: https://www.loom.com/share/e21b768d5e2d404d9e50cc0102ae89bb

Could you please enhance this behavior a bit?

Thank you!

src/hooks/useOperatorTrades.ts

alfetopito · 2023-04-05T14:57:37Z

Also, can you add the full ISO date string to the date on hover?
Actually, on click. See how it behaves on the details tab

…l/explorer into partial-fills-table-2 # Conflicts: # src/components/orders/OrderDetails/FillsTable.tsx

shoom3301 · 2023-04-06T07:44:09Z

Also, can you add the full ISO date string to the date on hover? Actually, on click. See how it behaves on the details tab

@alfetopito It's already integrated, as I can see there is the same components as in details tab

shoom3301 · 2023-04-06T08:33:53Z

Hey @shoom3301 , great job! One nitpick: when the shimmering effect is running, revert price option goes to the default state. Could we please not revert it back at this time? Also, the screen is blinking when the data is updated. See the video: https://www.loom.com/share/e21b768d5e2d404d9e50cc0102ae89bb

Could you please enhance this behavior a bit?

Thank you!

@alfetopito Can you reproduce it? I can't

alfetopito · 2023-04-06T09:35:30Z

Hey @shoom3301 , great job! One nitpick: when the shimmering effect is running, revert price option goes to the default state. Could we please not revert it back at this time? Also, the screen is blinking when the data is updated. See the video: https://www.loom.com/share/e21b768d5e2d404d9e50cc0102ae89bb
Could you please enhance this behavior a bit?
Thank you!

@alfetopito Can you reproduce it? I can't

I could do it before, but now that the refreshing is gone, no more.

Also, can you add the full ISO date string to the date on hover? Actually, on click. See how it behaves on the details tab

@alfetopito It's already integrated, as I can see there is the same components as in details tab

🤦 I hovered over and saw nothing, forgot to click

nenadV91 · 2023-04-06T09:51:34Z

I can see this what Elena wrote "Also, the screen is blinking when the data is updated"
https://www.loom.com/share/b65daf10fd6d481e9e855dfc07830bf0

It seems that on each update there is a short moment where the whole page content reloads and it shows initial loader

anxolin

I really like the PR, and we should add it.

However, I also think we should convince backend to add this in the returned data, and delete it later.

Also this will benefit other apps including CoW Swap. In my opinion is important for the API

src/hooks/useOperatorTrades.ts

isFirstLoading - seems to be excessive, because we should display loader only once at start and areTokensLoaded is enough

…l/explorer into partial-fills-table-2

alfetopito

The whole page doesn't blink anymore!

Now only the tabs do 😅

Screen.Recording.2023-04-06.at.12.04.42.mov

Now it actually means isFirstLoading

shoom3301 · 2023-04-06T11:39:04Z

@alfetopito thanks! Fixed

* Refactoring to make the code unambiguous and reduced lines of code 38->12 * Fixed displaying of order assets info in <FilledProgress/> * Fixed layout for FillsTable component 1. Added <TokenAmount> component for buy/sell/execution amounts. It helps to display them shorter 2. Fixed displaying of "View batch graph" button, it was too big for mobile view 3. Fixed global layout (in MainWrapper) to fix page with in mobile view. Warning! This change might brake smth in other pages * Fixed filled progress width for DetailsTable in mobile view * Execution price calculation for Fills table * Added invert button for mobile layout * isPriceInverted * Execution time for trades table (#425) * Execution time for trades table * TradesTimestamps type * Fix type * Fix type * Cache for fetchTradesTimestamps() * Fixed blinking of fills table isFirstLoading - seems to be excessive, because we should display loader only once at start and areTokensLoaded is enough * Fixed lint errors and remove node version restriction * Rollback node restriction * Changed isLoading flag meaning in useOrderTrades() Now it actually means isFirstLoading * Fix lint errors (#426)

elena-zh · 2023-04-10T10:53:51Z

LGTM

* Remove unused css * add view fills button * add TableHeading layout * Update fills component * Fix stories * Small fix * Fix percent formatting (#413) * Fix error displaying 0% and 100% * Add testing for formatting function * Rmove helper function * Style fixes for Order fills page (#423) * Refactoring to make the code unambiguous and reduced lines of code 38->12 * Fixed displaying of order assets info in <FilledProgress/> * Fixed layout for FillsTable component 1. Added <TokenAmount> component for buy/sell/execution amounts. It helps to display them shorter 2. Fixed displaying of "View batch graph" button, it was too big for mobile view 3. Fixed global layout (in MainWrapper) to fix page with in mobile view. Warning! This change might brake smth in other pages * Fixed filled progress width for DetailsTable in mobile view * Execution price calculation for Fills table * Added invert button for mobile layout * isPriceInverted * Execution time for trades table (#425) * Execution time for trades table * TradesTimestamps type * Fix type * Fix type * Cache for fetchTradesTimestamps() * Fixed blinking of fills table isFirstLoading - seems to be excessive, because we should display loader only once at start and areTokensLoaded is enough * Fixed lint errors and remove node version restriction * Rollback node restriction * Changed isLoading flag meaning in useOrderTrades() Now it actually means isFirstLoading * Fix lint errors (#426) * Partial fills table/#437 fix fill or kill txhash (#438) * Removed old placeholder * Fixed txhash for fill or kill orders * Do not mutate original obj * Do not show fills tab for fill or kill orders (#439) * Do not show fills tab for fill or kill orders * Hide fills button * Do not show fills tab for orders with single fills * Do not show fills tab if there are no trades * Moved fills button display logic to parent component * Show tx hash for partial fills with single fill * Updated label to be explicit about partial fills * Fixed storybook * Consistently using the same rule for displaying the fills tab, button and tx hash row: When there are 2 trades or more, show fills tab and button, and hide tx hash row * Do not show fills tab if there are no trades 🤦 * Partial fills table surplus (#440) * Added new component SurplusComponent * Added calculation for trade surplus getTradeSurplus * Added surplus to fills table * Refactored OrderSurplusDisplay to use SurplusComponent * Fixed issue with surplus tooltip * Removed buy amount value by mistake 😅 * Partial fills table adjust columns (#442) * Inverted sell amount and buy amount positions on fills table * Removed batch viewer link column from fills tab * Moved surplus column to after buy amount on fills tab * Added total surplus to fills table * Removed `of <total amount>` from filled progress * Partial fills table styling (#443) * partial fills table styling * partial fills table styling * conditional lineBreak for filled amount * Table header arrow wrap * fix arrow green * add surplus green icon to fills * remove bottom border * remove bottom border * fix top padding sticky cards * revert button wrapping --------- Co-authored-by: fairlight <31534717+fairlighteth@users.noreply.github.com> --------- Co-authored-by: Mati Dastugue <mdastugu@amazon.com> Co-authored-by: Agustín Longoni <agustin.longoni@altoros.com> Co-authored-by: Alexandr Kazachenko <shoom3301@gmail.com> Co-authored-by: Alfetopito <alfetopito@users.noreply.github.com> Co-authored-by: fairlight <31534717+fairlighteth@users.noreply.github.com>

Execution time for trades table

175f4e8

shoom3301 requested review from a team April 5, 2023 13:59

shoom3301 self-assigned this Apr 5, 2023

shoom3301 mentioned this pull request Apr 5, 2023

Style fixes for Order fills page #423

Merged

TradesTimestamps type

172502a

vercel bot had a problem deploying to Preview April 5, 2023 14:03 Failure

Fix type

569794b

vercel bot had a problem deploying to Preview April 5, 2023 14:06 Failure

Fix type

dacbcd1

vercel bot deployed to Preview April 5, 2023 14:10 View deployment

alfetopito reviewed Apr 5, 2023

View reviewed changes

src/hooks/useOperatorTrades.ts Outdated Show resolved Hide resolved

Merge branch 'partial-fills-table-1' of https://github.com/cowprotoco…

d38ceb6

…l/explorer into partial-fills-table-2 # Conflicts: # src/components/orders/OrderDetails/FillsTable.tsx

vercel bot deployed to Preview April 6, 2023 07:04 View deployment

Cache for fetchTradesTimestamps()

7f8b0d6

alfetopito approved these changes Apr 6, 2023

View reviewed changes

vercel bot deployed to Preview April 6, 2023 10:17 View deployment

anxolin approved these changes Apr 6, 2023

View reviewed changes

src/hooks/useOperatorTrades.ts Outdated Show resolved Hide resolved

src/hooks/useOperatorTrades.ts Outdated Show resolved Hide resolved

src/hooks/useOperatorTrades.ts Show resolved Hide resolved

src/hooks/useOperatorTrades.ts Outdated Show resolved Hide resolved

shoom3301 added 2 commits April 6, 2023 16:58

Fixed blinking of fills table

068988c

isFirstLoading - seems to be excessive, because we should display loader only once at start and areTokensLoaded is enough

Merge branch 'partial-fills-table-1' of https://github.com/cowprotoco…

1bde272

…l/explorer into partial-fills-table-2

vercel bot deployed to Preview April 6, 2023 11:02 View deployment

alfetopito reviewed Apr 6, 2023

View reviewed changes

Fixed lint errors and remove node version restriction

8c912de

vercel bot deployed to Preview April 6, 2023 11:21 View deployment

Rollback node restriction

42b9aee

vercel bot deployed to Preview April 6, 2023 11:30 View deployment

Changed isLoading flag meaning in useOrderTrades()

bde686c

Now it actually means isFirstLoading

vercel bot deployed to Preview April 6, 2023 11:40 View deployment

Fix lint errors (#426)

32c8f60

vercel bot deployed to Preview April 6, 2023 11:46 View deployment

alfetopito approved these changes Apr 6, 2023

View reviewed changes

nenadV91 approved these changes Apr 6, 2023

View reviewed changes

alfetopito merged commit f8996df into partial-fills-table-1 Apr 6, 2023

alfetopito deleted the partial-fills-table-2 branch April 6, 2023 17:32

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Execution time for trades table #425

Execution time for trades table #425

shoom3301 commented Apr 5, 2023

vercel bot commented Apr 5, 2023 •

edited by github-actions bot

Loading

elena-zh commented Apr 5, 2023

alfetopito commented Apr 5, 2023

shoom3301 commented Apr 6, 2023

shoom3301 commented Apr 6, 2023

alfetopito commented Apr 6, 2023

nenadV91 commented Apr 6, 2023

anxolin left a comment

alfetopito left a comment

shoom3301 commented Apr 6, 2023

elena-zh commented Apr 10, 2023

Execution time for trades table #425

Execution time for trades table #425

Conversation

shoom3301 commented Apr 5, 2023

Summary

Changes

vercel bot commented Apr 5, 2023 • edited by github-actions bot Loading

elena-zh commented Apr 5, 2023

alfetopito commented Apr 5, 2023

shoom3301 commented Apr 6, 2023

shoom3301 commented Apr 6, 2023

alfetopito commented Apr 6, 2023

nenadV91 commented Apr 6, 2023

anxolin left a comment

Choose a reason for hiding this comment

alfetopito left a comment

Choose a reason for hiding this comment

shoom3301 commented Apr 6, 2023

elena-zh commented Apr 10, 2023

vercel bot commented Apr 5, 2023 •

edited by github-actions bot

Loading