@elizaos/app-core 2.0.0-alpha.52 → 2.0.0-alpha.53

package/src/components/companion/walletUtils.ts

@@ -1,290 +0,0 @@
-import type { BscTradeTxStatusResponse } from "@elizaos/app-core/api";
-import { getExplorerTokenUrl } from "../chainConfig";
-
-export type TranslatorFn = (
-  key: string,
-  vars?: Record<string, string | number>,
-) => string;
-
-export function getWalletTxStatusLabel(
-  status: string,
-  t: TranslatorFn,
-): string {
-  const key = `wallet.txStatus.${status}`;
-  const translated = t(key);
-  return translated === key ? status : translated;
-}
-
-export function mapWalletTradeError(
-  err: unknown,
-  t: TranslatorFn,
-  fallbackKey: string,
-): string {
-  if (err instanceof Error && err.message) return err.message;
-  if (typeof err === "string" && err.length > 0) return err;
-  return t(fallbackKey);
-}
-
-export const BSC_GAS_READY_THRESHOLD = 0.005;
-export const BSC_SWAP_GAS_RESERVE = 0.002;
-export const HEX_ADDRESS_RE = /^0x[a-fA-F0-9]{40}$/;
-export const MILADY_BSC_TOKEN_ADDRESS =
-  "0xc20e45e49e0e79f0fc81e71f05fd2772d6587777";
-export const BSC_USDT_TOKEN_ADDRESS =
-  "0x55d398326f99059fF775485246999027B3197955";
-export const BSC_USDC_TOKEN_ADDRESS =
-  "0x8AC76a51cc950d9822D68b83fE1Ad97B32Cd580d";
-export const BSC_NATIVE_LOGO_URL =
-  "https://raw.githubusercontent.com/trustwallet/assets/master/blockchains/smartchain/info/logo.png";
-export const SOL_NATIVE_LOGO_URL =
-  "https://raw.githubusercontent.com/trustwallet/assets/master/blockchains/solana/info/logo.png";
-export const AVAX_NATIVE_LOGO_URL =
-  "https://raw.githubusercontent.com/trustwallet/assets/master/blockchains/avalanchec/info/logo.png";
-export const WALLET_RECENT_TRADES_KEY = "anime_wallet_recent_trades";
-export const MAX_WALLET_RECENT_TRADES = 10;
-
-export type WalletPortfolioChainFilter =
-  | "all"
-  | "bsc"
-  | "evm"
-  | "solana"
-  | "avax"
-  | (string & {});
-
-export type WalletTokenRow = {
-  key: string;
-  symbol: string;
-  name: string;
-  chain: string;
-  chainKey: Exclude<WalletPortfolioChainFilter, "all">;
-  assetAddress: string | null;
-  isNative: boolean;
-  valueUsd: number;
-  balance: string;
-  logoUrl: string | null;
-};
-
-export type WalletCollectibleRow = {
-  key: string;
-  chain: string;
-  chainKey: Exclude<WalletPortfolioChainFilter, "all">;
-  name: string;
-  collectionName: string;
-  imageUrl: string | null;
-};
-
-export type WalletRecentTrade = {
-  hash: string;
-  side: "buy" | "sell";
-  tokenAddress: string;
-  amount: string;
-  inputSymbol: string;
-  outputSymbol: string;
-  createdAt: number;
-  status: BscTradeTxStatusResponse["status"];
-  confirmations: number;
-  nonce: number | null;
-  reason: string | null;
-  explorerUrl: string;
-};
-
-export type WalletRecentFilter = "all" | BscTradeTxStatusResponse["status"];
-
-export type TokenMetadata = {
-  symbol: string;
-  name: string;
-  logoUrl: string | null;
-};
-
-export function isBscChainName(chain: string): boolean {
-  const normalized = chain.trim().toLowerCase();
-  return (
-    normalized === "bsc" ||
-    normalized === "bnb chain" ||
-    normalized === "bnb smart chain"
-  );
-}
-
-export function isAvaxChainName(chain: string): boolean {
-  const normalized = chain.trim().toLowerCase();
-  return (
-    normalized === "avax" ||
-    normalized === "avalanche" ||
-    normalized === "c-chain" ||
-    normalized === "avalanche c-chain"
-  );
-}
-
-export function resolvePortfolioChainKey(
-  chain: string,
-): Exclude<WalletPortfolioChainFilter, "all"> {
-  const normalized = chain.trim().toLowerCase();
-  if (isBscChainName(chain)) return "bsc";
-  if (isAvaxChainName(chain)) return "avax";
-  if (normalized.includes("solana") || normalized === "sol") return "solana";
-  return "evm";
-}
-
-export function formatRouteAddress(address: string): string {
-  const trimmed = address.trim();
-  if (trimmed.length <= 14) return trimmed;
-  return `${trimmed.slice(0, 6)}...${trimmed.slice(-4)}`;
-}
-
-export function getTokenExplorerUrl(row: WalletTokenRow): string | null {
-  if (!row.assetAddress) return null;
-  // Delegate to the central chain config registry
-  return getExplorerTokenUrl(row.chain, row.assetAddress);
-}
-
-export function loadRecentTrades(): WalletRecentTrade[] {
-  if (typeof localStorage === "undefined") return [];
-  try {
-    const raw = localStorage.getItem(WALLET_RECENT_TRADES_KEY);
-    const parsed = raw ? JSON.parse(raw) : [];
-    if (!Array.isArray(parsed)) return [];
-    return parsed
-      .filter(
-        (entry): entry is WalletRecentTrade =>
-          Boolean(entry) &&
-          typeof entry === "object" &&
-          typeof entry.hash === "string" &&
-          typeof entry.side === "string" &&
-          (entry.side === "buy" || entry.side === "sell") &&
-          typeof entry.createdAt === "number" &&
-          typeof entry.status === "string",
-      )
-      .slice(0, MAX_WALLET_RECENT_TRADES);
-  } catch {
-    return [];
-  }
-}
-
-export function persistRecentTrades(rows: WalletRecentTrade[]): void {
-  if (typeof localStorage === "undefined") return;
-  try {
-    localStorage.setItem(
-      WALLET_RECENT_TRADES_KEY,
-      JSON.stringify(rows.slice(0, MAX_WALLET_RECENT_TRADES)),
-    );
-  } catch {
-    // Ignore persistence errors so wallet actions remain usable.
-  }
-}
-
-/**
- * Returns a safe explorer URL, falling back to a configurable explorer
- * (defaults to bscscan) if the provided URL does not use an https/http
- * scheme (prevents javascript: URI injection).
- */
-export function safeExplorerHref(
-  explorerUrl: string | undefined | null,
-  hash: string,
-  fallbackBaseUrl = "https://bscscan.com",
-): string {
-  const fallback = `${fallbackBaseUrl}/tx/${hash}`;
-  if (!explorerUrl) return fallback;
-  return /^https?:\/\//i.test(explorerUrl) ? explorerUrl : fallback;
-}
-
-export function shortHash(hash: string): string {
-  const normalized = hash.trim();
-  if (normalized.length <= 14) return normalized;
-  return `${normalized.slice(0, 8)}...${normalized.slice(-6)}`;
-}
-
-export function getRecentTradeGroupKey(
-  createdAt: number,
-  nowMs: number = Date.now(),
-): "today" | "yesterday" | "earlier" {
-  const DAY_MS = 24 * 60 * 60 * 1000;
-  const now = new Date(nowMs);
-  const startOfToday = new Date(
-    now.getFullYear(),
-    now.getMonth(),
-    now.getDate(),
-  ).getTime();
-  const startOfCreatedAt = new Date(createdAt);
-  const createdDayStart = new Date(
-    startOfCreatedAt.getFullYear(),
-    startOfCreatedAt.getMonth(),
-    startOfCreatedAt.getDate(),
-  ).getTime();
-  if (createdDayStart >= startOfToday) return "today";
-  if (createdDayStart >= startOfToday - DAY_MS) return "yesterday";
-  return "earlier";
-}
-
-export type DexScreenerTokenRef = {
-  address?: string;
-  symbol?: string;
-  name?: string;
-};
-
-export type DexScreenerPair = {
-  chainId?: string;
-  baseToken?: DexScreenerTokenRef;
-  quoteToken?: DexScreenerTokenRef;
-  info?: {
-    imageUrl?: string;
-  };
-};
-
-export type DexScreenerTokenResponse = {
-  pairs?: DexScreenerPair[];
-};
-
-/**
- * Fetch token metadata from DexScreener for any supported chain.
- * Falls back to `fetchBscTokenMetadata` signature when no chainId given.
- */
-export async function fetchTokenMetadata(
-  contractAddress: string,
-  dexScreenerChainId = "bsc",
-): Promise<TokenMetadata | null> {
-  if (typeof fetch !== "function") return null;
-  const trimmed = contractAddress.trim();
-  if (!HEX_ADDRESS_RE.test(trimmed)) return null;
-  const controller = new AbortController();
-  const timeout = globalThis.setTimeout(() => controller.abort(), 3500);
-  const normalized = trimmed.toLowerCase();
-  const targetChainId = dexScreenerChainId.toLowerCase();
-
-  try {
-    const response = await fetch(
-      `https://api.dexscreener.com/latest/dex/tokens/${trimmed}`,
-      {
-        signal: controller.signal,
-      },
-    );
-    if (!response.ok) return null;
-    const payload = (await response.json()) as DexScreenerTokenResponse;
-    const pairs = Array.isArray(payload.pairs) ? payload.pairs : [];
-    const pair = pairs.find(
-      (item) => (item.chainId ?? "").toLowerCase() === targetChainId,
-    );
-    if (!pair) return null;
-    const baseAddr = pair.baseToken?.address?.trim().toLowerCase();
-    const quoteAddr = pair.quoteToken?.address?.trim().toLowerCase();
-    const tokenRef =
-      baseAddr === normalized
-        ? pair.baseToken
-        : quoteAddr === normalized
-          ? pair.quoteToken
-          : pair.baseToken;
-    return {
-      symbol: tokenRef?.symbol?.trim() || "TOKEN",
-      name: tokenRef?.name?.trim() || "Unknown Token",
-      logoUrl: pair.info?.imageUrl?.trim() || null,
-    };
-  } catch {
-    return null;
-  } finally {
-    clearTimeout(timeout);
-  }
-}
-
-/** @deprecated Use `fetchTokenMetadata(address, "bsc")` instead. */
-export const fetchBscTokenMetadata = (
-  contractAddress: string,
-): Promise<TokenMetadata | null> => fetchTokenMetadata(contractAddress, "bsc");

