From 308ef2c974808c257e94b7cc1bc54dc0f402caad Mon Sep 17 00:00:00 2001
From: adlee-was-taken <aaron.daniel.lee@gmail.com>
Date: Sat, 2 May 2026 14:17:55 -0400
Subject: [PATCH] =?UTF-8?q?feat(ext):=20add=20GLYPH=5FNEXT=20and=20replace?=
 =?UTF-8?q?=20ASCII=20arrows=20with=20=E2=96=B8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Replaces the ASCII rightwards arrow → with U+25B8 ▸ in settings-vault
buttons. Matches the existing ▾/▸ disclosure-glyph family.
---
 .../src/popup/components/settings-vault.ts    |  5 +++--
 extension/src/shared/__tests__/glyphs.test.ts | 22 +++++++++++++++++++
 extension/src/shared/glyphs.ts                |  1 +
 3 files changed, 26 insertions(+), 2 deletions(-)

diff --git a/extension/src/popup/components/settings-vault.ts b/extension/src/popup/components/settings-vault.ts
index 84e7935..288c032 100644
--- a/extension/src/popup/components/settings-vault.ts
+++ b/extension/src/popup/components/settings-vault.ts
@@ -7,6 +7,7 @@ import type {
   VaultSettings, TrashRetention, HistoryRetention, GeneratorRequest,
 } from '../../shared/types';
 import { openGeneratorPanel, closeGeneratorPanel, isGeneratorPanelOpen } from './generator-panel';
+import { GLYPH_NEXT } from '../../shared/glyphs';
 
 let pendingSettings: VaultSettings | null = null;
 let activeKeyHandler: ((e: KeyboardEvent) => void) | null = null;
@@ -161,14 +162,14 @@ export function renderVaultSettings(app: HTMLElement): void {
         <div class="settings-section">
           <div class="settings-section__title">backup &amp; restore</div>
           <div class="settings-row">
-            <button class="btn" id="open-backup">Backup &amp; restore →</button>
+            <button class="btn" id="open-backup">Backup &amp; restore ${GLYPH_NEXT}</button>
           </div>
         </div>
 
         <div class="settings-section">
           <div class="settings-section__title">import</div>
           <div class="settings-row">
-            <button class="btn" id="open-import">LastPass CSV →</button>
+            <button class="btn" id="open-import">LastPass CSV ${GLYPH_NEXT}</button>
           </div>
         </div>
 
diff --git a/extension/src/shared/__tests__/glyphs.test.ts b/extension/src/shared/__tests__/glyphs.test.ts
index e0a6d78..957c28c 100644
--- a/extension/src/shared/__tests__/glyphs.test.ts
+++ b/extension/src/shared/__tests__/glyphs.test.ts
@@ -1,5 +1,10 @@
 import { describe, it, expect } from 'vitest';
 import * as glyphs from '../glyphs';
+import {
+  GLYPH_REVEAL, GLYPH_HIDE, GLYPH_GENERATE, GLYPH_FILL_FROM_TAB,
+  GLYPH_QR, GLYPH_MONO, GLYPH_TRASH, GLYPH_DEVICES, GLYPH_SETTINGS,
+  GLYPH_LOCK, GLYPH_NEXT,
+} from '../glyphs';
 
 describe('glyphs', () => {
   it('exports the documented glyph constants', () => {
@@ -19,3 +24,20 @@ describe('glyphs', () => {
     expect(glyphs.REQUIRED_PILL_HTML).toBe('<span class="req-pill">required</span>');
   });
 });
+
+describe('glyph constants', () => {
+  it('uses single unicode codepoints (no emoji multi-codepoint)', () => {
+    const all = [
+      GLYPH_REVEAL, GLYPH_HIDE, GLYPH_GENERATE, GLYPH_FILL_FROM_TAB,
+      GLYPH_QR, GLYPH_MONO, GLYPH_TRASH, GLYPH_DEVICES, GLYPH_SETTINGS,
+      GLYPH_LOCK, GLYPH_NEXT,
+    ];
+    for (const g of all) {
+      expect([...g].length).toBe(1);
+    }
+  });
+
+  it('GLYPH_NEXT is the small right triangle (U+25B8)', () => {
+    expect(GLYPH_NEXT).toBe('▸');
+  });
+});
diff --git a/extension/src/shared/glyphs.ts b/extension/src/shared/glyphs.ts
index 0266a89..a69e3fb 100644
--- a/extension/src/shared/glyphs.ts
+++ b/extension/src/shared/glyphs.ts
@@ -16,6 +16,7 @@ export const GLYPH_TRASH         = '▦';   // sidebar trash nav
 export const GLYPH_DEVICES       = '⌬';   // sidebar devices nav
 export const GLYPH_SETTINGS      = '⚙';   // sidebar settings nav
 export const GLYPH_LOCK          = '⏻';   // sidebar lock nav
+export const GLYPH_NEXT          = '▸';   // forward / next button (matches ▾/▸ disclosure family)
 
 /// Inline HTML snippet for the required-field pill. Use after a label's text:
 ///   `<label class="label" for="f-title">title ${REQUIRED_PILL_HTML}</label>`