# Verify-completion audit — 2026-05-21

## NAN-480 — [Premium] Unlock icon — wrong icon + wrong position
Linear: https://linear.app/nanostreet/issue/NAN-480/premium-unlock-icon-wrong-icon-wrong-position
Title: [Premium] Unlock icon — wrong icon + wrong position
Status: In Progress (High priority)

> **No explicit AC list in ticket.** Description has two bullets: (1) wrong icon style, (2) position also off. ACs inferred from those bullets + title. Figma reference is embedded in a Slack thread (not accessible here); scoring is against the code evidence only.

---

### The component in question

`LockedOverlay` is the shared premium-gate UI: blurred content + gradient + CTA ("Unlock premium content" + "Upgrade" button). It is the only component that renders the unlock icon on screen. Callers:

| File | Variant / Anchor |
|---|---|
| `src/features/stock-detail/presentation/components/smart-score/NanoScoreTab.tsx:91` | card / top |
| `src/features/stock-detail/presentation/components/earnings/EarningsTab.tsx:117` | card / top |
| `src/features/stock-detail/presentation/components/overview/OverviewContent.tsx:145` | card / top |
| `src/features/stock-detail/presentation/components/valuation/ValuationOverviewScreen.tsx:96` | card / top |
| `src/shared/ui/SmartTipsCard.tsx:104,146` | card / center (default) |

`PaywallSheet.tsx` (the subscription bottom-sheet) has no lock icon at all — just text headers.

---

### Acceptance criteria (inferred)

- [NOT DONE] Unlock-premium icon uses the correct Figma style
  Evidence: `src/shared/ui/LockedOverlay.tsx:9,50` — currently imports and renders `PremiumLockIcon` at `size={24}` with `color={brand[300]}`.
  Notes: `PremiumLockIcon` (`src/shared/ui/icons/PremiumLockIcon.tsx`) is a stroke-only padlock (no filled body, `strokeWidth={1.5}`, `viewBox="0 0 17.5 19.5"`). Ben flagged this as wrong style in TestFlight. The ticket pre-dates this audit and is "In Progress" — no fix has been merged to main yet (HEAD = 5cc8f9f7). Three other lock variants exist in the icon library:
  - `LockIcon` — filled body + stroke; viewBox `-2.06665 -1.4 16 16`; used for password fields, lesson locks
  - `LockPadlockIcon` — stroke-only, different proportions; viewBox `-2.73335 -1.9 20 20`; **defined but not used anywhere in the codebase**
  - `LockLearningIcon` — filled body + stroke, same paths as LockPadlockIcon; used in learn feature
  Without the Figma node or Ben's Slack screenshot, the correct replacement cannot be confirmed from code alone — but `PremiumLockIcon` is confirmed as the current (wrong) icon and no code change has landed.

- [NOT DONE] Icon is correctly positioned per Figma
  Evidence: `src/shared/ui/LockedOverlay.tsx:46-53` — icon rendered inside `styles.textGroup`; `src/shared/ui/LockedOverlay.tsx:84` — `textGroup: { alignItems: 'center', gap: 8 }` (no `flexDirection`, so default column).
  Notes: Current layout stacks the icon directly above the "Unlock premium content" text (vertical, centered). Both elements are then stacked above the "Upgrade" button inside the absolutely-positioned `content` View. Ben flagged "position also off" — likely referring to this icon-above-text stacking vs. a different Figma layout (e.g., icon inline with text, or icon in a different location on the overlay entirely). No layout change has been merged.

### Overall: NOT DONE (not yet implemented)
Recommendation: Both the icon variant and its position are unchanged from what Ben flagged. Fix requires: (1) identify correct icon from Figma node (ticket links to Slack screenshot, not a Figma node-id), (2) swap `PremiumLockIcon` → correct variant in `LockedOverlay.tsx:50`, (3) adjust `styles.textGroup` layout to match Figma position. `LockPadlockIcon` is the only lock icon currently unused and could be the intended replacement — verify against design before swapping.

---

## Linear access
MCP worked on retry (first call rejected with deprecated-transport signal; second call succeeded).