Issue #606: Vaults explorer page #611

jahabeebs · 2024-07-04T03:13:28Z

closes #606
closes #615

Description

Create a new "/explore" page
Copy the code from marketplace to display all vaults in a table
Pull data from the subgraph
Updated yarn lock file which was failing

Screenshots

Mobile

Desktop

Responsive

explore.mov

vercel · 2024-07-04T03:13:33Z

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

Name	Status	Preview	Updated (UTC)
od-app	✅ Ready (Inspect)	Visit Preview	Jul 10, 2024 0:16am
od-app-hai	✅ Ready (Inspect)	Visit Preview	Jul 10, 2024 0:16am
od-app-testnet	✅ Ready (Inspect)	Visit Preview	Jul 10, 2024 0:16am

pi0neerpat

svg render issue
add collateral and debt amounts

jahabeebs · 2024-07-05T22:52:55Z

svg render issue

add collateral and debt amounts

I made the following changes

I found that the rendering issue only occurs when sorting by "ID" and "collateral". I tried to fix the rendering issue in a number of ways (triggering more re-renders with useEffect, annotating rows with unique ids, consolidating into one component, comparing with the marketplace logic) but there must be something going on with how tanstack is re-rendering the rows, because I wasn't able to get them to re-render correctly. I had to disable sorting by ID and collateral. The same issue is probably occurring on the marketplace route but there are so few listings either the rendering issue doesn't happen or we just don't have enough examples to see it happen
I added collateral amount and debt amount and these sort correctly without rendering issues, though I had to do some string parsing

Screenshots

test.mov

pi0neerpat · 2024-07-08T17:39:32Z

src/containers/Explore/index.tsx

