auramaxx 1.0.0-alpha.4

package/src/context/AuthContext.tsx

@@ -0,0 +1,337 @@
+'use client';
+
+import { createContext, useContext, useState, useCallback, ReactNode, useEffect } from 'react';
+import { api, Api } from '@/lib/api';
+import { discardVaultKeypair } from '@/lib/vault-crypto';
+
+export interface ApiKey {
+  id: string;
+  service: string;
+  name: string;
+  key: string;
+  keyMasked: string;
+  createdAt?: string;
+}
+
+export interface ChainConfig {
+  rpc: string;
+  chainId: number;
+  explorer: string;
+}
+
+// Alchemy RPC paths by chain
+const ALCHEMY_PATHS: Record<string, { path: string; chainId: number; explorer: string }> = {
+  base: { path: 'base-mainnet', chainId: 8453, explorer: 'https://basescan.org' },
+  ethereum: { path: 'eth-mainnet', chainId: 1, explorer: 'https://etherscan.io' },
+  arbitrum: { path: 'arb-mainnet', chainId: 42161, explorer: 'https://arbiscan.io' },
+  optimism: { path: 'opt-mainnet', chainId: 10, explorer: 'https://optimistic.etherscan.io' },
+  solana: { path: 'solana-mainnet', chainId: 0, explorer: 'https://solscan.io' },
+  'solana-devnet': { path: 'solana-devnet', chainId: 0, explorer: 'https://solscan.io/?cluster=devnet' },
+};
+
+// Public RPC fallbacks (default chains: base, ethereum, and solana)
+const PUBLIC_RPCS: Record<string, ChainConfig> = {
+  base: { rpc: 'https://mainnet.base.org', chainId: 8453, explorer: 'https://basescan.org' },
+  ethereum: { rpc: 'https://eth.llamarpc.com', chainId: 1, explorer: 'https://etherscan.io' },
+  solana: { rpc: 'https://api.mainnet-beta.solana.com', chainId: 0, explorer: 'https://solscan.io' },
+  'solana-devnet': { rpc: 'https://api.devnet.solana.com', chainId: 0, explorer: 'https://solscan.io/?cluster=devnet' },
+};
+
+interface AuthContextValue {
+  token: string | null;
+  isUnlocked: boolean;
+  setToken: (token: string | null) => void;
+  clearToken: () => void;
+  apiKeys: ApiKey[];
+  apiKeysLoading: boolean;
+  refreshApiKeys: () => Promise<void>;
+  getApiKey: (service: string, name?: string) => string | null;
+  getRpcUrl: (chain?: string) => string;
+  getChainConfig: (chain?: string) => ChainConfig;
+  // Chain overrides (custom RPC URLs stored in DB)
+  chainOverrides: Record<string, ChainConfig>;
+  chainOverridesLoading: boolean;
+  refreshChainOverrides: () => Promise<void>;
+  saveChainOverride: (chain: string, config: ChainConfig) => Promise<void>;
+  removeChainOverride: (chain: string) => Promise<void>;
+  // All configured chains (public defaults + DB overrides)
+  getConfiguredChains: () => Record<string, ChainConfig>;
+}
+
+const AuthContext = createContext<AuthContextValue | null>(null);
+
+// Storage key for persisting token across page reloads
+const TOKEN_STORAGE_KEY = 'aurawallet_admin_token';
+
+interface AuthProviderProps {
+  children: ReactNode;
+}
+
+export function AuthProvider({ children }: AuthProviderProps) {
+  const [token, setTokenState] = useState<string | null>(null);
+  const [apiKeys, setApiKeys] = useState<ApiKey[]>([]);
+  const [apiKeysLoading, setApiKeysLoading] = useState(false);
+  const [chainOverrides, setChainOverrides] = useState<Record<string, ChainConfig>>({});
+  const [chainOverridesLoading, setChainOverridesLoading] = useState(false);
+
+  // Load token from sessionStorage on mount
+  useEffect(() => {
+    if (typeof window !== 'undefined') {
+      const stored = sessionStorage.getItem(TOKEN_STORAGE_KEY);
+      if (stored) {
+        setTokenState(stored);
+      }
+    }
+  }, []);
+
+  // Fetch API keys when token is available
+  const refreshApiKeys = useCallback(async () => {
+    if (!token) {
+      setApiKeys([]);
+      return;
+    }
+    setApiKeysLoading(true);
+    try {
+      const data = await api.get<{ success: boolean; apiKeys: ApiKey[] }>(Api.Wallet, '/apikeys');
+      if (data.success && data.apiKeys) {
+        setApiKeys(data.apiKeys);
+      }
+    } catch (err) {
+      // If the token is invalid/expired (server restarted, new SIGNING_KEY), clear it
+      const status = (err as Error & { status?: number }).status;
+      if (status === 401 || status === 403) {
+        setTokenState(null);
+        if (typeof window !== 'undefined') {
+          sessionStorage.removeItem(TOKEN_STORAGE_KEY);
+        }
+        setApiKeys([]);
+      }
+      console.error('[AuthContext] Failed to fetch API keys:', err);
+    } finally {
+      setApiKeysLoading(false);
+    }
+  }, [token]);
+
+  // Load API keys when token changes
+  useEffect(() => {
+    if (token) {
+      refreshApiKeys();
+    } else {
+      setApiKeys([]);
+    }
+  }, [token, refreshApiKeys]);
+
+  // Fetch chain overrides from workspace config
+  const refreshChainOverrides = useCallback(async () => {
+    if (!token) {
+      setChainOverrides({});
+      setChainOverridesLoading(false);
+      return;
+    }
+
+    setChainOverridesLoading(true);
+    try {
+      const data = await api.get<{ success: boolean; config: { chainOverrides: Record<string, ChainConfig> } }>(
+        Api.Workspace,
+        '/workspace/config'
+      );
+      if (data.success && data.config) {
+        setChainOverrides(data.config.chainOverrides || {});
+      }
+    } catch (err) {
+      const status = (err as Error & { status?: number }).status;
+      if (status === 401 || status === 403) {
+        setChainOverrides({});
+      } else {
+        console.error('[AuthContext] Failed to fetch chain overrides:', err);
+      }
+    } finally {
+      setChainOverridesLoading(false);
+    }
+  }, [token]);
+
+  // Load chain overrides when auth state changes
+  useEffect(() => {
+    if (token) {
+      refreshChainOverrides();
+      return;
+    }
+    setChainOverrides({});
+    setChainOverridesLoading(false);
+  }, [token, refreshChainOverrides]);
+
+  // Save a chain override
+  const saveChainOverride = useCallback(async (chain: string, config: ChainConfig) => {
+    const newOverrides = { ...chainOverrides, [chain]: config };
+    try {
+      const data = await api.post<{ success: boolean; config: { chainOverrides: Record<string, ChainConfig> } }>(
+        Api.Workspace,
+        '/workspace/config',
+        { chainOverrides: newOverrides }
+      );
+      if (data.success && data.config) {
+        setChainOverrides(data.config.chainOverrides || {});
+      }
+    } catch (err) {
+      console.error('[AuthContext] Failed to save chain override:', err);
+      throw err;
+    }
+  }, [chainOverrides]);
+
+  // Remove a chain override
+  const removeChainOverride = useCallback(async (chain: string) => {
+    const newOverrides = { ...chainOverrides };
+    delete newOverrides[chain];
+    try {
+      const data = await api.post<{ success: boolean; config: { chainOverrides: Record<string, ChainConfig> } }>(
+        Api.Workspace,
+        '/workspace/config',
+        { chainOverrides: newOverrides }
+      );
+      if (data.success && data.config) {
+        setChainOverrides(data.config.chainOverrides || {});
+      }
+    } catch (err) {
+      console.error('[AuthContext] Failed to remove chain override:', err);
+      throw err;
+    }
+  }, [chainOverrides]);
+
+  const setToken = useCallback((newToken: string | null) => {
+    setTokenState(newToken);
+    if (typeof window !== 'undefined') {
+      if (newToken) {
+        sessionStorage.setItem(TOKEN_STORAGE_KEY, newToken);
+      } else {
+        sessionStorage.removeItem(TOKEN_STORAGE_KEY);
+      }
+    }
+  }, []);
+
+  const clearToken = useCallback(() => {
+    discardVaultKeypair();
+    setToken(null);
+  }, [setToken]);
+
+  // Get an API key by service and optional name
+  const getApiKey = useCallback((service: string, name?: string): string | null => {
+    const key = apiKeys.find(k =>
+      k.service.toLowerCase() === service.toLowerCase() &&
+      (!name || k.name.toLowerCase() === name.toLowerCase())
+    );
+    return key?.key || null;
+  }, [apiKeys]);
+
+  // Get RPC URL for a chain: override → Alchemy → public fallback
+  const getRpcUrl = useCallback((chain: string = 'base'): string => {
+    // 1. Check for custom override
+    if (chainOverrides[chain]?.rpc) {
+      return chainOverrides[chain].rpc;
+    }
+
+    // 2. Check for Alchemy API key
+    const alchemyKey = getApiKey('alchemy');
+    const alchemyConfig = ALCHEMY_PATHS[chain];
+    if (alchemyKey && alchemyConfig) {
+      return `https://${alchemyConfig.path}.g.alchemy.com/v2/${alchemyKey}`;
+    }
+
+    // 3. Fallback to public RPC
+    return PUBLIC_RPCS[chain]?.rpc || PUBLIC_RPCS.base.rpc;
+  }, [chainOverrides, getApiKey]);
+
+  // Get full chain config: override → Alchemy → public fallback
+  const getChainConfig = useCallback((chain: string = 'base'): ChainConfig => {
+    // 1. Check for custom override
+    if (chainOverrides[chain]) {
+      return chainOverrides[chain];
+    }
+
+    // 2. Check for Alchemy API key
+    const alchemyKey = getApiKey('alchemy');
+    const alchemyConfig = ALCHEMY_PATHS[chain];
+    if (alchemyKey && alchemyConfig) {
+      return {
+        rpc: `https://${alchemyConfig.path}.g.alchemy.com/v2/${alchemyKey}`,
+        chainId: alchemyConfig.chainId,
+        explorer: alchemyConfig.explorer,
+      };
+    }
+
+    // 3. Fallback to public RPC
+    return PUBLIC_RPCS[chain] || PUBLIC_RPCS.base;
+  }, [chainOverrides, getApiKey]);
+
+  // Get all configured chains (merges overrides, Alchemy-supported, and public RPCs)
+  // Get all configured chains: public defaults + DB overrides
+  // RPC resolution for each: DB custom RPC → Alchemy → public fallback
+  const getConfiguredChains = useCallback((): Record<string, ChainConfig> => {
+    const result: Record<string, ChainConfig> = {};
+    const alchemyKey = getApiKey('alchemy');
+
+    // Helper to resolve RPC URL for a chain
+    const resolveRpc = (chain: string, baseConfig: ChainConfig): string => {
+      // 1. If chain has custom RPC in DB, use it
+      if (chainOverrides[chain]?.rpc) {
+        return chainOverrides[chain].rpc;
+      }
+      // 2. If Alchemy key exists and chain is supported, use Alchemy
+      const alchemyConfig = ALCHEMY_PATHS[chain];
+      if (alchemyKey && alchemyConfig) {
+        return `https://${alchemyConfig.path}.g.alchemy.com/v2/${alchemyKey}`;
+      }
+      // 3. Fallback to hardcoded public RPC
+      return baseConfig.rpc;
+    };
+
+    // Add public defaults (base, ethereum) with resolved RPCs
+    for (const [chain, config] of Object.entries(PUBLIC_RPCS)) {
+      result[chain] = {
+        ...config,
+        rpc: resolveRpc(chain, config),
+      };
+    }
+
+    // Add any user-added chains from DB (not in PUBLIC_RPCS)
+    for (const [chain, config] of Object.entries(chainOverrides)) {
+      if (!PUBLIC_RPCS[chain]) {
+        result[chain] = config;
+      }
+    }
+
+    return result;
+  }, [chainOverrides, getApiKey]);
+
+  const value: AuthContextValue = {
+    token,
+    isUnlocked: !!token,
+    setToken,
+    clearToken,
+    apiKeys,
+    apiKeysLoading,
+    refreshApiKeys,
+    getApiKey,
+    getRpcUrl,
+    getChainConfig,
+    chainOverrides,
+    chainOverridesLoading,
+    refreshChainOverrides,
+    saveChainOverride,
+    removeChainOverride,
+    getConfiguredChains,
+  };
+
+  return (
+    <AuthContext.Provider value={value}>
+      {children}
+    </AuthContext.Provider>
+  );
+}
+
+export function useAuth(): AuthContextValue {
+  const context = useContext(AuthContext);
+  if (!context) {
+    throw new Error('useAuth must be used within an AuthProvider');
+  }
+  return context;
+}

