@nockchain/rose 0.1.4-nightly.5

package/extension/popup/styles.css

@@ -0,0 +1,246 @@
+@import 'tailwindcss';
+
+/* Monospace-first typography to mirror nocknames.com */
+
+@theme {
+  /* ============================================================================
+     DESIGN TOKENS - Rose Design System
+     Source: /Documents/tokens/
+     ============================================================================ */
+
+  /* Brand Colors */
+  --color-primary: #37f;
+  --color-green: #7ccf8b;
+  --color-red: #ff6b6b;
+  --color-red-light: #2a1a1a;
+
+  /* Dark Mode Greyscale (Default) */
+  --color-bg: #0a0a0b;
+  --color-surface-900: #2f2f35;
+  --color-surface-800: #151517;
+  --color-surface-700: #1c1c1f;
+  --color-text-primary: #f5f5f5;
+  --color-text-secondary: #c7c7c7;
+  --color-text-muted: #9e9ea2;
+  --color-divider: #1f1f22;
+
+  /* Home Screen Specific */
+  --color-home-accent: #15151f;
+  --color-home-fill: #111317;
+  --color-tx-icon: #222222;
+
+  /* Modals */
+  --color-modal-overlay: #11131733;
+  --color-popover: #11131766;
+
+  /* Font Families */
+  --font-serif: 'Berkeley Mono', 'BerkeleyMono', 'SFMono-Regular', 'Menlo', 'Consolas', monospace;
+  --font-sans: 'Berkeley Mono', 'BerkeleyMono', 'SFMono-Regular', 'Menlo', 'Consolas', monospace;
+  --font-mono: 'Berkeley Mono', 'BerkeleyMono', 'SFMono-Regular', 'Menlo', 'Consolas', monospace;
+
+  /* Font Sizes */
+  --font-size-xs: 0.75rem;
+  /* 12px */
+  --font-size-sm: 0.8125rem;
+  /* 13px */
+  --font-size-base: 0.875rem;
+  /* 14px */
+  --font-size-lg: 1rem;
+  /* 16px */
+  --font-size-xl: 1.5rem;
+  /* 24px */
+  --font-size-2xl: 2.25rem;
+  /* 36px */
+
+  /* Line Heights */
+  --line-height-tight: 1rem;
+  /* 16px */
+  --line-height-snug: 1.125rem;
+  /* 18px */
+  --line-height-normal: 1.375rem;
+  /* 22px */
+  --line-height-relaxed: 1.75rem;
+  /* 28px */
+  --line-height-loose: 2.5rem;
+  /* 40px */
+
+  /* Letter Spacing */
+  --letter-spacing-tight: -0.02em;
+  /* -2% */
+  --letter-spacing-normal: 0.01em;
+  /* 1% */
+  --letter-spacing-wide: 0.02em;
+  /* 2% */
+
+  /* Shadows */
+  --shadow-xs: 0 0 4px 0 #11131714;
+  --shadow-md: 0 4px 12px 0 #1113171f;
+
+  /* Custom Figma Colors - Light Mode */
+  --color-fn-bg: #ebebe9;
+  --color-fn-card: #ffffff;
+  --color-fn-ink: #000000;
+  --color-fn-sub: #707070;
+  --color-fn-yellow: #5968fb;
+  --color-fn-green: #369929;
+  --color-fn-line: #e0e0e0;
+  --color-fn-line-muted: #dadad8;
+  --color-fn-overlay: rgba(0, 0, 0, 0.6);
+  --color-fn-overlay-light: rgba(0, 0, 0, 0.2);
+
+  /* Custom Border Radius */
+  --radius-card: 12px;
+  --radius-sheet: 12px;
+  --radius-tile: 8px;
+
+  /* Custom Shadows */
+  --shadow-card: 0 6px 18px rgba(0, 0, 0, 0.08);
+
+  /* Font Display (Berkeley) */
+  --font-display: 'Berkeley Mono', 'BerkeleyMono', 'SFMono-Regular', 'Menlo', 'Consolas', monospace;
+}
+
+/* ============================================================================
+   LIGHT MODE OVERRIDES
+   Applied when .light class is on root element
+   ============================================================================ */
+
+/* Enforce dark theme values even if .light is present */
+html.light {
+  --color-bg: #0a0a0b;
+  --color-surface-900: #111113;
+  --color-surface-800: #151517;
+  --color-surface-700: #1c1c1f;
+  --color-text-primary: #f5f5f5;
+  --color-text-secondary: #c7c7c7;
+  --color-text-muted: #9e9ea2;
+  --color-divider: #1f1f22;
+  --color-green: #7ccf8b;
+  --color-red: #ff6b6b;
+  --color-red-light: #2a1a1a;
+  --color-home-accent: #111113;
+  --color-home-fill: #0a0a0b;
+  --color-tx-icon: #151517;
+  --color-modal-overlay: #11131733;
+  --color-popover: #11131766;
+}
+
+/* Custom base styles */
+body {
+  background-color: var(--color-bg);
+  color: var(--color-text-primary);
+  font-family: var(--font-mono);
+  font-size: var(--font-size-base);
+  line-height: var(--line-height-normal);
+  letter-spacing: var(--letter-spacing-normal);
+}
+
+/* Ensure all buttons show pointer cursor */
+button {
+  cursor: pointer;
+}
+
+/* Hide scrollbars globally */
+* {
+  -ms-overflow-style: none;
+  /* IE and Edge */
+  scrollbar-width: none;
+  /* Firefox */
+}
+
+*::-webkit-scrollbar {
+  display: none;
+  /* Chrome, Safari, Opera */
+}
+
+/* Custom component classes */
+.btn-primary {
+  width: 100%;
+  background: linear-gradient(135deg, #8b55f6, #37f, #0ff);
+  color: #000;
+  font-family: var(--font-sans);
+  font-weight: 500;
+  font-size: var(--font-size-base);
+  letter-spacing: var(--letter-spacing-normal);
+  border-radius: 0.375rem;
+  border: 1px solid #3377ff70;
+  cursor: pointer;
+  transition: opacity 0.2s;
+}
+
+.btn-primary:hover {
+  opacity: 0.9;
+}
+
+.btn-secondary {
+  width: 100%;
+  background: linear-gradient(135deg, #23232a, #454553, #222328);
+  color: var(--color-text-primary);
+  font-family: var(--font-sans);
+  font-weight: 500;
+  font-size: var(--font-size-base);
+  letter-spacing: var(--letter-spacing-normal);
+  border-radius: 0.375rem;
+  border: 1px solid #3377ff70;
+  cursor: pointer;
+  transition:
+    opacity 0.2s,
+    border-color 0.2s;
+}
+
+.btn-secondary:hover {
+  opacity: 0.8;
+}
+
+.input-field {
+  width: 100%;
+  padding: 0.5rem 0.75rem;
+  background-color: var(--color-surface-800);
+  border: 1px solid var(--color-surface-700);
+  border-radius: 0.375rem;
+  color: var(--color-text-primary);
+  font-family: var(--font-sans);
+  font-size: var(--font-size-base);
+}
+
+.input-field::placeholder {
+  color: var(--color-text-muted);
+}
+
+.input-field:focus {
+  outline: none;
+  border-color: var(--color-primary);
+}
+
+.address-display {
+  margin: 1rem 0;
+  padding: 0.75rem;
+  background-color: var(--color-surface-800);
+  border-radius: 0.375rem;
+  word-break: break-all;
+  font-family: monospace;
+  font-size: var(--font-size-xs);
+  line-height: var(--line-height-snug);
+}
+
+.label {
+  font-family: var(--font-sans);
+  font-weight: 500;
+  font-size: var(--font-size-sm);
+  letter-spacing: var(--letter-spacing-wide);
+  margin-bottom: 0.25rem;
+  color: var(--color-text-secondary);
+}
+
+/* Hide scrollbar while keeping scroll functionality */
+.no-scrollbar {
+  -ms-overflow-style: none;
+  /* IE and Edge */
+  scrollbar-width: none;
+  /* Firefox */
+}
+
+.no-scrollbar::-webkit-scrollbar {
+  display: none;
+  /* Chrome, Safari, Opera */
+}

package/extension/popup/utils/format.ts

@@ -0,0 +1,58 @@
+/**
+ * Formatting utilities for display
+ */
+
+/**
+ * Truncate an address for display
+ * @param address - Full address string
+ * @param startChars - Number of characters to show at start (default: 6)
+ * @param endChars - Number of characters to show at end (default: 6)
+ * @returns Truncated address like "89dF13...sw5Lvw" or empty string if no address
+ */
+export function truncateAddress(
+  address: string | null | undefined,
+  startChars: number = 6,
+  endChars: number = 6
+): string {
+  if (!address) return '';
+  if (address.length <= startChars + endChars) return address;
+  return `${address.slice(0, startChars)}...${address.slice(-endChars)}`;
+}
+
+/**
+ * Format a date as a relative time string (e.g., "34m ago", "2d ago")
+ * @param date - The date to format
+ * @returns Relative time string
+ */
+export function formatTimeAgo(date: Date): string {
+  const seconds = Math.floor((Date.now() - date.getTime()) / 1000);
+
+  if (seconds < 60) return 'Just now';
+  const minutes = Math.floor(seconds / 60);
+  if (minutes < 60) return `${minutes}m ago`;
+  const hours = Math.floor(minutes / 60);
+  if (hours < 24) return `${hours}h ago`;
+  const days = Math.floor(hours / 24);
+  return `${days}d ago`;
+}
+
+/**
+ * Format a timestamp as UTC date/time string
+ * @param timestamp - Timestamp in milliseconds since epoch
+ * @returns Formatted UTC string (e.g., "Jan 18, 2025, 14:23:45 UTC")
+ */
+export function formatUTCTimestamp(timestamp: number): string {
+  const date = new Date(timestamp);
+  return (
+    date.toLocaleString('en-US', {
+      timeZone: 'UTC',
+      year: 'numeric',
+      month: 'short',
+      day: 'numeric',
+      hour: '2-digit',
+      minute: '2-digit',
+      second: '2-digit',
+      hour12: false,
+    }) + ' UTC'
+  );
+}

package/extension/popup/utils/formatWalletError.ts

@@ -0,0 +1,36 @@
+import { ERROR_CODES } from '../../shared/constants';
+
+type RpcErrorObject = {
+  code?: unknown;
+  message?: unknown;
+};
+
+/**
+ * Convert mixed backend error shapes into a user-friendly message.
+ *
+ * The background sometimes returns a string error code (e.g. ERROR_CODES.LOCKED)
+ * and sometimes returns an object like { code: -32602, message: 'Invalid params' }.
+ */
+export function formatWalletError(err: unknown): string {
+  // Common JS errors
+  if (err instanceof Error) return err.message || 'Unknown error';
+
+  // Background often returns string error codes
+  if (typeof err === 'string') {
+    if (err === ERROR_CODES.BAD_PASSWORD) return 'Incorrect password';
+    if (err === ERROR_CODES.LOCKED) return 'Wallet is locked. Unlock Rose to continue.';
+    if (err === ERROR_CODES.UNAUTHORIZED) return 'Unauthorized';
+    if (err === ERROR_CODES.INVALID_PARAMS) return 'Invalid parameters';
+    return `Error: ${err}`;
+  }
+
+  // JSON-RPC style errors: { code, message }
+  if (typeof err === 'object' && err !== null) {
+    const e = err as RpcErrorObject;
+    if (typeof e.message === 'string' && e.message.trim().length > 0) return e.message;
+    if (typeof e.code === 'string' || typeof e.code === 'number') return `Error: ${e.code}`;
+  }
+
+  // Fallback
+  return 'Unknown error';
+}

package/extension/popup/utils/memo.ts

@@ -0,0 +1,299 @@
+/**
+ * Memo decoding / extraction helpers for transaction approvals.
+ *
+ * The memo may be represented as:
+ * - UTF-8 bytes (Uint8Array)
+ * - base64 string
+ * - hex string (optionally 0x-prefixed)
+ * - nested "protobuf-ish" wrappers like { value: ... }
+ *
+ * We intentionally keep this resilient: the WASM/protobuf shape may evolve.
+ */
+
+import { base16, base64, base64url } from '@scure/base';
+import * as wasm from '@nockchain/sdk/wasm';
+import type {
+  Note as WasmNote,
+  NoteDataEntry as WasmNoteDataEntry,
+  RawTx as WasmRawTx,
+} from '@nockchain/sdk/wasm';
+
+function isRecord(x: unknown): x is Record<string, unknown> {
+  return typeof x === 'object' && x !== null;
+}
+
+function unwrapValue(x: unknown): unknown {
+  if (!isRecord(x)) return x;
+  // Common protobuf-ish wrapper: { value: ... }
+  if ('value' in x && Object.keys(x).length === 1) return x.value;
+  return x;
+}
+
+function hexToBytes(hex: string): Uint8Array | null {
+  const normalized = hex.startsWith('0x') ? hex.slice(2) : hex;
+  if (!/^[0-9a-fA-F]*$/.test(normalized)) return null;
+  if (normalized.length % 2 !== 0) return null;
+  try {
+    // base16 expects hex without 0x prefix and is case-sensitive (RFC 4648 alphabet is uppercase).
+    // Normalize to uppercase so mixed/lowercase hex decodes correctly.
+    return base16.decode(normalized.toUpperCase());
+  } catch {
+    return null;
+  }
+}
+function decodeMemoJamListUx(blob: Uint8Array): string | null {
+  try {
+    const noun = wasm.Noun.cue(blob);
+    const jsNoun = noun.toJs(); // atom => hex string, cell => [head, tail]
+
+    const bytes: number[] = [];
+    let x: unknown = jsNoun;
+
+    while (Array.isArray(x) && x.length === 2) {
+      const head = x[0];
+      const tail = x[1];
+
+      if (typeof head !== 'string') return null;
+      const v = Number.parseInt(head, 16);
+      if (!Number.isFinite(v) || v < 0 || v > 255) return null;
+
+      bytes.push(v);
+      x = tail;
+    }
+
+    // list terminator must be atom 0 (hex string "0")
+    if (typeof x !== 'string') return null;
+    if (Number.parseInt(x, 16) !== 0) return null;
+
+    const decoded = bytesToUtf8(Uint8Array.from(bytes)).trim();
+    return decoded.length ? decoded : null;
+  } catch {
+    return null;
+  }
+}
+
+function decodeMemoViaWasm(blob: Uint8Array): string | null {
+  try {
+    // Prefer the dedicated helper if present on the rose-wasm module (newer builds).
+    // We access it via `any` so the extension can compile against older rose-wasm typings.
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    const fn = (wasm as any).decodeMemoUtf8 as undefined | ((b: Uint8Array) => string);
+
+    if (!fn) return null;
+    const s = fn(blob);
+    if (typeof s !== 'string') return null;
+    const trimmed = s.trim();
+    return trimmed.length ? trimmed : null;
+  } catch {
+    return null;
+  }
+}
+function base64ToBytes(b64: string): Uint8Array | null {
+  const normalized = b64.trim();
+  if (!normalized) return null;
+
+  // Heuristics to avoid interpreting arbitrary plaintext as base64/base64url.
+  // - base64: A–Z a–z 0–9 + / with optional = padding, length must be multiple of 4.
+  // - base64url: A–Z a–z 0–9 - _ with optional padding; may be unpadded.
+  const looksLikeB64 = /^[A-Za-z0-9+/]+={0,2}$/.test(normalized) && normalized.length % 4 === 0;
+  const looksLikeB64Url = /^[A-Za-z0-9_-]+={0,2}$/.test(normalized);
+  if (!looksLikeB64 && !looksLikeB64Url) return null;
+
+  // Try strict decoders first; fall back to normalizing url-safe -> standard base64.
+  try {
+    if (looksLikeB64) return base64.decode(normalized);
+    if (looksLikeB64Url) return base64url.decode(normalized);
+  } catch {
+    // continue
+  }
+
+  try {
+    // Normalize base64url (unpadded) to standard base64 for maximum compatibility.
+    let s = normalized.replace(/-/g, '+').replace(/_/g, '/');
+    const pad = s.length % 4;
+    if (pad === 2) s += '==';
+    else if (pad === 3) s += '=';
+    else if (pad === 1) return null; // impossible length
+    return base64.decode(s);
+  } catch {
+    return null;
+  }
+}
+
+function bytesToUtf8(bytes: Uint8Array): string {
+  try {
+    return new TextDecoder('utf-8', { fatal: false }).decode(bytes);
+  } catch {
+    // Fallback (very old environments)
+    let s = '';
+    for (let i = 0; i < bytes.length; i++) s += String.fromCharCode(bytes[i]);
+    return s;
+  }
+}
+
+function looksLikeReadableText(s: string): boolean {
+  if (s.includes('\uFFFD')) return false;
+
+  for (let i = 0; i < s.length; i++) {
+    const c = s.charCodeAt(i);
+    const isAllowedWhitespace = c === 0x09 || c === 0x0a || c === 0x0d;
+    const isControl = (c >= 0x00 && c <= 0x1f) || (c >= 0x7f && c <= 0x9f);
+    if (isControl && !isAllowedWhitespace) return false;
+  }
+
+  return true;
+}
+
+function decodeMemoValue(maybe: unknown): string | null {
+  const v = unwrapValue(maybe);
+  if (v == null) return null;
+
+  if (v instanceof Uint8Array) {
+    // Prefer decoding via rose-wasm helper (keeps logic consistent with chain encoding).
+    const wasmDecoded = decodeMemoViaWasm(v);
+    if (wasmDecoded) return wasmDecoded;
+
+    // Fallback: decode jammed `(list @ux)` noun directly.
+    const jamDecoded = decodeMemoJamListUx(v);
+    if (jamDecoded) return jamDecoded;
+
+    // fallback (legacy / unexpected)
+    const decoded = bytesToUtf8(v).trim();
+    return decoded.length ? decoded : null;
+  }
+
+  // NEW: protobuf blobs may come through as number[]
+  if (Array.isArray(v) && v.every(n => Number.isInteger(n) && n >= 0 && n <= 255)) {
+    return decodeMemoValue(Uint8Array.from(v));
+  }
+
+  if (typeof v === 'string') {
+    const raw = v.trim();
+    if (!raw) return null;
+
+    const asHex = hexToBytes(raw);
+    if (asHex) {
+      const jamDecoded = decodeMemoJamListUx(asHex);
+      if (jamDecoded) return jamDecoded;
+
+      const decoded = bytesToUtf8(asHex).trim();
+      if (decoded.length && looksLikeReadableText(decoded)) return decoded;
+      return raw;
+    }
+
+    const asB64 = base64ToBytes(raw);
+    if (asB64) {
+      const jamDecoded = decodeMemoJamListUx(asB64);
+      if (jamDecoded) return jamDecoded;
+
+      const decoded = bytesToUtf8(asB64).trim();
+      if (decoded.length && looksLikeReadableText(decoded)) return decoded;
+      return raw;
+    }
+
+    return raw;
+  }
+
+  if (isRecord(v)) {
+    if ('blob' in v) return decodeMemoValue(v.blob);
+    if ('memo' in v) return decodeMemoValue(v.memo);
+  }
+
+  return null;
+}
+
+type ProtobufNoteDataEntryLike = { key?: unknown; blob?: unknown };
+
+function isWasmNote(note: unknown): note is WasmNote {
+  return isRecord(note) && 'noteData' in note;
+}
+
+function getNoteDataEntries(
+  note: WasmNote | unknown
+): ReadonlyArray<WasmNoteDataEntry | ProtobufNoteDataEntryLike> {
+  // WASM path (strongly typed)
+  if (isWasmNote(note)) {
+    const noteData: any = (note as any).noteData;
+    const entries =
+      typeof noteData?.entries === 'function' ? noteData.entries() : noteData?.entries;
+    return Array.isArray(entries) ? entries : [];
+  }
+
+  // Protobuf-ish object path (resilient)
+  if (!isRecord(note)) return [];
+  const v1 = (note as any)?.note_version?.V1 ?? (note as any)?.noteVersion?.V1 ?? null;
+  const noteData = v1?.note_data ?? v1?.noteData ?? null;
+  const entries = noteData?.entries ?? noteData?.Entries ?? null;
+  return Array.isArray(entries) ? (entries as ProtobufNoteDataEntryLike[]) : [];
+}
+
+function extractMemoFromOutputs(
+  outputs: ReadonlyArray<WasmNote | unknown> | undefined
+): string | null {
+  if (!outputs || !Array.isArray(outputs)) return null;
+
+  for (const output of outputs) {
+    const entries = getNoteDataEntries(output);
+    for (const entry of entries) {
+      const keyRaw = (entry as any)?.key;
+      const keyVal = typeof keyRaw === 'function' ? keyRaw.call(entry) : keyRaw;
+      const key = unwrapValue(keyVal);
+      const keyStr = typeof key === 'string' ? key : null;
+      if (!keyStr) continue;
+      if (keyStr.toLowerCase() !== 'memo') continue;
+
+      const blobRaw = (entry as any)?.blob;
+      const blobVal = typeof blobRaw === 'function' ? blobRaw.call(entry) : blobRaw;
+      const memo = decodeMemoValue(blobVal);
+      if (memo) return memo;
+    }
+  }
+
+  return null;
+}
+
+function extractMemoFromRawTx(rawTx: WasmRawTx | unknown): string | null {
+  // Fast-path: common shapes
+  const maybe = isRecord(rawTx) ? rawTx : (rawTx as unknown as Record<string, unknown>);
+  const direct = decodeMemoValue((maybe as any)?.memo ?? (maybe as any)?.Memo);
+  if (direct) return direct;
+
+  // Some schemas may tuck memo under tx/body/etc.
+  const nested = decodeMemoValue(
+    (maybe as any)?.tx?.memo ?? (maybe as any)?.body?.memo ?? (maybe as any)?.transaction?.memo
+  );
+  if (nested) return nested;
+
+  // As a last resort, shallow scan for keys named "memo" (case-insensitive) up to a small depth.
+  const queue: Array<{ obj: Record<string, unknown>; depth: number }> = [];
+  if (isRecord(rawTx)) queue.push({ obj: rawTx, depth: 0 });
+  const seen = new Set<object>();
+
+  while (queue.length) {
+    const { obj, depth } = queue.shift()!;
+    if (seen.has(obj)) continue;
+    seen.add(obj);
+
+    for (const [k, val] of Object.entries(obj)) {
+      if (k.toLowerCase() === 'memo') {
+        const found = decodeMemoValue(val);
+        if (found) return found;
+      }
+      if (depth < 3 && isRecord(val)) queue.push({ obj: val, depth: depth + 1 });
+    }
+  }
+
+  return null;
+}
+
+/**
+ * Extract a human-readable memo from a signRawTx payload.
+ * Returns null if no memo exists.
+ */
+export function extractMemo(params: {
+  rawTx: WasmRawTx | unknown;
+  outputs?: ReadonlyArray<WasmNote | unknown>;
+}): string | null {
+  // Prefer explicit tx-level memo if present; otherwise fall back to note_data entries.
+  return extractMemoFromRawTx(params.rawTx) ?? extractMemoFromOutputs(params.outputs);
+}

package/extension/popup/utils/messaging.ts

@@ -0,0 +1,16 @@
+/**
+ * Messaging utilities for communicating with the service worker
+ */
+
+// Note - Extension has separate isolated contexts which cannot directly call each other's functions.
+// Must use Chrome's message passing API to communicate between popup, content scripts, and background service worker.
+
+/**
+ * Send a message to the service worker
+ * @param method - The method to call (from INTERNAL_METHODS or PROVIDER_METHODS)
+ * @param params - Optional parameters to pass
+ * @returns Promise with the response from the service worker
+ */
+export function send<T = unknown>(method: string, params?: unknown[]): Promise<T> {
+  return chrome.runtime.sendMessage({ payload: { method, params } });
+}