package/src/components/companion-shell-styles.test.ts

@@ -1,142 +0,0 @@
-import type { Tab } from "@elizaos/app-core/navigation";
-import { describe, expect, it } from "vitest";
-import {
-  ACCENT_COLORS,
-  accentForegroundVar,
-  accentSubtleVar,
-  accentVar,
-  COMPANION_OVERLAY_TABS,
-  cardSizeClass,
-  overlayBackdropClass,
-  TOP_BAR_COLORS,
-  tabFlags,
-  viewWrapperStyle,
-} from "./companion-shell-styles";
-
-describe("COMPANION_OVERLAY_TABS", () => {
-  it("contains only companion — settings/character/skills etc. require native mode", () => {
-    expect(COMPANION_OVERLAY_TABS.has("companion")).toBe(true);
-  });
-
-  it("does not treat other tabs as companion overlay", () => {
-    expect(COMPANION_OVERLAY_TABS.has("chat")).toBe(false);
-    expect(COMPANION_OVERLAY_TABS.has("settings")).toBe(false);
-    expect(COMPANION_OVERLAY_TABS.has("skills")).toBe(false);
-  });
-});
-
-describe("tabFlags", () => {
-  const advancedOverlayTabs: Tab[] = [
-    "advanced",
-    "actions",
-    "fine-tuning",
-    "trajectories",
-    "runtime",
-    "database",
-    "logs",
-    "security",
-  ];
-
-  for (const tab of advancedOverlayTabs) {
-    it(`${tab} is an advanced overlay`, () => {
-      expect(tabFlags(tab).isAdvancedOverlay).toBe(true);
-      expect(tabFlags(tab).isCentered).toBe(true);
-    });
-  }
-
-  it("keeps non-advanced tabs out of the advanced overlay bucket", () => {
-    expect(tabFlags("chat").isAdvancedOverlay).toBe(false);
-    expect(tabFlags("stream").isAdvancedOverlay).toBe(false);
-    expect(tabFlags("triggers").isAdvancedOverlay).toBe(false);
-    expect(tabFlags("wallets").isAdvancedOverlay).toBe(false);
-    expect(tabFlags("settings").isAdvancedOverlay).toBe(false);
-    expect(tabFlags("knowledge").isAdvancedOverlay).toBe(false);
-  });
-
-  it("treats triggers as a settings-style layout", () => {
-    expect(tabFlags("triggers").isSettings).toBe(true);
-    expect(tabFlags("triggers").isCentered).toBe(true);
-  });
-
-  it("reports individual flags consistently", () => {
-    expect(tabFlags("skills").isSkills).toBe(true);
-    expect(tabFlags("stream").isStream).toBe(true);
-    expect(tabFlags("wallets").isWallets).toBe(true);
-    expect(tabFlags("character").isCharacter).toBe(true);
-    expect(tabFlags("character-select").isCharacter).toBe(true);
-    expect(tabFlags("actions").isSkills).toBe(false);
-    expect(tabFlags("actions").isStream).toBe(false);
-    expect(tabFlags("actions").isCharacter).toBe(false);
-    expect(tabFlags("actions").isWallets).toBe(false);
-  });
-});
-
-describe("derived style helpers", () => {
-  it("gives advanced overlays the large centered card layout", () => {
-    const classes = cardSizeClass(tabFlags("actions"));
-    expect(classes).toContain("w-[95vw]");
-    expect(classes).toContain("h-[95vh]");
-    expect(classes).toContain("rounded-2xl");
-    expect(classes).toContain("overflow-hidden");
-  });
-
-  it("gives advanced overlays the dark blurred backdrop", () => {
-    const classes = overlayBackdropClass(tabFlags("actions"));
-    expect(classes).toContain("backdrop-blur-2xl");
-    expect(classes).toContain("bg-black/50");
-    expect(classes).toContain("pointer-events-auto");
-  });
-
-  it("keeps chat as the base view without backdrop", () => {
-    expect(overlayBackdropClass(tabFlags("chat"))).toBe("opacity-0");
-  });
-
-  it("uses the default accent for generic advanced overlays", () => {
-    const flags = tabFlags("actions");
-    expect(accentVar(flags)).toBe("#7b8fb5");
-    expect(accentSubtleVar(flags)).toBe("rgba(123, 143, 181, 0.12)");
-  });
-
-  it("keeps special-case accents for stream and wallets", () => {
-    expect(accentVar(tabFlags("stream"))).toBe("#ef4444");
-    expect(accentVar(tabFlags("wallets"))).toBe("#f0b90b");
-  });
-
-  it("keeps card surfaces non-transparent in base chat shell", () => {
-    const style = viewWrapperStyle(tabFlags("chat"), "#7b8fb5");
-    expect(style["--card"]).toBe("rgba(255, 255, 255, 0.05)");
-  });
-
-  it("uses dark accent foregrounds for yellow companion tabs", () => {
-    expect(accentForegroundVar(tabFlags("wallets"))).toBe("#1a1f26");
-    expect(accentForegroundVar(tabFlags("skills"))).toBe("#1a1f26");
-    expect(accentForegroundVar(tabFlags("knowledge"))).toBe("#ffffff");
-  });
-});
-
-describe("App.tsx advanced-tab parity", () => {
-  const advancedParityTabs: Tab[] = [
-    "advanced",
-    "actions",
-    "fine-tuning",
-    "trajectories",
-    "runtime",
-    "database",
-    "logs",
-    "security",
-  ];
-
-  for (const tab of advancedParityTabs) {
-    it(`${tab} stays aligned with the native-shell advanced layout contract`, () => {
-      expect(tabFlags(tab).isAdvancedOverlay).toBe(true);
-    });
-  }
-});
-
-describe("accent palettes", () => {
-  it("keeps stable accent constants", () => {
-    expect(ACCENT_COLORS.stream).toBe("#ef4444");
-    expect(ACCENT_COLORS.skills).toBe("#f0b232");
-    expect(TOP_BAR_COLORS.stream).toContain("239, 68, 68");
-  });
-});

