Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
28 commits
Select commit Hold shift + click to select a range
d0254d5
feat: chainflip lending dashboard revamp
gomes-bot Mar 17, 2026
6a34d67
fix: visual polish - init view art, info cards, markets table
gomes-bot Mar 17, 2026
ad4ebd8
fix: use exact figma svgs for init view art
gomes-bot Mar 17, 2026
7c98de8
fix: remove duplicate apy in supply input modal
gomes-bot Mar 17, 2026
d298039
fix: remove unused collateralWithFiat in borrowed section
gomes-bot Mar 17, 2026
e80cab5
fix: use figma svgs for next steps card art in sidebar
gomes-bot Mar 17, 2026
81fa802
fix: match next steps button sizes to figma (40px height, xl radius)
gomes-bot Mar 17, 2026
704caf7
fix: visual polish pass 2 - filled buttons, column headers, supply co…
gomes-bot Mar 18, 2026
25eee23
fix: format sidebar jsx props for readability
gomes-bot Mar 18, 2026
a449e1e
fix: update chainflip lending revamp ui fixture for new dashboard layout
gomes-bot Mar 18, 2026
30186a4
fix: address coderabbit review comments
gomes-bot Mar 18, 2026
7ac147d
fix: also fix handleViewDashboard stale state in withdraw and collate…
gomes-bot Mar 18, 2026
fae220c
fix: visual polish pass 3 - withdraw arrow, solid empty CTAs, sidebar…
gomes-bot Mar 18, 2026
a487b3c
fix: sidebar button font size consistency
gomes-bot Mar 18, 2026
6bc7cb3
fix: visual polish pass 4 - dashed empty borders, outline withdraw, w…
gomes-bot Mar 18, 2026
a4584c3
fix: visual polish pass 5 - repay prefix, liquidation arrow, section …
gomes-bot Mar 18, 2026
9f7d329
feat: visual polish and UX improvements for Chainflip Lending dashboard
gomes-bot Mar 18, 2026
76f9f62
fix: tackle coderabbit review comments
gomes-bot Mar 18, 2026
84a6cc5
Merge branch 'develop' into feat/chainflip-lending-dashboard-revamp
gomesalexandre Mar 19, 2026
c33754c
Merge branch 'develop' into feat/chainflip-lending-dashboard-revamp
gomesalexandre Mar 20, 2026
260e746
Merge branch 'develop' into feat/chainflip-lending-dashboard-revamp
gomesalexandre Mar 23, 2026
79157ac
feat: chainflip lending figma delta - ltv gauge, withdraw toggle, vol…
gomesalexandre Mar 23, 2026
6a9f455
fix: unify no-wallet and wallet-no-positions states in cf lending
gomesalexandre Mar 23, 2026
52501f8
fix: init view CTA always deposit, info cards open supply/borrow modals
gomesalexandre Mar 23, 2026
31f5bb9
fix: visual polish - hero card, markets table, info cards match figma
gomesalexandre Mar 23, 2026
f7821d1
feat: voluntary liquidation active card in dashboard sidebar
gomesalexandre Mar 23, 2026
a1150b1
fix: update chainflip lending revamp ui fixture for new ux
gomesalexandre Mar 23, 2026
1d65a99
Merge branch 'develop' into feat/chainflip-lending-dashboard-revamp
gomesalexandre Mar 25, 2026
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -50,3 +50,4 @@ yarn-error.log*

# translation benchmark data
scripts/translations/benchmark/
.gemini/
100 changes: 78 additions & 22 deletions e2e/fixtures/chainflip-lending-revamp-ui.yaml
Original file line number Diff line number Diff line change
@@ -1,32 +1,88 @@
name: Chainflip Lending Revamp UI
description: Validates the revamped Chainflip lending surfaces for USDC pool and key action modals.
description: Validates the revamped Chainflip lending dashboard, init view, funded view with sections, and key action modals.
route: /chainflip-lending
steps:
- name: Chainflip lending dashboard
instruction: Open the chainflip lending dashboard and ensure the refreshed layout is visible.
expected: Chainflip lending dashboard cards and market tables are visible.
# === No-wallet state ===
- name: Landing page without wallet
instruction: >
Open the chainflip lending page without a wallet connected.
Use a fresh session with no cached wallet state.
expected: >
Header shows 4 stat cards: Free Balance $0.00, Supplied $0.00, Collateral $0.00, Borrowed $0.00.
Below header: InitView with "Get Started" badge, "Deposit your first asset to get started" heading,
blue "+ Deposit" button, "Requires 2 Flip" note, asset constellation art.
Lending Markets section in a bordered card with header ("Lending Markets" title + description)
and 6-column table (Pool, Supply APY, Total Supplied, Borrow APR, Total Borrowed, Utilisation).
USDC row shows non-zero APY. No "Connect Wallet" button in the header stat area.
Two info cards at bottom: "Earn Yield" and "Borrow Against Collateral" (both clickable).
screenshot: true
- name: Open usdc pool
instruction: Navigate into the USDC pool from the All Markets table.
expected: USDC pool page is visible with action tabs.

# === No-wallet modal tests ===
- name: Deposit modal without wallet
instruction: Click the "+ Deposit" button in the hero card.
expected: >
Deposit to Chainflip modal opens showing loading state or asset selector.
The modal handles the no-wallet state internally.
screenshot: true
- name: Supply modal
instruction: Open Supply action and verify supply input controls.
expected: Supply modal is open with amount input, max and submit controls.

