[GF-18] [FRONTEND] Calculators & Simulators (APY simulator, compound projector, early exit calculator)

[wumibals]

Overview

⚠️ Depends on: #45 (GF-13 — Deposit Page, to host the APY simulator) and #47 (GF-15 — Analytics Page, for live APY input data).

Build three interactive calculators that help users understand the value of locking longer and the cost of exiting early. These are conversion tools — they turn browsing into informed depositing.

Problem

Users have no way to estimate what they will earn before depositing, or what they will lose if they exit early. Every comparable DeFi protocol (Pendle, Notional, Beefy) provides yield calculators prominently on their deposit flows. Without this, users either guess or leave.

Proposed Solution

1. APY Simulator (on /deposit page, Step 1 — Tier Selection)

An interactive input that updates in real-time as the user selects a tier and enters an amount:

Deposit: [___500___] USDC  |  Tier: [L6 ▾]
────────────────────────────────────────
At current 7-day APY (4.2%):
  Projected yield:    ~7.25 USDC
  Total at maturity:  ~17.25 USDC
  Share-units minted: 575 shares

Use live APY from useAPY(tier) (GF-12). Update projection whenever tier or amount changes.

2. Compound Projector (on /deposit page, Step 2 — Amount Input)

A simple chart (using recharts) showing the compound growth curve over the lock period:

• X axis: months (0 to lock duration)
• Y axis: portfolio value in USDC
• Shows both simple interest and compounded yield curves to illustrate the compounding effect
• Updates when tier or amount changes

3. Early Exit Calculator (on /portfolio page, inside the Early Exit confirmation modal)

Before the user confirms an early exit, show:

Current principal:      500.00 USDC
Accrued yield:          +12.34 USDC
Early exit fee (1.25%): -6.25 USDC
────────────────────────────────────
You will receive:       506.09 USDC

Remaining lock:         47 days
If you wait until maturity, you receive: ~517.25 USDC
Opportunity cost of exiting now: ~11.16 USDC

This makes the penalty concrete and helps users decide whether to wait.

Acceptance Criteria

• APY simulator appears on the deposit page tier-selection step
• Simulator updates projected yield and share-units in real-time as tier and amount change
• Simulator uses live APY from useAPY(), not hardcoded values
• Compound projector chart renders on the deposit amount step
• Both simple and compound curves are shown on the projector chart
• Early exit calculator appears inside the early exit confirmation modal on /portfolio
• Calculator shows current principal, accrued yield, fee amount, net received, and opportunity cost
• All calculations use the same fixed-point precision as the contracts (7 decimal places) to avoid display discrepancies