package/src/components/companion-shell-styles.ts

@@ -1,270 +0,0 @@
-/**
- * Style helpers and constants for the companion shell overlay.
- */
-
-import type { Tab } from "@elizaos/app-core/navigation";
-import type React from "react";
-
-/* ── Overlay tab set ───────────────────────────────────────────────── */
-
-/** Only "companion" uses the companion shell. Settings, character, etc. require native (advanced) mode. */
-export const COMPANION_OVERLAY_TABS = new Set<Tab>(["companion"]);
-
-/* ── Per-tab accent / color config ─────────────────────────────────── */
-
-export const ACCENT_COLORS: Record<string, string> = {
-  skills: "#f0b232",
-  apps: "#10b981",
-  plugins: "#f0b232",
-  connectors: "#f0b232",
-  knowledge: "#a78bfa",
-  wallets: "#f0b90b",
-  stream: "#ef4444",
-  lifo: "#8b5cf6",
-};
-
-export const TOP_BAR_COLORS: Record<string, string> = {
-  skills: "#f0b232",
-  wallets: "rgba(240, 185, 11, 0.7)",
-  lifo: "rgba(139, 92, 246, 0.7)",
-  stream: "rgba(239, 68, 68, 0.7)",
-  plugins: "#f0b232",
-  connectors: "#f0b232",
-  apps: "rgba(16, 185, 129, 0.7)",
-  knowledge: "rgba(167, 139, 250, 0.7)",
-};
-
-/* ── Tab flags ─────────────────────────────────────────────────────── */
-
-export function tabFlags(tab: Tab) {
-  const isSkills = tab === "skills";
-  const isSettings = tab === "settings" || tab === "triggers";
-  const isPlugins = tab === "plugins";
-  const isLifo = tab === "lifo";
-  const isStream = tab === "stream";
-  const isWallets = tab === "wallets";
-  const isApps = tab === "apps";
-  const isConnectors = tab === "connectors";
-  const isKnowledge = tab === "knowledge";
-  const isAdvancedOverlay =
-    tab === "advanced" ||
-    tab === "actions" ||
-    tab === "fine-tuning" ||
-    tab === "trajectories" ||
-    tab === "runtime" ||
-    tab === "database" ||
-    tab === "logs" ||
-    tab === "security" ||
-    isLifo;
-  const isPluginsLike = isPlugins || isConnectors || isSkills;
-  const isCentered =
-    isSkills ||
-    isSettings ||
-    isPlugins ||
-    isAdvancedOverlay ||
-    isApps ||
-    isConnectors ||
-    isKnowledge ||
-    isLifo ||
-    isStream ||
-    isWallets;
-  const isCharacter = tab === "character" || tab === "character-select";
-
-  return {
-    isSkills,
-    isSettings,
-    isPlugins,
-    isLifo,
-    isStream,
-    isWallets,
-    isApps,
-    isConnectors,
-    isKnowledge,
-    isAdvancedOverlay,
-    isPluginsLike,
-    isCentered,
-    isCharacter,
-  };
-}
-
-export type TabFlags = ReturnType<typeof tabFlags>;
-
-/* ── Layout helpers ────────────────────────────────────────────────── */
-
-export function overlayBackdropClass(f: TabFlags) {
-  if (f.isPluginsLike)
-    return "opacity-100 backdrop-blur-xl bg-black/35 pointer-events-auto";
-  if (
-    f.isSettings ||
-    f.isAdvancedOverlay ||
-    f.isApps ||
-    f.isKnowledge ||
-    f.isLifo ||
-    f.isStream ||
-    f.isWallets
-  )
-    return "opacity-100 backdrop-blur-2xl bg-black/50 pointer-events-auto";
-  if (f.isCharacter) return "opacity-100";
-  return "opacity-0";
-}
-
-export function cardSizeClass(f: TabFlags) {
-  if (f.isPluginsLike)
-    return "w-[97vw] h-[92vh] md:w-[88vw] md:h-[80vh] max-w-[1460px] overflow-visible";
-  if (f.isAdvancedOverlay)
-    return "w-[95vw] h-[95vh] max-w-[1500px] backdrop-blur-3xl border rounded-2xl overflow-hidden";
-  if (f.isSettings || f.isApps || f.isKnowledge || f.isWallets)
-    return "w-[90vw] h-[90vh] max-w-5xl backdrop-blur-3xl border rounded-2xl overflow-hidden";
-  return "w-[65vw] min-w-[700px] h-[100vh] border-l backdrop-blur-2xl";
-}
-
-export function cardBackground(f: TabFlags) {
-  if (f.isPluginsLike) return "transparent";
-  if (
-    f.isSettings ||
-    f.isAdvancedOverlay ||
-    f.isApps ||
-    f.isKnowledge ||
-    f.isWallets
-  )
-    return "rgba(18, 22, 32, 0.92)";
-  return "linear-gradient(to left, rgba(6, 8, 12, 0.95) 40%, rgba(6, 8, 12, 0.7) 80%, rgba(6, 8, 12, 0.2) 100%)";
-}
-
-export function cardBorderColor(f: TabFlags) {
-  if (f.isPluginsLike) return "transparent";
-  if (
-    f.isSettings ||
-    f.isAdvancedOverlay ||
-    f.isApps ||
-    f.isKnowledge ||
-    f.isWallets
-  )
-    return "rgba(255, 255, 255, 0.08)";
-  return "rgba(255,255,255,0.05)";
-}
-
-export function cardBoxShadow(f: TabFlags, _shadowFx: string) {
-  if (f.isPluginsLike) return "none";
-  if (
-    f.isSettings ||
-    f.isAdvancedOverlay ||
-    f.isApps ||
-    f.isKnowledge ||
-    f.isWallets
-  )
-    return "0 8px 60px rgba(0,0,0,0.6), 0 2px 24px rgba(0,0,0,0.4)";
-  return "-60px 0 100px -20px rgba(0,0,0,0.8)";
-}
-
-/* ── Accent color helpers ──────────────────────────────────────────── */
-
-export function accentVar(f: TabFlags) {
-  if (f.isPluginsLike) return "#f0b232";
-  if (f.isApps) return "#10b981";
-  if (f.isKnowledge) return "#a78bfa";
-  if (f.isWallets) return "#f0b90b";
-  if (f.isLifo) return "#8b5cf6";
-  if (f.isStream) return "#ef4444";
-  return "#7b8fb5";
-}
-
-export function accentSubtleVar(f: TabFlags) {
-  if (f.isPluginsLike) return "rgba(240, 178, 50, 0.12)";
-  if (f.isApps) return "rgba(16, 185, 129, 0.12)";
-  if (f.isKnowledge) return "rgba(167, 139, 250, 0.12)";
-  if (f.isWallets) return "rgba(240, 185, 11, 0.12)";
-  if (f.isLifo) return "rgba(139, 92, 246, 0.12)";
-  if (f.isStream) return "rgba(239, 68, 68, 0.12)";
-  return "rgba(123, 143, 181, 0.12)";
-}
-
-export function accentRgbVar(f: TabFlags) {
-  if (f.isPluginsLike) return "240, 178, 50";
-  if (f.isApps) return "16, 185, 129";
-  if (f.isKnowledge) return "167, 139, 250";
-  if (f.isWallets) return "240, 185, 11";
-  if (f.isLifo) return "139, 92, 246";
-  if (f.isStream) return "239, 68, 68";
-  return "123, 143, 181";
-}
-
-export function accentForegroundVar(f: TabFlags) {
-  if (f.isPluginsLike || f.isWallets) return "#1a1f26";
-  return "#ffffff";
-}
-
-/* ── View wrapper helpers ──────────────────────────────────────────── */
-
-export function viewWrapperOverflow(f: TabFlags) {
-  if (f.isPluginsLike) return "overflow-visible";
-  if (
-    f.isSettings ||
-    f.isAdvancedOverlay ||
-    f.isApps ||
-    f.isConnectors ||
-    f.isWallets
-  )
-    return "overflow-hidden";
-  return "overflow-y-auto";
-}
-
-export function viewWrapperPadding(f: TabFlags) {
-  // Skills now uses isPluginsLike path (p-0)
-  if (
-    f.isSettings ||
-    f.isAdvancedOverlay ||
-    f.isApps ||
-    f.isConnectors ||
-    f.isPlugins ||
-    f.isWallets
-  )
-    return "p-0";
-  if (f.isKnowledge) return "px-8 py-8";
-  return "px-16 pt-32 pb-16";
-}
-
-export function viewWrapperStyle(
-  f: TabFlags,
-  accentColor: string,
-): React.CSSProperties {
-  if (
-    f.isSettings ||
-    f.isPlugins ||
-    f.isSkills ||
-    f.isAdvancedOverlay ||
-    f.isApps ||
-    f.isConnectors ||
-    f.isKnowledge ||
-    f.isWallets
-  ) {
-    return {
-      "--bg": "transparent",
-      "--card": "rgba(255, 255, 255, 0.05)",
-      "--border": "rgba(255, 255, 255, 0.08)",
-      "--accent": accentVar(f),
-      "--accent-foreground": accentForegroundVar(f),
-      "--accent-subtle": accentSubtleVar(f),
-      "--accent-rgb": accentRgbVar(f),
-      "--muted": "rgba(255, 255, 255, 0.45)",
-      "--txt": "rgba(240, 238, 250, 0.92)",
-      "--text": "rgba(240, 238, 250, 0.92)",
-      "--danger": "#ef4444",
-      "--ok": "#22c55e",
-      "--warning": "#f59e0b",
-      "--surface": "rgba(255, 255, 255, 0.06)",
-      "--bg-hover": "rgba(255, 255, 255, 0.04)",
-      "--bg-muted": "rgba(255, 255, 255, 0.03)",
-      "--border-hover": "rgba(255, 255, 255, 0.15)",
-    } as React.CSSProperties;
-  }
-  return {
-    "--bg": "transparent",
-    "--card": "rgba(255, 255, 255, 0.05)",
-    "--border": f.isSkills ? "rgba(0,225,255,0.3)" : "rgba(255,255,255,0.08)",
-    "--accent": accentColor,
-    "--accent-foreground": accentForegroundVar(f),
-    "--muted": "rgba(255, 255, 255, 0.55)",
-    "--txt": "#ffffff",
-  } as React.CSSProperties;
-}