astro-tractstack 2.3.5 → 2.4.0

package/templates/src/stores/analytics.ts

@@ -1,4 +1,4 @@
-import { atom } from 'nanostores';
+import { atom, computed } from 'nanostores';
 import { TractStackAPI } from '@/utils/api';
 
 interface AvailableFilter {
@@ -11,43 +11,38 @@ export interface AppliedFilter {
   value: string;
 }
 
-const tenantEpinetCustomFilters = atom<
-  Record<
+export interface EpinetFiltersState {
+  enabled: boolean;
+  visitorType: 'all' | 'anonymous' | 'known';
+  selectedUserId: string | null;
+  startTimeUTC: string | null;
+  endTimeUTC: string | null;
+  userCounts: Array<{ id: string; count: number; isKnown: boolean }>;
+  hourlyNodeActivity: Record<
     string,
-    {
-      enabled: boolean;
-      visitorType: 'all' | 'anonymous' | 'known';
-      selectedUserId: string | null;
-      startTimeUTC: string | null;
-      endTimeUTC: string | null;
-      userCounts: Array<{ id: string; count: number; isKnown: boolean }>;
-      hourlyNodeActivity: Record<
-        string,
-        Record<
-          string,
-          {
-            events: Record<string, number>;
-            visitorIds: string[];
-          }
-        >
-      >;
-      availableFilters: AvailableFilter[];
-      appliedFilters: AppliedFilter[];
-    }
-  >
->({});
+    Record<
+      string,
+      {
+        events: Record<string, number>;
+        visitorIds: string[];
+      }
+    >
+  >;
+  availableFilters: AvailableFilter[];
+  appliedFilters: AppliedFilter[];
+}
 
-const tenantFullContentMaps = atom<
-  Record<
-    string,
-    {
-      data: any[];
-      lastUpdated: number;
-    }
-  >
->({});
+export interface TenantFullContentMapState {
+  data: any[];
+  lastUpdated: number;
+}
+
+const tenantEpinetCustomFilters = atom<Record<string, EpinetFiltersState>>({});
+
+const tenantFullContentMaps = atom<Record<string, TenantFullContentMapState>>(
+  {}
+);
 
-// Helper to get current tenant ID
 function getCurrentTenantId(): string {
   const resolvedTenantId =
     (typeof window !== 'undefined' && window.TRACTSTACK_CONFIG?.tenantId) ||
@@ -56,9 +51,9 @@ function getCurrentTenantId(): string {
   return resolvedTenantId;
 }
 
-const defaultEpinetFilters = {
+const defaultEpinetFilters: EpinetFiltersState = {
   enabled: false,
-  visitorType: 'all' as 'all' | 'anonymous' | 'known',
+  visitorType: 'all',
   selectedUserId: null,
   startTimeUTC: null,
   endTimeUTC: null,
@@ -68,81 +63,56 @@ const defaultEpinetFilters = {
   appliedFilters: [],
 };
 
-const createEpinetFiltersStore = () => {
-  const store = {
-    get: () => {
-      const tenantId = getCurrentTenantId();
-      return tenantEpinetCustomFilters.get()[tenantId] || defaultEpinetFilters;
-    },
-
-    set: (tenantId: string, updates: any) => {
-      const currentFilters =
-        tenantEpinetCustomFilters.get()[tenantId] || defaultEpinetFilters;
-      tenantEpinetCustomFilters.set({
-        ...tenantEpinetCustomFilters.get(),
-        [tenantId]: {
-          ...currentFilters,
-          ...updates,
-        },
-      });
-    },
-
-    subscribe: (callback: (value: any) => void) => {
-      const tenantId = getCurrentTenantId();
-      return tenantEpinetCustomFilters.subscribe((filters) => {
-        callback(filters[tenantId] || defaultEpinetFilters);
-      });
-    },
-    lc: 0,
-    listen: function (callback: any) {
-      return this.subscribe(callback);
-    },
-    notify: function () {},
-    off: function () {},
-    get value() {
-      return this.get();
-    },
-  };
-
-  return store;
-};
-
-const createFullContentMapStore = () => {
-  const store = {
-    get: () => {
-      const tenantId = getCurrentTenantId();
-      return tenantFullContentMaps.get()[tenantId] || null;
-    },
+export const epinetCustomFilters = computed(
+  tenantEpinetCustomFilters,
+  (filters) => {
+    const tenantId = getCurrentTenantId();
+    return filters[tenantId] || defaultEpinetFilters;
+  }
+);
 
-    set: (tenantId: string, data: { data: any[]; lastUpdated: number }) => {
-      tenantFullContentMaps.set({
-        ...tenantFullContentMaps.get(),
-        [tenantId]: data,
-      });
-    },
+export function getEpinetCustomFilters(): EpinetFiltersState {
+  return epinetCustomFilters.get();
+}
 
-    subscribe: (callback: (value: any) => void) => {
-      const tenantId = getCurrentTenantId();
-      return tenantFullContentMaps.subscribe((maps) => {
-        callback(maps[tenantId] || null);
-      });
-    },
-    lc: 0,
-    listen: function (callback: any) {
-      return this.subscribe(callback);
-    },
-    notify: function () {},
-    off: function () {},
-    get value() {
-      return this.get();
+export function setEpinetCustomFilters(
+  tenantId: string,
+  updates: Partial<EpinetFiltersState>
+): void {
+  const currentFilters =
+    tenantEpinetCustomFilters.get()[tenantId] || defaultEpinetFilters;
+  tenantEpinetCustomFilters.set({
+    ...tenantEpinetCustomFilters.get(),
+    [tenantId]: {
+      ...currentFilters,
+      ...updates,
     },
-  };
+  });
+}
 
-  return store;
-};
+export const fullContentMapStore = computed(tenantFullContentMaps, (maps) => {
+  const tenantId = getCurrentTenantId();
+  return maps[tenantId] || null;
+});
+
+export function setTenantFullContentMap(
+  tenantId: string,
+  data: TenantFullContentMapState
+): void {
+  tenantFullContentMaps.set({
+    ...tenantFullContentMaps.get(),
+    [tenantId]: data,
+  });
+}
 
-export const epinetCustomFilters = createEpinetFiltersStore();
-export const fullContentMapStore = createFullContentMapStore();
+// Synchronous in-process accessor for the warm content-map atom, keyed on an
+// explicit tenantId (unlike fullContentMapStore.get(), which keys on
+// getCurrentTenantId() and resolves the wrong tenant during SSR sub-requests).
+// Returns [] on a cold miss; codehook blades fall back to the async
+// getFullContentMap(tenantId) when this is empty.
+export function getCachedFullContentMap(tenantId: string): any[] {
+  return tenantFullContentMaps.get()[tenantId]?.data ?? [];
+}
 
 export async function getFullContentMap(tenantId: string): Promise<any[]> {
   const api = new TractStackAPI(tenantId);

package/utils/inject-files.ts

@@ -1518,18 +1518,6 @@ export async function injectTemplateFiles(
       ),
       dest: 'src/components/codehooks/ListContentSetup.tsx',
     },
-    {
-      src: resolve(
-        '../templates/src/components/codehooks/ProductCardSetup.tsx'
-      ),
-      dest: 'src/components/codehooks/ProductCardSetup.tsx',
-    },
-    {
-      src: resolve(
-        '../templates/src/components/codehooks/ProductGridSetup.tsx'
-      ),
-      dest: 'src/components/codehooks/ProductGridSetup.tsx',
-    },
     {
       src: resolve(
         '../templates/src/components/codehooks/BunnyVideoWrapper.astro'
@@ -1541,6 +1529,32 @@ export async function injectTemplateFiles(
       dest: 'src/components/codehooks/BunnyVideoSetup.tsx',
     },
 
+    // CodeHook Blades (partial routes; core hooks overwritable)
+    {
+      src: resolve('../templates/src/pages/codehooks/featured-article.astro'),
+      dest: 'src/pages/codehooks/featured-article.astro',
+    },
+    {
+      src: resolve('../templates/src/pages/codehooks/list-content.astro'),
+      dest: 'src/pages/codehooks/list-content.astro',
+    },
+    {
+      src: resolve('../templates/src/pages/codehooks/search-widget.astro'),
+      dest: 'src/pages/codehooks/search-widget.astro',
+    },
+    {
+      src: resolve('../templates/src/pages/codehooks/bunny-video.astro'),
+      dest: 'src/pages/codehooks/bunny-video.astro',
+    },
+    {
+      src: resolve('../templates/src/pages/codehooks/epinet.astro'),
+      dest: 'src/pages/codehooks/epinet.astro',
+    },
+    {
+      src: resolve('../templates/src/pages/codehooks/[...hookId].astro'),
+      dest: 'src/pages/codehooks/[...hookId].astro',
+    },
+
     // Widget Components
     {
       src: resolve('../templates/src/components/widgets/Impression.tsx'),
@@ -1568,6 +1582,10 @@ export async function injectTemplateFiles(
       src: resolve('../templates/src/lib/resources.ts'),
       dest: 'src/lib/resources.ts',
     },
+    {
+      src: resolve('../templates/src/lib/codeHookHelper.ts'),
+      dest: 'src/lib/codeHookHelper.ts',
+    },
 
     // Client Scripts
     {
@@ -2357,15 +2375,6 @@ export async function injectTemplateFiles(
     },
 
     // Custom Components (Conditional)
-    {
-      src: resolve(
-        config?.includeExamples
-          ? '../templates/custom/with-examples/CodeHook.astro'
-          : '../templates/custom/minimal/CodeHook.astro'
-      ),
-      dest: 'src/custom/CodeHook.astro',
-      protected: true,
-    },
     {
       src: resolve(
         config?.includeExamples
@@ -2376,11 +2385,7 @@ export async function injectTemplateFiles(
       protected: true,
     },
     {
-      src: resolve(
-        config?.includeExamples
-          ? '../templates/custom/with-examples/HeaderWidget.astro'
-          : '../templates/custom/minimal/HeaderWidget.astro'
-      ),
+      src: resolve('../templates/custom/minimal/HeaderWidget.astro'),
       dest: 'src/custom/HeaderWidget.astro',
       protected: true,
     },
@@ -2450,6 +2455,33 @@ export async function injectTemplateFiles(
       protected: true,
     },
 
+    // CodeHook manifest (frontend capability list; hand-maintained, protected)
+    {
+      src: resolve(
+        config?.includeExamples
+          ? '../templates/custom/with-examples/codehooks.ts'
+          : '../templates/custom/minimal/codehooks.ts'
+      ),
+      dest: 'src/custom/codehooks.ts',
+      protected: true,
+    },
+
+    // CodeHook Blades (userland hooks; protected once installed)
+    {
+      src: resolve(
+        '../templates/src/pages/codehooks/shopify-product-grid.astro'
+      ),
+      dest: 'src/pages/codehooks/shopify-product-grid.astro',
+      protected: true,
+    },
+    {
+      src: resolve(
+        '../templates/src/pages/codehooks/shopify-service-list.astro'
+      ),
+      dest: 'src/pages/codehooks/shopify-service-list.astro',
+      protected: true,
+    },
+
     // Example Components (Conditional)
     ...(config?.includeExamples
       ? [
@@ -2466,20 +2498,13 @@ export async function injectTemplateFiles(
             protected: true,
           },
           {
-            src: resolve('../templates/custom/with-examples/ProductGrid.astro'),
-            dest: 'src/custom/ProductGrid.astro',
-            protected: true,
-          },
-          {
-            src: resolve(
-              '../templates/custom/with-examples/ProductCardWrapper.astro'
-            ),
-            dest: 'src/custom/ProductCardWrapper.astro',
+            src: resolve('../templates/src/pages/codehooks/custom-hero.astro'),
+            dest: 'src/pages/codehooks/custom-hero.astro',
             protected: true,
           },
           {
-            src: resolve('../templates/custom/with-examples/ProductCard.astro'),
-            dest: 'src/custom/ProductCard.astro',
+            src: resolve('../templates/src/pages/codehooks/get-crafting.astro'),
+            dest: 'src/pages/codehooks/get-crafting.astro',
             protected: true,
           },
           {

package/templates/custom/minimal/CodeHook.astro

@@ -1,72 +0,0 @@
----
-import FeaturedArticle from '@/components/codehooks/FeaturedArticle.astro';
-import ListContent from '@/components/codehooks/ListContent.astro';
-import SearchWidget from '@/components/codehooks/SearchWidget.tsx';
-import BunnyVideoWrapper from '@/components/codehooks/BunnyVideoWrapper.astro';
-import EpinetWrapper from '@/components/codehooks/EpinetWrapper';
-import ShopifyProductGrid from '@/custom/shopify/ShopifyProductGrid';
-import ShopifyServiceList from '@/custom/shopify/ShopifyServiceList';
-import type { FullContentMapItem } from '@/types/tractstack';
-import type { ResourceNode } from '@/types/compositorTypes';
-// import CustomHero from './CustomHero.astro';
-// Uncomment to add custom components
-
-export interface Props {
-  target: string;
-  paneId: string;
-  fullContentMap: FullContentMapItem[];
-  resourcesPayload?: Record<string, ResourceNode[]>;
-  options?: {
-    params?: {
-      options?: string;
-    };
-  };
-}
-
-const { target, options, fullContentMap, resourcesPayload = {} } = Astro.props;
-
-export const components = {
-  'featured-article': true,
-  'featured-content': true,
-  'list-content': true,
-  'search-widget': true,
-  'bunny-video': import.meta.env.PUBLIC_ENABLE_BUNNY === 'true',
-  epinet: true,
-  'shopify-product-grid': true,
-  'shopify-service-list': true,
-  // "custom-hero": true,  // Uncomment when you create CustomHero.astro
-};
----
-
-{
-  target === 'list-content' ? (
-    <ListContent options={options} contentMap={fullContentMap} />
-  ) : target === 'featured-article' ? (
-    <FeaturedArticle options={options} contentMap={fullContentMap} />
-  ) : target === 'search-widget' ? (
-    <SearchWidget fullContentMap={fullContentMap} client:load />
-  ) : target === 'bunny-video' && import.meta.env.PUBLIC_ENABLE_BUNNY ? (
-    <BunnyVideoWrapper options={options} />
-  ) : target === 'epinet' ? (
-    <EpinetWrapper fullContentMap={fullContentMap} client:only="react" />
-  ) : target === 'shopify-product-grid' ? (
-    <ShopifyProductGrid
-      options={options}
-      resources={resourcesPayload}
-      client:only="react"
-    />
-  ) : target === 'shopify-service-list' ? (
-    <ShopifyServiceList
-      options={options}
-      resources={resourcesPayload}
-      client:only="react"
-    />
-  ) : (
-    /* : target === "custom-hero" ? (
-    <CustomHero />
-  ) */
-    <div class="rounded-lg bg-gray-50 p-8 text-center">
-      <p class="text-gray-600">CodeHook target "{target}" not found</p>
-    </div>
-  )
-}

package/templates/custom/with-examples/CodeHook.astro

@@ -1,81 +0,0 @@
----
-import CustomHero from './CustomHero.astro';
-import SearchWidget from '@/components/codehooks/SearchWidget.tsx';
-import FeaturedArticle from '@/components/codehooks/FeaturedArticle.astro';
-import ListContent from '@/components/codehooks/ListContent.astro';
-import BunnyVideoWrapper from '@/components/codehooks/BunnyVideoWrapper.astro';
-import EpinetWrapper from '@/components/codehooks/EpinetWrapper';
-import ProductCardWrapper from './ProductCardWrapper.astro';
-import ProductGrid from './ProductGrid.astro';
-import SandboxLauncher from './SandboxLauncher';
-import ShopifyProductGrid from '@/custom/shopify/ShopifyProductGrid';
-import ShopifyServiceList from '@/custom/shopify/ShopifyServiceList';
-import type { FullContentMapItem } from '@/types/tractstack';
-import type { ResourceNode } from '@/types/compositorTypes';
-
-export interface Props {
-  target: string;
-  paneId: string;
-  fullContentMap: FullContentMapItem[];
-  resourcesPayload?: Record<string, ResourceNode[]>;
-  options?: {
-    params?: {
-      options?: string;
-    };
-  };
-}
-
-const { target, options, fullContentMap, resourcesPayload = {} } = Astro.props;
-
-export const components = {
-  'custom-hero': true,
-  'featured-article': true,
-  'list-content': true,
-  'search-widget': true,
-  'product-card': true,
-  'product-grid': true,
-  'get-crafting': true,
-  'bunny-video': import.meta.env.PUBLIC_ENABLE_BUNNY === 'true',
-  epinet: true,
-  'shopify-product-grid': true,
-  'shopify-service-list': true,
-};
----
-
-{
-  target === 'product-card' ? (
-    <ProductCardWrapper options={options} resourcesPayload={resourcesPayload} />
-  ) : target === 'product-grid' ? (
-    <ProductGrid options={options} resourcesPayload={resourcesPayload} />
-  ) : target === 'list-content' ? (
-    <ListContent options={options} contentMap={fullContentMap} />
-  ) : target === 'featured-article' ? (
-    <FeaturedArticle options={options} contentMap={fullContentMap} />
-  ) : target === 'search-widget' ? (
-    <SearchWidget fullContentMap={fullContentMap} client:load />
-  ) : target === 'bunny-video' && import.meta.env.PUBLIC_ENABLE_BUNNY ? (
-    <BunnyVideoWrapper options={options} />
-  ) : target === 'get-crafting' ? (
-    <SandboxLauncher client:only="react" />
-  ) : target === 'custom-hero' ? (
-    <CustomHero />
-  ) : target === 'epinet' ? (
-    <EpinetWrapper fullContentMap={fullContentMap} client:only="react" />
-  ) : target === 'shopify-product-grid' ? (
-    <ShopifyProductGrid
-      options={options}
-      resources={resourcesPayload}
-      client:only="react"
-    />
-  ) : target === 'shopify-service-list' ? (
-    <ShopifyServiceList
-      options={options}
-      resources={resourcesPayload}
-      client:only="react"
-    />
-  ) : (
-    <div class="rounded-lg bg-gray-50 p-8 text-center">
-      <p class="text-gray-600">CodeHook target "{target}" not found</p>
-    </div>
-  )
-}

package/templates/custom/with-examples/ProductCard.astro

@@ -1,29 +0,0 @@
----
-import type { ResourceNode } from '@/types/compositorTypes';
-
-export interface Props {
-  product?: ResourceNode;
-}
-
-const { product } = Astro.props;
----
-
-<div class="rounded-lg border bg-white p-6 shadow-sm">
-  <h2 class="mb-4 text-xl font-bold text-gray-900">
-    Product Card (Parameter Dump)
-  </h2>
-
-  {
-    product ? (
-      <pre class="whitespace-pre-wrap rounded-md bg-gray-50 p-4 text-xs text-gray-700">
-        {JSON.stringify(product, null, 2)}
-      </pre>
-    ) : (
-      <div class="rounded-md bg-red-50 p-4 text-center">
-        <p class="font-bold text-red-800">
-          Error: ProductCard component received no product data.
-        </p>
-      </div>
-    )
-  }
-</div>

package/templates/custom/with-examples/ProductCardWrapper.astro

@@ -1,43 +0,0 @@
----
-import type { ResourceNode } from '@/types/compositorTypes';
-import ProductCard from './ProductCard.astro';
-
-export interface Props {
-  options?: {
-    params?: {
-      options?: string;
-    };
-  };
-  resourcesPayload?: Record<string, ResourceNode[]>;
-}
-
-const { options, resourcesPayload } = Astro.props;
-
-let product: ResourceNode | undefined = undefined;
-let parsedOptions: { slug?: string } = {};
-
-if (options?.params?.options && typeof options.params.options === 'string') {
-  try {
-    parsedOptions = JSON.parse(options.params.options);
-  } catch (e) {
-    console.error('Failed to parse ProductCard options JSON:', e);
-  }
-}
-
-const targetSlug = parsedOptions?.slug;
-
-if (targetSlug && resourcesPayload) {
-  for (const key in resourcesPayload) {
-    const resourceArray = resourcesPayload[key] as ResourceNode[];
-    const found = resourceArray.find(
-      (resource) => resource.slug === targetSlug
-    );
-    if (found) {
-      product = found;
-      break;
-    }
-  }
-}
----
-
-<ProductCard product={product} />

package/templates/custom/with-examples/ProductGrid.astro

@@ -1,64 +0,0 @@
----
-import type { ResourceNode } from '@/types/compositorTypes';
-import ProductCard from './ProductCard.astro';
-
-export interface Props {
-  options?: {
-    params?: {
-      options?: string;
-    };
-  };
-  resourcesPayload?: Record<string, ResourceNode[]>;
-}
-
-const { options, resourcesPayload } = Astro.props;
-
-let productsToDisplay: ResourceNode[] = [];
-let allFetchedProducts: ResourceNode[] = [];
-let parsedOptions: { productType?: string; category?: string; slugs?: string } =
-  {};
-
-if (options?.params?.options && typeof options.params.options === 'string') {
-  try {
-    parsedOptions = JSON.parse(options.params.options);
-  } catch (e) {
-    console.error('Failed to parse ProductGrid options JSON:', e);
-  }
-}
-
-if (resourcesPayload) {
-  for (const key in resourcesPayload) {
-    allFetchedProducts = resourcesPayload[key] as ResourceNode[];
-    break;
-  }
-}
-
-if (parsedOptions?.productType) {
-  productsToDisplay = allFetchedProducts.filter(
-    (product) =>
-      product.optionsPayload?.productType === parsedOptions.productType
-  );
-} else {
-  productsToDisplay = allFetchedProducts;
-}
----
-
-<div class="space-y-6">
-  {
-    productsToDisplay.length > 0 ? (
-      <div class="grid grid-cols-1 gap-6 md:grid-cols-2 xl:grid-cols-3">
-        {productsToDisplay.map((product) => (
-          <ProductCard product={product} />
-        ))}
-      </div>
-    ) : (
-      <div class="rounded-lg border bg-yellow-50 p-6 text-center shadow-sm">
-        <p class="font-bold text-yellow-800">No products to display.</p>
-        <p class="mt-1 text-sm text-yellow-700">
-          Check the grid configuration or ensure products match the specified
-          filters.
-        </p>
-      </div>
-    )
-  }
-</div>