From 8da42095c6001ec2a4c552dba75028e5fc5cb73a Mon Sep 17 00:00:00 2001
From: Jeff Emmett <jeffemmett@gmail.com>
Date: Sun, 15 Mar 2026 11:58:02 -0700
Subject: [PATCH] fix(rwallet): show yield rates standalone on /yield page
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Yield tab now auto-loads rates on page init and renders independently
of wallet detection — no longer gated behind hasData(). Shows rates
comparison table, header with description, and back button.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 .../rwallet/components/folk-wallet-viewer.ts  | 35 ++++++++++++++++---
 1 file changed, 31 insertions(+), 4 deletions(-)

diff --git a/modules/rwallet/components/folk-wallet-viewer.ts b/modules/rwallet/components/folk-wallet-viewer.ts
index 1c76665..4f7b8d2 100644
--- a/modules/rwallet/components/folk-wallet-viewer.ts
+++ b/modules/rwallet/components/folk-wallet-viewer.ts
@@ -230,6 +230,7 @@ class FolkWalletViewer extends HTMLElement {
 
 			this.render();
 			if (this.topTab === "visualizer" && this.address) this.detectChains();
+			if (this.activeView === "yield") this.loadYieldData();
 		}
 		if (!localStorage.getItem("rwallet_tour_done")) {
 			setTimeout(() => this._tour.start(), 1200);
@@ -1421,6 +1422,18 @@ class FolkWalletViewer extends HTMLElement {
 				display: block; max-width: 720px; margin: 20px auto 0; text-align: center;
 			}
 
+			/* ── Yield header ── */
+			.yield-header { margin-bottom: 24px; }
+			.yield-header-row {
+				display: flex; align-items: flex-start; justify-content: space-between; gap: 16px;
+			}
+			.yield-header-title {
+				font-size: 20px; font-weight: 700; color: var(--rs-text-primary); margin: 0 0 6px;
+			}
+			.yield-header-desc {
+				font-size: 13px; color: var(--rs-text-secondary); margin: 0; line-height: 1.5; max-width: 560px;
+			}
+
 			/* ── Yield tab ── */
 			.yield-summary {
 				background: var(--rs-bg-surface); border: 1px solid var(--rs-border-subtle);
@@ -1910,6 +1923,19 @@ class FolkWalletViewer extends HTMLElement {
 		</div>`;
 	}
 
+	private renderYieldStandaloneHeader(): string {
+		return `
+		<div class="yield-header">
+			<div class="yield-header-row">
+				<div>
+					<h2 class="yield-header-title">Stablecoin Yield</h2>
+					<p class="yield-header-desc">Compare APY rates across Aave V3 and Morpho Blue vaults on Ethereum and Base. Deposit idle USDC, USDT, or DAI through your Safe multisig.</p>
+				</div>
+				<button class="view-tab" data-view="balances" style="white-space:nowrap">Back to Balances</button>
+			</div>
+		</div>`;
+	}
+
 	private renderYieldTab(): string {
 		if (this.yieldLoading) {
 			return '<div class="loading"><span class="spinner"></span> Loading yield data...</div>';
@@ -2165,14 +2191,15 @@ class FolkWalletViewer extends HTMLElement {
 			` : ""}
 		</div>
 
-		${this.renderSupportedChains()}
+		${this.activeView !== "yield" ? this.renderSupportedChains() : ""}
 
 		${this.error ? `<div class="error">${this.esc(this.error)}</div>` : ""}
 		${this.loading ? '<div class="loading"><span class="spinner"></span> Detecting wallet across chains...</div>' : ""}
 
-		${this.renderFeatures()}
-		${this.renderExamples()}
-		${this.renderDashboard()}
+		${this.activeView === "yield"
+			? `${this.renderYieldStandaloneHeader()}${this.renderYieldTab()}`
+			: `${this.renderFeatures()}${this.renderExamples()}${this.renderDashboard()}`
+		}
 		`;
 	}