@xenide-io/the-old-ui-theme 0.7.0 → 0.9.0

package/src/suite/icons/glyphs.ts

@@ -56,7 +56,7 @@ export type SuiteIconName =
   | "squid-doc"
   | "stack-hex"
   | "crew-bot"
-  | "nakama-fist"
+  | "shelly-snail"
   | "workspace"
   | "organisation"
   | "integration-plug"
@@ -122,24 +122,18 @@ export const SUITE_GLYPHS: Record<SuiteIconName, SuiteGlyph> = {
       { kind: "path", d: "M9.6 14.6q2.4 1.7 4.8 0", accent: true },
     ],
   },
-  "nakama-fist": {
-    description: "Nakama — raised fist with neon crew signal lines",
+  "shelly-snail": {
+    description: "Shelly — smiling snail with spiral shell and ball-tipped antennae",
     elements: [
       {
         kind: "path",
-        d: "M192 0c17.7 0 32 14.3 32 32v112h-64V32c0-17.7 14.3-32 32-32zM64 64c0-17.7-32-32 32-32s32 14.3 32 32v80H64V64zm192 0c0-17.7 14.3-32 32-32s32 14.3 32 32v96c0 17.7-14.3 32-32 32s-32-14.3-32-32V64zm96 64c0-17.7 14.3-32 32-32s32 14.3 32 32v64c0 17.7-14.3 32-32 32s-32-14.3-32-32v-64zm-96 88v-.6c9.4 5.4 20.3 8.6 32 8.6 13.2 0 25.4-4 35.6-10.8 8.7 24.9 32.5 42.8 60.4 42.8 11.7 0 22.6-3.1 32-8.6v8.6c0 52.3-25.1 98.8-64 128v96c0 17.7-14.3 32-32 32H160c-17.7 0-32-14.3-32-32v-78.4c-17.3-7.9-33.2-18.8-46.9-32.5L69.5 357.5C45.5 333.5 32 300.9 32 267v-27c0-35.3 28.7-64 64-64h88c22.1 0 40 17.9 40 40s-17.9 40-40 40h-56c-8.8 0-16 7.2-16 16s7.2 16 16 16h56c39.8 0 72-32.2 72-72z",
+        d: "M2931 37263 c-1542 -737 -1730 -2870 -339 -3838 427 -297 339 1 1730 -5802 102 -425 101 -430 -391 -950 -1003 -1062 -1175 -1507 -1834 -4748 -1525 -7505 -1398 -10142 668 -13875 2061 -3724 4835 -5715 9185 -6592 2869 -579 4928 -582 8750 -15 1293 192 3408 506 4700 697 6839 1012 8768 1422 9385 1993 1103 1021 425 2357 -1733 3414 l-944 462 916 620 c5469 3705 5358 13657 -209 18536 -2592 2272 -5133 3185 -8865 3185 -3361 0 -5965 -948 -8226 -2994 -501 -453 -824 -546 -824 -235 0 70 301 1416 668 2991 668 2863 668 2863 1053 3101 1156 713 1317 2506 305 3395 -1583 1390 -3787 234 -3592 -1885 61 -673 61 -673 -1165 -3013 l-1227 -2340 -1303 -10 -1303 -10 -1267 2463 c-1202 2337 -1261 2480 -1155 2784 610 1750 -1309 3465 -2983 2666z m1743 -1216 c309 -354 379 -713 232 -1191 -205 -669 -183 -731 1300 -3583 1821 -3503 1488 -3127 2631 -2970 816 112 1053 109 1729 -25 587 -117 813 -127 901 -42 64 63 778 1394 1586 2958 1470 2844 1470 2844 1345 3365 -208 868 106 1458 852 1598 1380 258 1829 -1605 545 -2260 -501 -255 -427 -36 -1292 -3813 l-725 -3166 513 -617 c1210 -1453 1328 -2014 1709 -8068 224 -3562 368 -4603 790 -5688 820 -2113 2775 -3739 5643 -4695 2847 -948 5589 -1186 7567 -654 l850 228 1070 -471 c2352 -1034 2946 -1824 1719 -2288 -1707 -647 -14950 -2665 -17489 -2665 -5500 0 -9506 1872 -11922 5573 -2564 3926 -2753 6473 -1075 14490 542 2586 754 3104 1682 4102 778 837 757 677 322 2415 -188 754 -529 2180 -757 3170 -228 990 -436 1878 -463 1973 -27 95 -246 260 -486 366 -685 303 -961 1115 -610 1795 335 647 1332 736 1833 163z m21523 -6801 c6385 -1036 10732 -7090 9753 -13583 -628 -4167 -2948 -6812 -6688 -7626 -6108 -1329 -10963 4878 -8256 10556 1608 3373 6202 4320 8566 1766 2055 -2219 1699 -6037 -662 -7096 -2082 -935 -4058 98 -4184 2187 -93 1553 1143 2685 2287 2093 607 -313 709 -1340 148 -1481 -564 -142 -462 -962 120 -962 1033 2 1610 1420 1015 2496 -814 1471 -2971 1452 -3972 -37 -1601 -2380 159 -5650 3046 -5658 2778 -8 4680 2269 4503 5390 -265 4668 -5206 7028 -9332 4457 -3911 -2438 -4439 -8515 -1057 -12167 l561 -607 -647 327 c-2556 1290 -3718 2796 -4088 5301 -61 411 -201 2166 -311 3898 -312 4898 -436 5802 -952 6962 l-261 588 532 493 c1419 1314 3729 2427 5782 2786 639 112 3218 59 4097 -83z M5574 23846 c-476 -475 -431 -1229 97 -1644 835 -658 1687 739 970 1590 -326 388 -715 407 -1067 54z M12075 23992 c-669 -390 -584 -1598 134 -1896 608 -252 1135 289 1057 1085 -72 728 -654 1124 -1191 811z M7801 22451 c-626 -754 1585 -1648 2460 -995 485 362 676 688 546 932 -155 288 -335 267 -719 -84 -549 -502 -1237 -469 -1728 82 -224 251 -389 271 -559 65z",
         filled: true,
-        transform: "translate(2.5 1.75) scale(.0425 .0375)",
+        transform: "translate(0.88 22.8) scale(0.0005714 -0.0005714)",
       },
-      { kind: "path", d: "M7 18h3.5M12.2 18h3M8.5 19.5h6", accent: true },
-      {
-        kind: "path",
-        d: "M4.8 5.8h2.7M4.8 7.4h1.4M18.5 17.1h1.7",
-        accent: true,
-      },
-      { kind: "circle", cx: 18.5, cy: 4.5, r: 0.8, accent: true, filled: true },
     ],
   },
+
   workspace: {
     description: "Workspace container — panel with header bar and content",
     elements: [

package/src/suite/index.ts

@@ -45,11 +45,16 @@ export { TodayCalibrating } from "./components/today-calibrating";
 export {
   SuiteThemeProvider,
   useSuiteTheme,
+  SUITE_THEME_COOKIE,
   type SuiteResolvedTheme,
   type SuiteTheme,
   type SuiteThemeConfig,
   type SuiteThemeContextValue,
 } from "./components/theme-provider";
+export {
+  suiteThemeBootScript,
+  type SuiteThemeBootOptions,
+} from "./lib/theme-boot";
 export {
   SuiteAiPanel,
   openSuiteAskAi,
@@ -147,3 +152,25 @@ export {
   SuiteAppLayout,
   type SuiteAppLayoutProps,
 } from "./components/suite-app-layout";
+export {
+  SuiteIntegrationPicker,
+  type SuiteIntegrationPickerItem,
+  type SuiteIntegrationPickerProps,
+} from "./components/suite-integration-picker";
+export {
+  SuiteIntegrationRules,
+  type SuiteIntegrationEvent,
+  type SuiteIntegrationRule,
+  type SuiteIntegrationRuleInput,
+  type SuiteIntegrationRuleProject,
+  type SuiteIntegrationRuleActionType,
+  type SuiteIntegrationRulesProps,
+} from "./components/suite-integration-rules";
+export {
+  SuiteClientsProjectsDirectory,
+  type SuiteClientsProjectsDirectoryProps,
+  type SuiteDirectoryClient,
+  type SuiteDirectoryFields,
+  type SuiteDirectoryProject,
+  type SuiteDirectoryProjectFields,
+} from "./components/suite-clients-projects-directory";

package/src/suite/lib/apps.test.ts

@@ -1,6 +1,6 @@
 import { describe, expect, it } from "vitest";
 
-import { classifySuiteHref } from "./apps";
+import { classifySuiteHref, suiteAppSlugForNotificationSource } from "./apps";
 
 const BASES = {
   tides: "http://localhost:3001",
@@ -38,3 +38,11 @@ describe("classifySuiteHref", () => {
     ).toBeNull();
   });
 });
+
+describe("suiteAppSlugForNotificationSource", () => {
+  it("maps notification source names to suite apps", () => {
+    expect(suiteAppSlugForNotificationSource("portal")).toBe("shellstack");
+    expect(suiteAppSlugForNotificationSource("kraken")).toBe("kraken");
+    expect(suiteAppSlugForNotificationSource("unknown")).toBeNull();
+  });
+});

package/src/suite/lib/apps.ts

@@ -10,7 +10,7 @@ export type SuiteAppSlug =
   | 'tides'
   | 'turtletime'
   | 'kraken'
-  | 'nakama';
+  | 'shelly';
 
 export interface SuiteAppDefinition {
   slug: SuiteAppSlug;
@@ -33,7 +33,7 @@ export const SUITE_APPS: readonly SuiteAppDefinition[] = [
     description: 'Organisation and billing',
     icon: '/icon-shellstack.svg',
     landing: '/home',
-    baseUrlEnv: 'NEXT_PUBLIC_SHELLSTACK_URL',
+    baseUrlEnv: 'NEXT_PUBLIC_PORTAL_URL',
     baseUrlFallback: 'http://localhost:3002',
   },
   {
@@ -64,12 +64,12 @@ export const SUITE_APPS: readonly SuiteAppDefinition[] = [
     baseUrlFallback: 'http://localhost:3003',
   },
   {
-    slug: 'nakama',
-    name: 'Nakama',
+    slug: 'shelly',
+    name: 'Shelly',
     description: 'AI teammates',
-    icon: '/nakama-icon.svg',
+    icon: '/shelly-icon.svg',
     landing: '/today',
-    baseUrlEnv: 'NEXT_PUBLIC_NAKAMA_URL',
+    baseUrlEnv: 'NEXT_PUBLIC_SHELLY_URL',
     baseUrlFallback: 'http://localhost:3004',
   },
 ] as const;
@@ -92,11 +92,17 @@ const SOURCE_APP_SLUG: Record<string, SuiteAppSlug> = {
   turtletime: 'turtletime',
   tides: 'tides',
   kraken: 'kraken',
-  nakama: 'nakama',
+  shelly: 'shelly',
   portal: 'shellstack',
   shellstack: 'shellstack',
 };
 
+export function suiteAppSlugForNotificationSource(
+  sourceApp: string | null | undefined,
+): SuiteAppSlug | null {
+  return SOURCE_APP_SLUG[(sourceApp || '').toLowerCase()] ?? null;
+}
+
 /**
  * Suite notification links are often stored as `/dashboard/...` relative to the
  * *source* app. Resolving them with the current product origin opens the wrong
@@ -110,7 +116,7 @@ export function resolveSuiteNotificationHref(
   if (!value) return '';
   if (/^(https?:|mailto:|\/\/)/i.test(value)) return value;
   const path = value.startsWith('/') ? value : `/${value}`;
-  const slug = SOURCE_APP_SLUG[(sourceApp || '').toLowerCase()];
+  const slug = suiteAppSlugForNotificationSource(sourceApp);
   if (!slug) return path;
   return `${suiteAppBaseUrl(slug)}${path}`;
 }

package/src/suite/lib/cookies.ts

@@ -0,0 +1,53 @@
+/**
+ * Cookie helpers for suite-wide preferences. Suite apps run on different
+ * origins (localhost ports or subdomains), so shared state crosses apps via
+ * one host-wide cookie.
+ */
+
+export function suiteCookieDomainAttr(): string {
+  const host = window.location.hostname;
+  if (host === "localhost" || /^\d{1,3}(?:\.\d{1,3}){3}$/.test(host)) {
+    return "";
+  }
+  // tides.localhost / turtletime.localhost must share one cookie.
+  if (host.endsWith(".localhost")) {
+    return "; Domain=.localhost";
+  }
+  const known = new Set([
+    "tides",
+    "kraken",
+    "turtletime",
+    "time",
+    "shelly",
+    "app",
+    "shellstack",
+    "portal",
+  ]);
+  const parts = host.split(".");
+  if (parts.length >= 3 && known.has(parts[0] ?? "")) {
+    return `; Domain=.${parts.slice(1).join(".")}`;
+  }
+  if (parts.length >= 2) return `; Domain=.${parts.slice(1).join(".")}`;
+  return "";
+}
+
+export function readCookie(name: string): string | null {
+  const prefix = `${name}=`;
+  for (const part of document.cookie.split(";")) {
+    const trimmed = part.trim();
+    if (trimmed.startsWith(prefix)) {
+      return decodeURIComponent(trimmed.slice(prefix.length));
+    }
+  }
+  return null;
+}
+
+export function writeCookie(name: string, value: string): void {
+  const secure = window.location.protocol === "https:" ? "; Secure" : "";
+  document.cookie = `${name}=${encodeURIComponent(value)}; Path=/; Max-Age=31536000; SameSite=Lax${suiteCookieDomainAttr()}${secure}`;
+}
+
+export function clearCookie(name: string): void {
+  const secure = window.location.protocol === "https:" ? "; Secure" : "";
+  document.cookie = `${name}=; Path=/; Max-Age=0; SameSite=Lax${suiteCookieDomainAttr()}${secure}`;
+}

package/src/suite/lib/theme-boot.ts

@@ -0,0 +1,32 @@
+import { SUITE_THEME_COOKIE } from "./theme-cookie";
+import type { SuiteResolvedTheme } from "../components/theme-provider";
+
+export interface SuiteThemeBootOptions {
+  /** `data-theme` attribute value for the light theme. */
+  lightThemeId: string;
+  /** `data-theme` attribute value for the dark theme. */
+  darkThemeId: string;
+  /** Per-app legacy localStorage key (e.g. `bb-theme`) read before falling back to the OS preference. */
+  storageKey?: string;
+  /** Optional `<meta id="theme-color-meta">` colours, set alongside the theme. */
+  themeColorLight?: string;
+  themeColorDark?: string;
+  /** Resolved mode when `matchMedia` is unavailable. Defaults to `light`. */
+  fallback?: SuiteResolvedTheme;
+}
+
+/**
+ * Inline `<head>` script that applies the suite theme before first paint.
+ * Mode resolution order: the shared `xenide-suite-theme` cookie (one
+ * preference across all suite apps), then the per-app legacy storage key,
+ * then the OS `prefers-color-scheme`, then the fallback.
+ */
+export function suiteThemeBootScript(options: SuiteThemeBootOptions): string {
+  const light = JSON.stringify(options.lightThemeId);
+  const dark = JSON.stringify(options.darkThemeId);
+  const storageKey = JSON.stringify(options.storageKey ?? null);
+  const metaLight = JSON.stringify(options.themeColorLight ?? null);
+  const metaDark = JSON.stringify(options.themeColorDark ?? null);
+  const fallback = JSON.stringify(options.fallback ?? "light");
+  return `(function(){try{var m=null;var c=document.cookie.match(/(?:^|;\\s*)${SUITE_THEME_COOKIE}=(light|dark|system)/);if(c)m=c[1];var k=${storageKey};if(!m&&k){try{var t=localStorage.getItem(k);if(t==='light'||t==='dark')m=t;}catch(e){}}var d=null;try{d=window.matchMedia('(prefers-color-scheme: dark)').matches;}catch(e){d=${fallback}==='dark';}if(!m)m=d?'dark':'light';else if(m==='system')m=d?'dark':'light';var th=m==='dark'?${dark}:${light};var de=document.documentElement;de.setAttribute('data-theme',th);de.classList.toggle('dark',m==='dark');var meta=document.getElementById('theme-color-meta');if(meta&&(${metaLight})&&(${metaDark}))meta.setAttribute('content',m==='dark'?${metaDark}:${metaLight});}catch(e){document.documentElement.setAttribute('data-theme',${light});}})();`;
+}

package/src/suite/lib/theme-cookie.ts

@@ -0,0 +1,7 @@
+/**
+ * Shared suite theme cookie names. Lives in its own module so non-React
+ * consumers (boot scripts) can import it without pulling in client code.
+ */
+
+export const SUITE_THEME_COOKIE = 'xenide-suite-theme';
+export const SUITE_THEME_CHANNEL = 'xenide-suite-theme';

package/src/suite/lib/use-sidebar-width.ts

@@ -7,13 +7,15 @@ import {
   type PointerEvent as ReactPointerEvent,
 } from "react";
 
+import { clearCookie, readCookie, writeCookie } from "./cookies";
+
 export const SIDEBAR_RAIL_WIDTH = 56;
 export const SIDEBAR_COLLAPSE_THRESHOLD = 80;
 export const SIDEBAR_MIN_EXPANDED_WIDTH = 180;
 export const SIDEBAR_MAX_WIDTH = 640;
 export const SIDEBAR_DEFAULT_WIDTH = 320;
 
-/** Shared across Tides / TurtleTime / Kraken / ShellStack / Nakama. */
+/** Shared across Tides / TurtleTime / Kraken / ShellStack / Shelly. */
 export const SUITE_SIDEBAR_WIDTH_KEY = "shellstack:sidebar-width";
 export const SUITE_SIDEBAR_WIDTH_COOKIE = "shellstack_sidebar_width";
 
@@ -22,7 +24,6 @@ const LEGACY_SIDEBAR_WIDTH_KEYS = [
   "tt-sidebar-width",
   "kraken-sidebar-width",
   "shellstack-sidebar-width",
-  "nakama-sidebar-width",
 ] as const;
 
 function isSuiteSidebarKey(storageKey: string): boolean {
@@ -40,6 +41,7 @@ export function sidebarColumnWidth(
   collapsed: boolean,
   _chatOpen = false,
 ): number {
+  void _chatOpen;
   if (collapsed) return SIDEBAR_RAIL_WIDTH;
   return width;
 }
@@ -60,54 +62,6 @@ function parseWidth(raw: string | null | undefined): number | null {
   return Number.isNaN(parsed) ? null : parsed;
 }
 
-function suiteCookieDomainAttr(): string {
-  const host = window.location.hostname;
-  if (host === "localhost" || /^\d{1,3}(?:\.\d{1,3}){3}$/.test(host)) {
-    return "";
-  }
-  // tides.localhost / turtletime.localhost must share one cookie.
-  if (host.endsWith(".localhost")) {
-    return "; Domain=.localhost";
-  }
-  const known = new Set([
-    "tides",
-    "kraken",
-    "turtletime",
-    "time",
-    "nakama",
-    "app",
-    "shellstack",
-    "portal",
-  ]);
-  const parts = host.split(".");
-  if (parts.length >= 3 && known.has(parts[0] ?? "")) {
-    return `; Domain=.${parts.slice(1).join(".")}`;
-  }
-  if (parts.length >= 2) return `; Domain=.${parts.slice(1).join(".")}`;
-  return "";
-}
-
-function readCookie(name: string): string | null {
-  const prefix = `${name}=`;
-  for (const part of document.cookie.split(";")) {
-    const trimmed = part.trim();
-    if (trimmed.startsWith(prefix)) {
-      return decodeURIComponent(trimmed.slice(prefix.length));
-    }
-  }
-  return null;
-}
-
-function writeCookie(name: string, value: string): void {
-  const secure = window.location.protocol === "https:" ? "; Secure" : "";
-  document.cookie = `${name}=${encodeURIComponent(value)}; Path=/; Max-Age=31536000; SameSite=Lax${suiteCookieDomainAttr()}${secure}`;
-}
-
-function clearCookie(name: string): void {
-  const secure = window.location.protocol === "https:" ? "; Secure" : "";
-  document.cookie = `${name}=; Path=/; Max-Age=0; SameSite=Lax${suiteCookieDomainAttr()}${secure}`;
-}
-
 export function readSidebarWidth(storageKey: string): number | null {
   try {
     if (isSuiteSidebarKey(storageKey)) {
@@ -173,7 +127,7 @@ export function useSidebarWidth(
   const fallbackWidth = snapWidth(clampWidth(defaultWidth));
   // ponytail: always start at the default so SSR and the first client render
   // match. Reading the cookie in useState() hydrates 320 vs 412 and React
-  // keeps the server width — TurtleTime / ShellStack / Nakama stay stuck.
+  // keeps the server width — TurtleTime / ShellStack / Shelly stay stuck.
   const [width, setWidth] = useState(fallbackWidth);
   const [narrowViewport, setNarrowViewport] = useState(false);
   const collapsed = narrowViewport || width <= SIDEBAR_COLLAPSE_THRESHOLD;