@arcote.tech/platform 0.5.1 → 0.5.5

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@arcote.tech/platform",
   "type": "module",
-  "version": "0.5.1",
+  "version": "0.5.5",
   "private": false,
   "author": "Przemysław Krasiński [arcote.tech]",
   "description": "Arc Platform — module system, router, layout, theme, i18n, platform app shell",
@@ -18,11 +18,11 @@
     "type-check": "tsc --noEmit"
   },
   "dependencies": {
-    "@arcote.tech/arc-ds": "^0.5.1",
-    "@arcote.tech/arc-react": "^0.5.1"
+    "@arcote.tech/arc-ds": "^0.5.5",
+    "@arcote.tech/arc-react": "^0.5.5"
   },
   "peerDependencies": {
-    "@arcote.tech/arc": "^0.5.1",
+    "@arcote.tech/arc": "^0.5.5",
     "@lingui/core": "^5.0.0",
     "@lingui/react": "^5.0.0",
     "framer-motion": "^12.0.0",

package/src/index.ts

@@ -109,6 +109,7 @@ export type {
   ArcFragment,
   ArcLayoutComponent,
   ArcModule,
+  BuildManifest,
   BuiltModule,
   ContextElementFragment,
   ModuleAccess,

package/src/layout/page-router.tsx

@@ -9,6 +9,7 @@ import type { PageFragment } from "../types";
 type MatchResult = {
   page: PageFragment;
   child?: PageFragment;
+  grandchild?: PageFragment;
   params: Record<string, string>;
 };
 
@@ -23,6 +24,26 @@ function matchPage(path: string, pages: PageFragment[]): MatchResult | undefined
     if (p.children?.length) {
       if (path === p.path) return { page: p, params: {} };
 
+      // Check grandchildren first (deeper match wins)
+      for (const c of p.children) {
+        if (c.children?.length) {
+          if (path === c.path) return { page: p, child: c, params: {} };
+
+          const exactGrandchild = c.children.find((gc) => gc.path === path);
+          if (exactGrandchild) return { page: p, child: c, grandchild: exactGrandchild, params: {} };
+
+          for (const gc of c.children) {
+            if (hasRouteParams(gc.path)) {
+              const params = matchRoutePath(gc.path, path);
+              if (params) return { page: p, child: c, grandchild: gc, params };
+            }
+          }
+
+          const prefixGrandchild = c.children.find((gc) => path.startsWith(gc.path));
+          if (prefixGrandchild) return { page: p, child: c, grandchild: prefixGrandchild, params: {} };
+        }
+      }
+
       // Try exact child match first
       const exactChild = p.children.find((c) => c.path === path);
       if (exactChild) return { page: p, child: exactChild, params: {} };
@@ -94,7 +115,7 @@ export function PageRouter() {
     return null;
   }
 
-  const { page, child } = match;
+  const { page, child, grandchild } = match;
   const Layout = page.layout ?? DefaultLayout;
 
   // Parent with children — redirect to first child if at parent path
@@ -103,6 +124,29 @@ export function PageRouter() {
     return null;
   }
 
+  // Grandchild — nested shell: OuterShell > InnerShell > GrandchildComponent
+  if (page.children?.length && child?.children?.length && grandchild) {
+    const OuterShell = page.component;
+    const InnerShell = child.component;
+    const GrandchildComponent = grandchild.component;
+    const content = (
+      <OuterShell tabs={page.children}>
+        <InnerShell tabs={child.children}>
+          <Suspense fallback={null}>
+            <GrandchildComponent />
+          </Suspense>
+        </InnerShell>
+      </OuterShell>
+    );
+    return Layout ? <Layout>{content}</Layout> : content;
+  }
+
+  // Child with its own children — redirect to first grandchild
+  if (page.children?.length && child?.children?.length && !grandchild) {
+    navigate(child.children[0].path);
+    return null;
+  }
+
   // Parent with active child — render shell with tabs
   if (page.children?.length && child) {
     const Shell = page.component;

package/src/layout/page-sub-nav-shell.tsx

@@ -3,11 +3,26 @@ import type { PageFragment } from "../types";
 import { useArcNavigate, useArcRoute } from "../router";
 import { SubNavShell } from "@arcote.tech/arc-ds";
 
+/**
+ * Decide whether a child page should be shown as a tab in the sub-nav.
+ *
+ * Rules:
+ *  - Explicit `nav: false` always hides the tab.
+ *  - Parameterized paths (e.g. `/strategy/assistant/:stage`) are hidden by
+ *    default — the literal path with `:param` isn't navigable.
+ *  - Otherwise auto-show iff the page has both `icon` and `label`.
+ */
+function shouldShowTab(page: PageFragment): boolean {
+  if (page.nav === false) return false;
+  if (page.path.includes("/:")) return false;
+  return Boolean(page.icon && page.label);
+}
+
 export function PageSubNavShell({ children, tabs }: { children: ReactNode; tabs: readonly PageFragment[] }) {
   const navigate = useArcNavigate();
   const route = useArcRoute();
 
-  const subNavTabs = tabs.map((t) => ({
+  const subNavTabs = tabs.filter(shouldShowTab).map((t) => ({
     path: t.path,
     icon: t.icon,
     label: t.label,

package/src/layout/slot-renderer.tsx

@@ -19,6 +19,7 @@ const slotDisplayModes: Record<string, DisplayMode> = {
   "main-content": "default",
   "sidebar-left": "default",
   "sidebar-right": "default",
+  "preview-pane": "default",
 };
 
 export function SlotRenderer({

package/src/module-loader.ts

@@ -1,17 +1,23 @@
 import { clearModules, getAllRegisteredModules, getContext, setActiveModules } from "./registry";
-import type { ModuleDescriptor } from "./types";
+import type { BuildManifest, ModuleDescriptor } from "./types";
 import { useCallback, useEffect, useRef, useState } from "react";
 
-export interface ModuleManifest {
-  modules: ModuleDescriptor[];
-  buildTime: string;
-}
+/** @deprecated Use BuildManifest from "./types" */
+export type ModuleManifest = BuildManifest;
 
 export type ModuleLoaderState = "loading" | "ready" | "error";
 
+/**
+ * URL for a module's JS file with cache-bust based on its content hash.
+ * When a module's bytes change, hash changes → URL changes → ES module cache invalidated.
+ * For explicit full reloads, pass `bust` (e.g. timestamp) to override.
+ */
 function moduleUrl(baseUrl: string, mod: ModuleDescriptor, bust?: string): string {
   const base = mod.url ?? `${baseUrl}/modules/${mod.file}`;
-  return bust ? `${base}${base.includes("?") ? "&" : "?"}t=${bust}` : base;
+  const busterKey = bust ? "t" : "v";
+  const busterVal = bust ?? mod.hash;
+  if (!busterVal) return base;
+  return `${base}${base.includes("?") ? "&" : "?"}${busterKey}=${busterVal}`;
 }
 
 /** Read all persisted arc tokens from localStorage */
@@ -50,7 +56,7 @@ function buildHeaders(tokens?: Record<string, string>): HeadersInit {
 async function fetchManifest(
   baseUrl: string,
   tokens?: Record<string, string>,
-): Promise<ModuleManifest> {
+): Promise<BuildManifest> {
   const headers = buildHeaders(tokens);
   const res = await fetch(`${baseUrl}/api/modules`, { headers });
   if (!res.ok)
@@ -58,45 +64,54 @@ async function fetchManifest(
   return res.json();
 }
 
+/** Track hashes of modules we've already imported so hot-swaps re-import on change. */
+const importedModuleHashes = new Map<string, string>();
+
 /**
  * Load all modules from manifest. Each module auto-registers via module().build().
  */
 export async function loadModules(
   baseUrl: string,
   tokens?: Record<string, string>,
-): Promise<ModuleManifest> {
+): Promise<BuildManifest> {
   const manifest = await fetchManifest(baseUrl, tokens);
 
   await Promise.all(
-    manifest.modules.map(
-      (mod) => import(/* @vite-ignore */ moduleUrl(baseUrl, mod)),
-    ),
+    manifest.modules.map((mod) => {
+      importedModuleHashes.set(mod.name, mod.hash);
+      return import(/* @vite-ignore */ moduleUrl(baseUrl, mod));
+    }),
   );
 
   return manifest;
 }
 
 /**
- * Sync modules with server — import any NEW modules, then set active filter.
- * Modules are never unregistered (ES module cache prevents re-execution).
- * Instead, visibility is controlled via an active set.
+ * Sync modules with server. Two triggers produce different behaviors:
+ * - new module (name unseen) → dynamic import
+ * - hash changed (hot-swap after arc platform deploy) → dynamic import with new cache-bust
+ * Unchanged modules stay cached. Visibility is controlled via an active set.
  */
 export async function syncModules(
   baseUrl: string,
   tokens?: Record<string, string>,
-): Promise<ModuleManifest> {
+): Promise<BuildManifest> {
   const manifest = await fetchManifest(baseUrl, tokens);
 
   const manifestNames = new Set(manifest.modules.map((m) => m.name));
-  // Check against ALL registered modules (not just active ones)
-  const registeredNames = new Set(getAllRegisteredModules().map((m) => m.name));
 
-  // Import only truly new modules (never imported before)
-  const newModules = manifest.modules.filter((m) => !registeredNames.has(m.name));
+  // A module needs reimporting if it's new OR its hash changed since last import
+  const toImport = manifest.modules.filter((m) => {
+    const prevHash = importedModuleHashes.get(m.name);
+    return prevHash !== m.hash;
+  });
 
-  if (newModules.length > 0) {
+  if (toImport.length > 0) {
     await Promise.all(
-      newModules.map((mod) => import(/* @vite-ignore */ moduleUrl(baseUrl, mod))),
+      toImport.map((mod) => {
+        importedModuleHashes.set(mod.name, mod.hash);
+        return import(/* @vite-ignore */ moduleUrl(baseUrl, mod));
+      }),
     );
   }
 

package/src/types.ts

@@ -102,9 +102,21 @@ export interface ModuleAccess {
 export interface ModuleDescriptor {
   readonly file: string;
   readonly name: string;
+  /** sha256 hex of the bundled .js content — used by deploy diff and client cache-bust. */
+  readonly hash: string;
   readonly url?: string;
 }
 
+/** Build manifest written to .arc/platform/modules/manifest.json. */
+export interface BuildManifest {
+  readonly modules: readonly ModuleDescriptor[];
+  /** sha256 hex over all shell bundle outputs concatenated. */
+  readonly shellHash: string;
+  /** sha256 hex over styles.css (+ theme.css if present). */
+  readonly stylesHash: string;
+  readonly buildTime: string;
+}
+
 // ---------------------------------------------------------------------------
 // Moduł
 // ---------------------------------------------------------------------------