package/src/context/PriceContext.tsx

@@ -0,0 +1,113 @@
+'use client';
+
+import React, { createContext, useContext, useEffect, useState, useCallback } from 'react';
+import { api, Api } from '@/lib/api';
+
+interface PriceContextType {
+  ethPrice: number | null;
+  solPrice: number | null;
+  loading: boolean;
+  error: string | null;
+  lastUpdated: Date | null;
+  refresh: () => void;
+  formatUsd: (ethAmount: string | number | undefined) => string;
+  formatUsdForChain: (amount: string | number | undefined, chain: string) => string;
+}
+
+const PriceContext = createContext<PriceContextType>({
+  ethPrice: null,
+  solPrice: null,
+  loading: true,
+  error: null,
+  lastUpdated: null,
+  refresh: () => {},
+  formatUsd: () => '',
+  formatUsdForChain: () => '',
+});
+
+export const usePrice = () => useContext(PriceContext);
+
+const REFRESH_INTERVAL = 60000; // 60 seconds
+
+interface PriceResponse {
+  success: boolean;
+  priceUsd?: string;
+  error?: string;
+}
+
+function isSolanaChain(chain: string): boolean {
+  return chain === 'solana' || chain === 'solana-devnet';
+}
+
+export const PriceProvider: React.FC<{ children: React.ReactNode }> = ({ children }) => {
+  const [ethPrice, setEthPrice] = useState<number | null>(null);
+  const [solPrice, setSolPrice] = useState<number | null>(null);
+  const [loading, setLoading] = useState(true);
+  const [error, setError] = useState<string | null>(null);
+  const [lastUpdated, setLastUpdated] = useState<Date | null>(null);
+
+  const fetchAllPrices = useCallback(async () => {
+    try {
+      const [ethRes, solRes] = await Promise.all([
+        api.get<PriceResponse>(Api.Wallet, '/price/native', { chain: 'base' }).catch(() => null),
+        api.get<PriceResponse>(Api.Wallet, '/price/native', { chain: 'solana' }).catch(() => null),
+      ]);
+
+      if (ethRes?.success && ethRes.priceUsd) {
+        const price = parseFloat(ethRes.priceUsd);
+        if (!isNaN(price)) setEthPrice(price);
+      }
+
+      if (solRes?.success && solRes.priceUsd) {
+        const price = parseFloat(solRes.priceUsd);
+        if (!isNaN(price)) setSolPrice(price);
+      }
+
+      setLastUpdated(new Date());
+      setError(null);
+    } catch (err) {
+      setError(err instanceof Error ? err.message : 'Price fetch failed');
+    } finally {
+      setLoading(false);
+    }
+  }, []);
+
+  useEffect(() => {
+    fetchAllPrices();
+    const interval = setInterval(fetchAllPrices, REFRESH_INTERVAL);
+    return () => clearInterval(interval);
+  }, [fetchAllPrices]);
+
+  const formatAmountToUsd = useCallback((amount: string | number | undefined, price: number | null): string => {
+    if (amount === undefined || amount === null || amount === '') return '';
+    if (price === null) return '';
+
+    const numStr = String(amount).replace(/[^0-9.-]/g, '');
+    const num = parseFloat(numStr);
+
+    if (isNaN(num) || num === 0) return '$0';
+
+    const usd = num * price;
+
+    if (usd < 0.01) return '<$0.01';
+    if (usd < 1) return `$${usd.toFixed(2)}`;
+    if (usd < 1000) return `$${usd.toFixed(2)}`;
+    if (usd < 10000) return `$${usd.toLocaleString('en-US', { minimumFractionDigits: 2, maximumFractionDigits: 2 })}`;
+    return `$${usd.toLocaleString('en-US', { minimumFractionDigits: 0, maximumFractionDigits: 0 })}`;
+  }, []);
+
+  const formatUsd = useCallback((ethAmount: string | number | undefined): string => {
+    return formatAmountToUsd(ethAmount, ethPrice);
+  }, [ethPrice, formatAmountToUsd]);
+
+  const formatUsdForChain = useCallback((amount: string | number | undefined, chain: string): string => {
+    const price = isSolanaChain(chain) ? solPrice : ethPrice;
+    return formatAmountToUsd(amount, price);
+  }, [ethPrice, solPrice, formatAmountToUsd]);
+
+  return (
+    <PriceContext.Provider value={{ ethPrice, solPrice, loading, error, lastUpdated, refresh: fetchAllPrices, formatUsd, formatUsdForChain }}>
+      {children}
+    </PriceContext.Provider>
+  );
+};