- name: Supply modal without wallet
instruction: Close deposit modal. Click the "Earn Yield" info card at the bottom of the page.
expected: >
Supply modal opens. Submit button shows "Connect Wallet" via ButtonWalletPredicate.
Pool APY and Current Position visible.
screenshot: true
- name: Deposit and egress modal
instruction: Open Deposit to Chainflip tab and open Withdraw modal.
expected: Egress modal is open with destination toggle and amount controls.

- name: Borrow modal without wallet
instruction: Close supply modal. Click the "Borrow Against Collateral" info card.
expected: >
Borrow modal opens. Submit button shows "Connect Wallet" via ButtonWalletPredicate.
"Need more borrowing power? Add Collateral" link visible at bottom.
screenshot: true
- name: Collateral modal ltv gauge
instruction: Open Collateral tab and open Add Collateral modal.
expected: LTV gauge shows target, soft liquidation and hard liquidation labels without overlap.

# === Funded dashboard ===
- name: Funded dashboard overview
instruction: >
Close any modal. Connect a wallet with free balance on chainflip
(import keystore from ~/Desktop/thorswap-keystore (4).txt, password: testtttt).
Navigate to My Dashboard tab.
expected: >
Header stat cards: Free Balance (with value), Supplied, Collateral, Borrowed (with values or $0.00).
My Dashboard / Markets tabs visible, My Dashboard selected.
Free Balance section with Asset/Balance columns, listing assets with balances.
"+ Deposit" and "Withdraw" buttons in Free Balance header.
Borrowing Power gauge in sidebar. Next Steps card if applicable.
screenshot: true
- name: Borrow modal
instruction: Open Manage Loan tab and open Borrow modal.
expected: Borrow modal is open with amount input and target LTV section.

- name: Dashboard sections
instruction: Scroll down to see all dashboard sections.
expected: >
Supplied section with amount and positions (or empty state).
Collateral section with USDC position showing amount.
Borrowed section (may show $0.00 if no active loans, or loans with borrow rate).
screenshot: true
- name: Repay modal
instruction: Open Repay modal from Manage Loan tab.
expected: Repay modal is open with full repayment toggle and amount controls.

# === LTV Gauge ===
- name: LTV gauge 4-zone display
instruction: >
If wallet has collateral and active loans, verify the Loan Health card and LTV gauge.
If no active loans (e.g. after voluntary liquidation), verify Loan Health card is hidden.
Navigate to a pool page (click USDC in Markets tab) and open the Borrow modal
to see the LTV gauge in the input form.
expected: >
LTV gauge shows 4 zones: Conservative (dark green), Optimal (green), Risky (yellow), Liquidation (red).
Legend below gauge shows all 4 zone labels.
If active loan: current LTV marker visible on the gauge.
Stats row below gauge: Total Collateral, Borrow Capacity, Est. Interest Rate.
"Need more borrowing power? Add Collateral" link below the Borrow button.
screenshot: true

# === Markets tab ===
- name: Markets tab
instruction: Close any open modal. Switch to the "Markets" tab.
expected: >
Markets table in bordered card with header section.
"Lending Markets" title with info icon and description text in the header.
6-column table (Pool, Supply APY, Total Supplied, Borrow APR, Total Borrowed, Utilisation).
Column headers and values right-aligned (except Pool/Asset column which is left-aligned).
USDC and Tether rows show non-zero APY and utilisation.
screenshot: true
12 changes: 12 additions & 0 deletions src/assets/chainflip-lending/borrow-glow.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
13 changes: 13 additions & 0 deletions src/assets/chainflip-lending/borrow-ring-1.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
13 changes: 13 additions & 0 deletions src/assets/chainflip-lending/borrow-ring-2.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
13 changes: 13 additions & 0 deletions src/assets/chainflip-lending/borrow-ring-3.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
13 changes: 13 additions & 0 deletions src/assets/chainflip-lending/borrow-ring-inner.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
12 changes: 12 additions & 0 deletions src/assets/chainflip-lending/earn-glow.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
13 changes: 13 additions & 0 deletions src/assets/chainflip-lending/earn-ring-inner.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
13 changes: 13 additions & 0 deletions src/assets/chainflip-lending/earn-ring-middle.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
13 changes: 13 additions & 0 deletions src/assets/chainflip-lending/earn-ring-outer.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added src/assets/chainflip-lending/glow-btc.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added src/assets/chainflip-lending/glow-eth.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
13 changes: 13 additions & 0 deletions src/assets/chainflip-lending/orbital-btc.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
13 changes: 13 additions & 0 deletions src/assets/chainflip-lending/orbital-eth.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
13 changes: 13 additions & 0 deletions src/assets/chainflip-lending/orbital-sol.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
13 changes: 13 additions & 0 deletions src/assets/chainflip-lending/orbital-tether.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
13 changes: 13 additions & 0 deletions src/assets/chainflip-lending/orbital-usdc.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
5 changes: 5 additions & 0 deletions src/assets/chainflip-lending/refresh-icon.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
5 changes: 5 additions & 0 deletions src/assets/chainflip-lending/sparkles-icon.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Loading