+                tableRows.push({
+                    id: vault.id,
+                    collateral: vault.collateralType,
+                    image: svg ? svg : null,


Pass entire svg component here

pi0neerpat · 2024-07-08T17:39:53Z

src/containers/Explore/ExploreTable.tsx

+    columnHelper.accessor('image', {
+        header: () => '',
+        cell: (info) => {
+            const image = info.row.original.image


Maybe explorer "row.original"

pi0neerpat

Use internal link, not external link

pi0neerpat · 2024-07-08T17:45:06Z

ORDER:
ID, Image, Collateral Amount, Collateral, Debt

Collateral eg. "1,000 ARB"

jahabeebs · 2024-07-08T23:13:20Z

@pi0neerpat

I made the following changes:

Passing the entire svg component into the table and trying to find other properties in info.row didn't help the svg rendering issue, I've kept sorting disabled for ID and collateral because I've been trying for a long time but still haven't found a workaround (though if someone search a collateral type in the search bar they can filter and it doesn't affect the SVG)
I re-ordered the columns to ID, Image, Collateral Amount, Collateral, Debt
View button is now an internal link

Re-ordered columns

Re-ordered columns

Responsive

redirect.mov

pi0neerpat

Continue troubleshooting per discussion this morning

jahabeebs · 2024-07-10T00:15:26Z

Continue troubleshooting per discussion this morning

@pi0neerpat

I did the following today:

Added risk status column (Explore: risk status column #615) which we can sort by
I found our cratio calculation was incorrect sometimes, as we weren't filtering commas from numbers we were parsing and those numbers became NaN. Also, we weren't handling the differences between infinity and 0 correctly (since if a vault still has collateral it will be considered to have an infinity collateral ratio) and I fixed that. The color issue is still a problem and I'll have to debug more with a local svg package

* matomo race conditions (#613) * typo fix (#618) * Issue #606: Vaults explorer page (#611) * explore page * explore page more changes * fix explore page * more explore page fixes * revert yarn lock * explore table reorder, external link * add risk status, fix bugs * remove fuul (#620) * bump sdk (#621) * remove maintenance from bolts * add credit guild block (#622) * add credit guild block * update earn block * final copy * api url hotfix * Od-weth QA (#623) * round stability fee * OD_API_URL * New "initializing" loader (#609) * change waiting modal content * put modal content back * show loader if no title, text, hint, hash * rm loader modal from account checkking * close loader popup when vaults is fetched * prettier * fix loader and blinking * rm creating modal * prettier * lin fix * cleanup --------- Co-authored-by: Jacob Habib <47253537+jahabeebs@users.noreply.github.com> Co-authored-by: Iana <36742189+alekseevaiana@users.noreply.github.com>

* matomo race conditions (#613) * typo fix (#618) * Issue #606: Vaults explorer page (#611) * explore page * explore page more changes * fix explore page * more explore page fixes * revert yarn lock * explore table reorder, external link * add risk status, fix bugs * remove fuul (#620) * bump sdk (#621) * remove maintenance from bolts * add credit guild block (#622) * add credit guild block * update earn block * final copy * api url hotfix * Od-weth QA (#623) * round stability fee * OD_API_URL * New "initializing" loader (#609) * change waiting modal content * put modal content back * show loader if no title, text, hint, hash * rm loader modal from account checkking * close loader popup when vaults is fetched * prettier * fix loader and blinking * rm creating modal * prettier * lin fix * cleanup * Borrow + Deposit tabs cleanup (#631) * shape of tabs * tabs font styles * borders * fix lint warning * cleanup * Address ENS loading skeleton (#632) * add skeleton to vault stats * sidemenu and wallet info navbar * base color for skeleton in vault stats * base color for skeleton in ean page * prettier * Update react, react-router (#602) * widget at v2.10.2 * add yarn.lock * Update react-router to v6 * Update widget to v3 * add mui packages * fix onboarding props issue * yarn lock * make compatible with react router dom v6 * remove lifi widget * remove widget --------- Co-authored-by: jahabeebs <jahgoreds@gmail.com> * Issue #557: View internal balances (#633) * initial balance draft * initial balance draft * bump sdk version * fix lock file * fix lock file * fix lock file * fix vault block issue * fix infinite loop when pushed from other page (#640) * Issue #630: Explore page design improvements (#639) * explore page improvements * reuse function * fix svg rendering issue * fix navigate issue (#643) * Add GRT (#652) * Bump sdk to v1.7.4-rc.3 * lint * Issue #642: Reconnect on refresh (#644) * reconnect on refresh * fix loading logic * bump svg generator (#649) Co-authored-by: Patrick Gallagher <blockchainbuddha@gmail.com> * bump sdk --------- Co-authored-by: Jacob Habib <47253537+jahabeebs@users.noreply.github.com> Co-authored-by: Iana <36742189+alekseevaiana@users.noreply.github.com> Co-authored-by: jahabeebs <jahgoreds@gmail.com>

* matomo race conditions (#613) * typo fix (#618) * Issue #606: Vaults explorer page (#611) * explore page * explore page more changes * fix explore page * more explore page fixes * revert yarn lock * explore table reorder, external link * add risk status, fix bugs * remove fuul (#620) * bump sdk (#621) * remove maintenance from bolts * add credit guild block (#622) * add credit guild block * update earn block * final copy * api url hotfix * Od-weth QA (#623) * round stability fee * OD_API_URL * New "initializing" loader (#609) * change waiting modal content * put modal content back * show loader if no title, text, hint, hash * rm loader modal from account checkking * close loader popup when vaults is fetched * prettier * fix loader and blinking * rm creating modal * prettier * lin fix * cleanup * Borrow + Deposit tabs cleanup (#631) * shape of tabs * tabs font styles * borders * fix lint warning * cleanup * Address ENS loading skeleton (#632) * add skeleton to vault stats * sidemenu and wallet info navbar * base color for skeleton in vault stats * base color for skeleton in ean page * prettier * Update react, react-router (#602) * widget at v2.10.2 * add yarn.lock * Update react-router to v6 * Update widget to v3 * add mui packages * fix onboarding props issue * yarn lock * make compatible with react router dom v6 * remove lifi widget * remove widget --------- Co-authored-by: jahabeebs <jahgoreds@gmail.com> * Issue #557: View internal balances (#633) * initial balance draft * initial balance draft * bump sdk version * fix lock file * fix lock file * fix lock file * fix vault block issue * fix infinite loop when pushed from other page (#640) * Issue #630: Explore page design improvements (#639) * explore page improvements * reuse function * fix svg rendering issue * fix navigate issue (#643) * Add GRT (#652) * Bump sdk to v1.7.4-rc.3 * lint * Issue #642: Reconnect on refresh (#644) * reconnect on refresh * fix loading logic * bump svg generator (#649) Co-authored-by: Patrick Gallagher <blockchainbuddha@gmail.com> * bump sdk * Replace all 'any' with correct Types (#638) * rm any from global styles: safe ones * global style: unused, wrong and empty * styling any * errors types and events * prettier and earn index strings type * earn and bolts * add pool data type * rm ts-ignore * lint fix * QA: Tracking error, empty vault (#645) * add error message when vault not excists * fix Tracking error * add error color * lint fix * cleanup console.log * App meta tags (#657) * update helmet * meta tags to home page * change home meta tags texts * vaults meta tags * create meta tags component * add tags to earn and stats * add bg to stats page * stats meta * add other meta tags to main pages * prettier * Issue #656 (app PR): country.is failure (#660) * add geoblock * no ip call * consolidate calls * Add PT-rETH PT-wstETH (#661) * update sdk * bump sdk * update icons * QA: Header (#646) * side menu fixed width * side menu display none id screen is wide * fix account arrangement * change camelot link color * fix bg (#659) * fix gnosis safe (#664) --------- Co-authored-by: Jacob Habib <47253537+jahabeebs@users.noreply.github.com> Co-authored-by: Iana <36742189+alekseevaiana@users.noreply.github.com> Co-authored-by: jahabeebs <jahgoreds@gmail.com>

* matomo race conditions (#613) * typo fix (#618) * Issue #606: Vaults explorer page (#611) * explore page * explore page more changes * fix explore page * more explore page fixes * revert yarn lock * explore table reorder, external link * add risk status, fix bugs * remove fuul (#620) * bump sdk (#621) * remove maintenance from bolts * add credit guild block (#622) * add credit guild block * update earn block * final copy * api url hotfix * Od-weth QA (#623) * round stability fee * OD_API_URL * New "initializing" loader (#609) * change waiting modal content * put modal content back * show loader if no title, text, hint, hash * rm loader modal from account checkking * close loader popup when vaults is fetched * prettier * fix loader and blinking * rm creating modal * prettier * lin fix * cleanup * Borrow + Deposit tabs cleanup (#631) * shape of tabs * tabs font styles * borders * fix lint warning * cleanup * Address ENS loading skeleton (#632) * add skeleton to vault stats * sidemenu and wallet info navbar * base color for skeleton in vault stats * base color for skeleton in ean page * prettier * Update react, react-router (#602) * widget at v2.10.2 * add yarn.lock * Update react-router to v6 * Update widget to v3 * add mui packages * fix onboarding props issue * yarn lock * make compatible with react router dom v6 * remove lifi widget * remove widget --------- Co-authored-by: jahabeebs <jahgoreds@gmail.com> * Issue #557: View internal balances (#633) * initial balance draft * initial balance draft * bump sdk version * fix lock file * fix lock file * fix lock file * fix vault block issue * fix infinite loop when pushed from other page (#640) * Issue #630: Explore page design improvements (#639) * explore page improvements * reuse function * fix svg rendering issue * fix navigate issue (#643) * Add GRT (#652) * Bump sdk to v1.7.4-rc.3 * lint * Issue #642: Reconnect on refresh (#644) * reconnect on refresh * fix loading logic * bump svg generator (#649) Co-authored-by: Patrick Gallagher <blockchainbuddha@gmail.com> * bump sdk * Replace all 'any' with correct Types (#638) * rm any from global styles: safe ones * global style: unused, wrong and empty * styling any * errors types and events * prettier and earn index strings type * earn and bolts * add pool data type * rm ts-ignore * lint fix * QA: Tracking error, empty vault (#645) * add error message when vault not excists * fix Tracking error * add error color * lint fix * cleanup console.log * App meta tags (#657) * update helmet * meta tags to home page * change home meta tags texts * vaults meta tags * create meta tags component * add tags to earn and stats * add bg to stats page * stats meta * add other meta tags to main pages * prettier * Issue #656 (app PR): country.is failure (#660) * add geoblock * no ip call * consolidate calls * Add PT-rETH PT-wstETH (#661) * update sdk * bump sdk * update icons * QA: Header (#646) * side menu fixed width * side menu display none id screen is wide * fix account arrangement * change camelot link color * fix bg (#659) * fix gnosis safe (#664) * fix stability fee by removing multiplication (#667) (#668) * fix stability fee by removing multiplication * lint cleanup --------- Co-authored-by: Jacob Habib <47253537+jahabeebs@users.noreply.github.com> Co-authored-by: Iana <36742189+alekseevaiana@users.noreply.github.com> Co-authored-by: jahabeebs <jahgoreds@gmail.com>

* matomo race conditions (#613) * typo fix (#618) * Issue #606: Vaults explorer page (#611) * explore page * explore page more changes * fix explore page * more explore page fixes * revert yarn lock * explore table reorder, external link * add risk status, fix bugs * remove fuul (#620) * bump sdk (#621) * remove maintenance from bolts * add credit guild block (#622) * add credit guild block * update earn block * final copy * api url hotfix * Od-weth QA (#623) * round stability fee * OD_API_URL * New "initializing" loader (#609) * change waiting modal content * put modal content back * show loader if no title, text, hint, hash * rm loader modal from account checkking * close loader popup when vaults is fetched * prettier * fix loader and blinking * rm creating modal * prettier * lin fix * cleanup * Borrow + Deposit tabs cleanup (#631) * shape of tabs * tabs font styles * borders * fix lint warning * cleanup * Address ENS loading skeleton (#632) * add skeleton to vault stats * sidemenu and wallet info navbar * base color for skeleton in vault stats * base color for skeleton in ean page * prettier * Update react, react-router (#602) * widget at v2.10.2 * add yarn.lock * Update react-router to v6 * Update widget to v3 * add mui packages * fix onboarding props issue * yarn lock * make compatible with react router dom v6 * remove lifi widget * remove widget --------- Co-authored-by: jahabeebs <jahgoreds@gmail.com> * Issue #557: View internal balances (#633) * initial balance draft * initial balance draft * bump sdk version * fix lock file * fix lock file * fix lock file * fix vault block issue * fix infinite loop when pushed from other page (#640) * Issue #630: Explore page design improvements (#639) * explore page improvements * reuse function * fix svg rendering issue * fix navigate issue (#643) * Add GRT (#652) * Bump sdk to v1.7.4-rc.3 * lint * Issue #642: Reconnect on refresh (#644) * reconnect on refresh * fix loading logic * bump svg generator (#649) Co-authored-by: Patrick Gallagher <blockchainbuddha@gmail.com> * bump sdk * Replace all 'any' with correct Types (#638) * rm any from global styles: safe ones * global style: unused, wrong and empty * styling any * errors types and events * prettier and earn index strings type * earn and bolts * add pool data type * rm ts-ignore * lint fix * QA: Tracking error, empty vault (#645) * add error message when vault not excists * fix Tracking error * add error color * lint fix * cleanup console.log * App meta tags (#657) * update helmet * meta tags to home page * change home meta tags texts * vaults meta tags * create meta tags component * add tags to earn and stats * add bg to stats page * stats meta * add other meta tags to main pages * prettier * Issue #656 (app PR): country.is failure (#660) * add geoblock * no ip call * consolidate calls * Add PT-rETH PT-wstETH (#661) * update sdk * bump sdk * update icons * QA: Header (#646) * side menu fixed width * side menu display none id screen is wide * fix account arrangement * change camelot link color * fix bg (#659) * fix gnosis safe (#664) * fix stability fee by removing multiplication (#667) * fix stability fee by removing multiplication * lint cleanup * fix stability fee by removing multiplication (#667) (#668) * fix stability fee by removing multiplication * lint cleanup * Remove low gas modal (#671) * Remove low gas modal (#672) * fix stability fee by removing multiplication (#667) * fix stability fee by removing multiplication * lint cleanup * Remove low gas modal (#671) * Add ARB-Griff (#665) * update sdk * bump sdk * add arb-griff icon * bump sdk to v1.7.6 * Add Arb-griff (#674) * fix stability fee by removing multiplication (#667) * fix stability fee by removing multiplication * lint cleanup * Remove low gas modal (#671) * Add ARB-Griff (#665) * update sdk * bump sdk * add arb-griff icon * bump sdk to v1.7.6 * Auction fixes (#637) * chains config improvement * Fix auction block * Cleanup payment flow * max amount error handling * lint --------- Co-authored-by: Jacob Habib <47253537+jahabeebs@users.noreply.github.com> Co-authored-by: Iana <36742189+alekseevaiana@users.noreply.github.com> Co-authored-by: jahabeebs <jahgoreds@gmail.com>

jahabeebs added 3 commits July 3, 2024 17:01

explore page

711f4de

explore page more changes

2554859

fix explore page

d4c5f6f

jahabeebs requested a review from pi0neerpat July 4, 2024 03:13

jahabeebs self-assigned this Jul 4, 2024

github-actions bot added size/XL web labels Jul 4, 2024

pi0neerpat requested changes Jul 5, 2024

View reviewed changes

more explore page fixes

e04cc71

vercel bot had a problem deploying to Preview – od-app-testnet July 5, 2024 22:45 Failure

vercel bot had a problem deploying to Preview – od-app July 5, 2024 22:46 Failure

vercel bot had a problem deploying to Preview – od-app-hai July 5, 2024 22:46 Failure

jahabeebs requested a review from pi0neerpat July 5, 2024 22:52

revert yarn lock

dc32ac5

vercel bot deployed to Preview – od-app-hai July 5, 2024 22:57 View deployment

vercel bot deployed to Preview – od-app-testnet July 5, 2024 22:59 View deployment

vercel bot deployed to Preview – od-app July 5, 2024 23:01 View deployment

pi0neerpat requested changes Jul 8, 2024

View reviewed changes

explore table reorder, external link

1e00fc1

vercel bot deployed to Preview – od-app-testnet July 8, 2024 23:10 View deployment

vercel bot deployed to Preview – od-app-hai July 8, 2024 23:12 View deployment

jahabeebs requested a review from pi0neerpat July 8, 2024 23:13

vercel bot deployed to Preview – od-app July 8, 2024 23:14 View deployment

pi0neerpat requested changes Jul 9, 2024

View reviewed changes

add risk status, fix bugs

b37525f

vercel bot deployed to Preview – od-app-hai July 10, 2024 00:14 View deployment

vercel bot deployed to Preview – od-app July 10, 2024 00:14 View deployment

vercel bot deployed to Preview – od-app-testnet July 10, 2024 00:16 View deployment

pi0neerpat mentioned this pull request Jul 10, 2024

/explore continued #619

Closed

pi0neerpat approved these changes Jul 10, 2024

View reviewed changes

pi0neerpat merged commit 75431ce into dev Jul 10, 2024
10 checks passed

pi0neerpat deleted the feature/606-vaults-explore-page branch July 10, 2024 03:40

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Issue #606: Vaults explorer page #611

Issue #606: Vaults explorer page #611

jahabeebs commented Jul 4, 2024 •

edited

Loading

vercel bot commented Jul 4, 2024 •

edited

Loading

pi0neerpat left a comment

jahabeebs commented Jul 5, 2024

pi0neerpat Jul 8, 2024

pi0neerpat Jul 8, 2024

pi0neerpat left a comment

pi0neerpat commented Jul 8, 2024

jahabeebs commented Jul 8, 2024

pi0neerpat left a comment

jahabeebs commented Jul 10, 2024

Issue #606: Vaults explorer page #611

Issue #606: Vaults explorer page #611

Conversation

jahabeebs commented Jul 4, 2024 • edited Loading

Description

Screenshots

vercel bot commented Jul 4, 2024 • edited Loading

pi0neerpat left a comment

Choose a reason for hiding this comment

jahabeebs commented Jul 5, 2024

Screenshots

pi0neerpat Jul 8, 2024

Choose a reason for hiding this comment

pi0neerpat Jul 8, 2024

Choose a reason for hiding this comment

pi0neerpat left a comment

Choose a reason for hiding this comment

pi0neerpat commented Jul 8, 2024

jahabeebs commented Jul 8, 2024

pi0neerpat left a comment

Choose a reason for hiding this comment

jahabeebs commented Jul 10, 2024

jahabeebs commented Jul 4, 2024 •

edited

Loading

vercel bot commented Jul 4, 2024 •

edited

Loading