package/src/context/ThemeContext.tsx

@@ -0,0 +1,164 @@
+'use client';
+
+import {
+  createContext,
+  useContext,
+  useEffect,
+  useState,
+  useCallback,
+  ReactNode,
+} from 'react';
+import {
+  Theme,
+  DEFAULT_LIGHT_THEME,
+  getThemeById,
+  applyThemeToCSSVariables,
+  createThemeWithAccent,
+} from '@/lib/theme';
+import { useWebSocket } from './WebSocketContext';
+import { THEME_EVENTS, createThemeEvent } from '@/lib/events';
+
+interface ThemeContextValue {
+  theme: Theme;
+  mode: 'light' | 'dark';
+  accent: string;
+  setMode: (mode: 'light' | 'dark') => void;
+  setAccent: (accent: string) => void;
+  toggleMode: () => void;
+}
+
+const ThemeContext = createContext<ThemeContextValue | null>(null);
+
+interface ThemeProviderProps {
+  children: ReactNode;
+}
+
+export function ThemeProvider({ children }: ThemeProviderProps) {
+  const { subscribe, send, connected } = useWebSocket();
+
+  const [mode, setModeState] = useState<'light' | 'dark'>('light');
+  const [accent, setAccentState] = useState('#ccff00');
+  const [theme, setTheme] = useState<Theme>(DEFAULT_LIGHT_THEME);
+  const [initialized, setInitialized] = useState(false);
+
+  // Request theme from server on connect
+  useEffect(() => {
+    if (connected && !initialized) {
+      const requestId = `theme-init-${Date.now()}`;
+      send(
+        createThemeEvent(
+          THEME_EVENTS.THEME_REQUEST,
+          { requestId },
+          'ui'
+        )
+      );
+    }
+  }, [connected, initialized, send]);
+
+  // Subscribe to theme events
+  useEffect(() => {
+    const unsubscribe = subscribe(THEME_EVENTS.THEME_RESPONSE, (event) => {
+      if (event.type === THEME_EVENTS.THEME_RESPONSE) {
+        const data = event.data as {
+          activeThemeId: string;
+          accentColor: string;
+          mode: 'light' | 'dark';
+        };
+        setModeState(data.mode);
+        setAccentState(data.accentColor);
+        setInitialized(true);
+      }
+    });
+
+    return unsubscribe;
+  }, [subscribe]);
+
+  // Subscribe to mode changes from other clients/agents
+  useEffect(() => {
+    const unsubscribe = subscribe(THEME_EVENTS.THEME_MODE_CHANGED, (event) => {
+      if (event.type === THEME_EVENTS.THEME_MODE_CHANGED) {
+        const data = event.data as { mode: 'light' | 'dark' };
+        setModeState(data.mode);
+      }
+    });
+
+    return unsubscribe;
+  }, [subscribe]);
+
+  // Subscribe to accent changes from other clients/agents
+  useEffect(() => {
+    const unsubscribe = subscribe(THEME_EVENTS.THEME_ACCENT_CHANGED, (event) => {
+      if (event.type === THEME_EVENTS.THEME_ACCENT_CHANGED) {
+        const data = event.data as { accent: string };
+        setAccentState(data.accent);
+      }
+    });
+
+    return unsubscribe;
+  }, [subscribe]);
+
+  // Update theme object when mode or accent changes
+  useEffect(() => {
+    const baseTheme = getThemeById(mode);
+    const newTheme = createThemeWithAccent(baseTheme, accent);
+    setTheme(newTheme);
+    applyThemeToCSSVariables(newTheme);
+  }, [mode, accent]);
+
+  // Set mode and broadcast to other clients
+  const setMode = useCallback(
+    (newMode: 'light' | 'dark') => {
+      setModeState(newMode);
+      send(
+        createThemeEvent(
+          THEME_EVENTS.THEME_MODE_CHANGED,
+          { mode: newMode },
+          'ui'
+        )
+      );
+    },
+    [send]
+  );
+
+  // Set accent and broadcast to other clients
+  const setAccent = useCallback(
+    (newAccent: string) => {
+      setAccentState(newAccent);
+      send(
+        createThemeEvent(
+          THEME_EVENTS.THEME_ACCENT_CHANGED,
+          { accent: newAccent },
+          'ui'
+        )
+      );
+    },
+    [send]
+  );
+
+  // Toggle between light and dark mode
+  const toggleMode = useCallback(() => {
+    const newMode = mode === 'light' ? 'dark' : 'light';
+    setMode(newMode);
+  }, [mode, setMode]);
+
+  const value: ThemeContextValue = {
+    theme,
+    mode,
+    accent,
+    setMode,
+    setAccent,
+    toggleMode,
+  };
+
+  return (
+    <ThemeContext.Provider value={value}>{children}</ThemeContext.Provider>
+  );
+}
+
+export function useTheme(): ThemeContextValue {
+  const context = useContext(ThemeContext);
+  if (!context) {
+    throw new Error('useTheme must be used within a ThemeProvider');
+  }
+  return context;
+}