astro-tractstack 2.0.0-rc.8 → 2.0.0

package/templates/src/stores/nodes.ts

@@ -340,6 +340,18 @@ export class NodesContext {
         handleClickEventDefault(node, dblClick, this.clickedParentLayer.get());
         break;
       case `text`:
+        if (
+          node.nodeType === 'TagElement' &&
+          'tagName' in node &&
+          (node.tagName === 'a' || node.tagName === 'button')
+        ) {
+          this.toolModeValStore.set({ value: 'styles' });
+          handleClickEventDefault(
+            node,
+            dblClick,
+            this.clickedParentLayer.get()
+          );
+        }
         if (dblClick && ![`Markdown`].includes(node.nodeType)) {
           this.toolModeValStore.set({ value: 'styles' });
           handleClickEventDefault(
@@ -544,7 +556,6 @@ export class NodesContext {
       tagNames.length > offset
         ? allowInsert(node, node.tagName as Tag, tagName, tagNames[offset + 1])
         : allowInsert(node, node.tagName as Tag, tagName);
-
     return { allowInsertBefore, allowInsertAfter };
   }
 
@@ -1063,56 +1074,6 @@ export class NodesContext {
     return '';
   }
 
-  //addPaneToStoryFragment(
-  //  nodeId: string,
-  //  pane: PaneNode,
-  //  location: 'before' | 'after'
-  ///) {
-  //  const node = this.allNodes.get().get(nodeId) as BaseNode;
-  //  if (
-  //    !node ||
-  //    (node.nodeType !== 'StoryFragment' && node.nodeType !== 'Pane')
-  //  ) {
-  //    return;
-  //  }
-
-  //  pane.id = ulid();
-  //  this.addNode(pane);
-
-  //  if (node.nodeType === 'Pane') {
-  //    const storyFragmentId = this.getClosestNodeTypeFromId(
-  //      nodeId,
-  //      'StoryFragment'
-  //    );
-  //    const storyFragment = this.allNodes
-  //      .get()
-  //      .get(storyFragmentId) as StoryFragmentNode;
-  //    if (storyFragment) {
-  //      pane.parentId = storyFragmentId;
-  //      const originalPaneIndex = storyFragment.paneIds.indexOf(pane.parentId);
-  //      let insertIdx = -1;
-  //      if (location === 'before')
-  //        insertIdx = Math.max(0, originalPaneIndex - 1);
-  //      else
-  //        insertIdx = Math.min(
-  //          storyFragment.paneIds.length - 1,
-  //          originalPaneIndex + 1
-  //        );
-  //      storyFragment.paneIds.splice(insertIdx, 0, pane.id);
-  //    }
-  //  } else if (node.nodeType !== 'StoryFragment') {
-  //    const storyFragment = node as StoryFragmentNode;
-  //    if (storyFragment) {
-  //      pane.parentId = node.id;
-  //      if (location === 'after') {
-  //        storyFragment.paneIds.push(pane.id);
-  //      } else {
-  //        storyFragment.paneIds.unshift(pane.id);
-  //      }
-  //    }
-  //  }
-  //}
-
   addContextTemplatePane(ownerId: string, pane: TemplatePane) {
     const ownerNode = this.allNodes.get().get(ownerId);
     if (ownerNode?.nodeType === 'Pane') {
@@ -2178,9 +2139,10 @@ export class NodesContext {
   getAllBunnyVideoInfo(): { url: string; title: string; videoId: string }[] {
     const results: { url: string; title: string; videoId: string }[] = [];
     const processedVideoIds = new Set<string>();
-
-    // Find panes with bunny-video code hook
     const allNodes = Array.from(this.allNodes.get().values());
+    const BUNNY_EMBED_BASE_URL = 'https://iframe.mediadelivery.net/embed/';
+
+    // Process pane-level bunny videos (which use full URLs)
     const paneNodes = allNodes.filter(
       (node) =>
         node.nodeType === 'Pane' &&
@@ -2188,7 +2150,6 @@ export class NodesContext {
         node.codeHookTarget === 'bunny-video'
     ) as PaneNode[];
 
-    // Process pane-level bunny videos
     for (const paneNode of paneNodes) {
       try {
         if (
@@ -2231,7 +2192,7 @@ export class NodesContext {
       }
     }
 
-    // Find inline bunny widgets
+    // Process inline bunny widgets (which use ID/GUID fragments)
     const codeNodes = allNodes.filter(
       (node) =>
         node.nodeType === 'TagElement' &&
@@ -2243,47 +2204,26 @@ export class NodesContext {
         node.copy.includes('bunny(')
     ) as FlatNode[];
 
-    // Process inline widgets
     for (const codeNode of codeNodes) {
       if (
         Array.isArray(codeNode.codeHookParams) &&
-        codeNode.codeHookParams.length >= 2
+        codeNode.codeHookParams.length > 0
       ) {
-        const urlParam = codeNode.codeHookParams[0];
-        const titleParam = codeNode.codeHookParams[1];
-
-        const url = Array.isArray(urlParam)
-          ? urlParam[0]
-          : String(urlParam || '');
-        const title = Array.isArray(titleParam)
-          ? titleParam[0]
-          : String(titleParam || 'Untitled Video');
-
-        if (url) {
-          let videoId = '';
-          try {
-            const urlObj = new URL(url);
-            if (
-              urlObj.hostname === 'iframe.mediadelivery.net' &&
-              urlObj.pathname.startsWith('/embed/')
-            ) {
-              const pathParts = urlObj.pathname.split('/');
-              if (pathParts.length >= 4) {
-                videoId = `${pathParts[2]}/${pathParts[3]}`;
-              }
-            }
-          } catch (error) {
-            console.error('Error extracting video ID from URL:', error);
-          }
-
-          if (videoId && !processedVideoIds.has(videoId)) {
-            results.push({ url, title, videoId });
+        const videoId = String(codeNode.codeHookParams[0] || '');
+        const title = String(codeNode.codeHookParams[1] || 'Untitled Video');
+
+        if (videoId && /^\d+\/[a-f0-9\-]{36}$/.test(videoId)) {
+          if (!processedVideoIds.has(videoId)) {
+            results.push({
+              url: `${BUNNY_EMBED_BASE_URL}${videoId}`,
+              title,
+              videoId,
+            });
             processedVideoIds.add(videoId);
           }
         }
       }
     }
-
     return results;
   }
 
@@ -2316,10 +2256,41 @@ export class NodesContext {
 
   getDirtyNodesClassData(): { dirtyPaneIds: string[]; classes: string[] } {
     const dirtyNodes = this.getDirtyNodes();
+
     const dirtyPaneIds = dirtyNodes
       .filter((node) => node.nodeType === 'Pane')
       .map((node) => node.id);
-    const classes = extractClassesFromNodes(dirtyNodes);
+
+    // Collect all nodes that need class extraction
+    const allNodesToExtract: BaseNode[] = [];
+
+    // Find root dirty nodes (dirty nodes whose parents are NOT dirty)
+    const dirtyNodeIds = new Set(dirtyNodes.map((n) => n.id));
+    const rootDirtyNodes = dirtyNodes.filter(
+      (node) => !node.parentId || !dirtyNodeIds.has(node.parentId)
+    );
+
+    // For each root dirty node, traverse all descendants
+    rootDirtyNodes.forEach((rootNode) => {
+      // Add the root node itself
+      allNodesToExtract.push(rootNode);
+
+      // Traverse all descendants using breadth-first
+      const queue = [...this.getChildNodeIDs(rootNode.id)];
+      while (queue.length > 0) {
+        const currentId = queue.shift();
+        if (!currentId) continue;
+
+        const currentNode = this.allNodes.get().get(currentId);
+        if (currentNode) {
+          allNodesToExtract.push(currentNode);
+          const childrenIds = this.getChildNodeIDs(currentId);
+          queue.push(...childrenIds);
+        }
+      }
+    });
+
+    const classes = extractClassesFromNodes(allNodesToExtract);
 
     return { dirtyPaneIds, classes };
   }

package/templates/src/stores/orphanAnalysis.ts

@@ -161,11 +161,10 @@ const pollingState = new Map<
   }
 >();
 
-// Constants for polling configuration
-const MAX_POLLING_ATTEMPTS = 10;
-const MAX_POLLING_DURATION = 5 * 60 * 1000; // 5 minutes in milliseconds
-const BASE_POLLING_INTERVAL = 2000; // 2 seconds base interval
-const MAX_POLLING_INTERVAL = 32000; // 32 seconds max interval
+const MAX_POLLING_ATTEMPTS = 25;
+const MAX_POLLING_DURATION = 10 * 60 * 1000; // 10 minutes
+const BASE_POLLING_INTERVAL = 10000; // 10 seconds
+const MAX_POLLING_INTERVAL = 30000; // 30 seconds
 
 const fetchingStates = new Map<string, boolean>();
 
@@ -203,7 +202,7 @@ export async function loadOrphanAnalysis(): Promise<void> {
 
     updateTenantState(tenantId, {
       data,
-      isLoading: false,
+      isLoading: data.status === 'loading', // Only stop loading if complete
       error: null,
       lastFetched: Date.now(),
     });
@@ -239,7 +238,7 @@ function startPolling(tenantId: string): void {
     lastAttemptTime: startTime,
   });
 
-  // Start the first poll immediately
+  // Start the first poll
   scheduleNextPoll(tenantId);
 }
 
@@ -260,21 +259,21 @@ function scheduleNextPoll(tenantId: string): void {
   const elapsed = Date.now() - state.startTime;
   if (elapsed >= MAX_POLLING_DURATION) {
     console.warn(
-      `Orphan analysis polling stopped: Maximum duration (${MAX_POLLING_DURATION}ms) exceeded for tenant ${tenantId}`
+      `Orphan analysis polling stopped: Maximum duration (${
+        MAX_POLLING_DURATION / 1000
+      }s) exceeded for tenant ${tenantId}`
     );
     handlePollingFailure(tenantId, 'Polling timeout exceeded');
     return;
   }
 
-  // Calculate delay using exponential backoff for consecutive errors
-  let delay = BASE_POLLING_INTERVAL;
-  if (state.consecutiveErrors > 0) {
-    // Exponential backoff: 2s → 4s → 8s → 16s → 32s (capped)
-    delay = Math.min(
-      BASE_POLLING_INTERVAL * Math.pow(2, state.consecutiveErrors),
-      MAX_POLLING_INTERVAL
-    );
-  }
+  // This is more suitable for long-running jobs, as it spaces out requests
+  // even when the server responds successfully with a 'loading' status.
+  // Polling sequence: 10s → 20s → 30s → 30s...
+  const delay = Math.min(
+    BASE_POLLING_INTERVAL * Math.pow(2, state.attempts),
+    MAX_POLLING_INTERVAL
+  );
 
   // Schedule the next poll
   const timeoutId = setTimeout(() => executePoll(tenantId), delay);
@@ -304,6 +303,7 @@ async function executePoll(tenantId: string): Promise<void> {
 
     // Check if analysis is complete
     if (data.status === 'complete') {
+      updateTenantState(tenantId, { isLoading: false });
       stopPolling(tenantId);
       return;
     }
@@ -329,7 +329,6 @@ async function executePoll(tenantId: string): Promise<void> {
       error instanceof Error ? error.message : 'Unknown polling error';
     updateTenantState(tenantId, {
       error: `Polling error (attempt ${state.attempts}/${MAX_POLLING_ATTEMPTS}): ${errorMessage}`,
-      lastFetched: Date.now(),
     });
 
     // Check if we should stop polling due to consecutive errors
@@ -344,7 +343,7 @@ async function executePoll(tenantId: string): Promise<void> {
       return;
     }
 
-    // Schedule next poll with exponential backoff
+    // Schedule next poll (will use exponential backoff due to increased consecutiveErrors)
     scheduleNextPoll(tenantId);
   }
 }
@@ -357,8 +356,7 @@ function handlePollingFailure(tenantId: string, reason: string): void {
   // Update tenant state with final error
   updateTenantState(tenantId, {
     isLoading: false,
-    error: `Orphan analysis polling failed: ${reason}. Please try refreshing the page or contact support if the issue persists.`,
-    lastFetched: Date.now(),
+    error: `Orphan analysis failed: ${reason}. Please try refreshing the page.`,
   });
 
   // Clean up polling state

package/templates/src/stores/storykeep.ts

@@ -1,6 +1,7 @@
 import { atom, map } from 'nanostores';
 import { persistentAtom } from '@nanostores/persistent';
 import { handleSettingsPanelMobile } from '@/utils/layout';
+import { getCtx, ROOT_NODE_NAME } from '@/stores/nodes';
 import type {
   FullContentMapItem,
   Theme,
@@ -28,6 +29,8 @@ export const preferredThemeStore = atom<Theme>('light');
 export const hasAssemblyAIStore = atom<boolean>(false);
 export const codehookMapStore = atom<string[]>([]);
 
+export const pendingHomePageSlugStore = atom<string | null>(null);
+
 // Tool mode types
 export type ToolModeVal =
   | 'styles'
@@ -116,6 +119,10 @@ export const setViewportMode = (mode: ViewportKey) => {
   } else {
     viewportKeyStore.setKey('value', mode);
   }
+
+  // Notify root node to trigger coordinated re-render
+  const ctx = getCtx();
+  ctx.notifyNode(ROOT_NODE_NAME);
 };
 
 export const toggleShowAnalytics = () => {

package/templates/src/types/compositorTypes.ts

@@ -1,5 +1,7 @@
 import type { BrandConfig } from './tractstack';
 
+export type LispToken = string | number | LispToken[];
+
 export type ViewportKey = 'mobile' | 'tablet' | 'desktop' | 'auto';
 export type ViewportAuto = 'mobile' | 'tablet' | 'desktop';
 export type ToolModeVal =
@@ -21,6 +23,7 @@ export const toolAddModes = [
   'yt',
   'bunny',
   'belief',
+  'interactiveDisclosure',
   'identify',
   'toggle',
   //"aside",
@@ -71,6 +74,7 @@ export type SettingsPanelSignal = {
   className?: string;
   minimized?: boolean;
   expanded?: boolean;
+  editLock?: number;
 };
 
 export interface OgImageParams {
@@ -135,6 +139,7 @@ export type Tag =
   | 'signup'
   | 'yt'
   | 'bunny'
+  | 'interactiveDisclosure'
   | 'belief'
   | 'identify'
   | 'toggle'
@@ -156,6 +161,7 @@ export const tagTitles: Record<Tag, string> = {
   signup: 'Email Signup Widget',
   yt: 'YouTube Widget',
   bunny: 'Bunny Video Widget',
+  interactiveDisclosure: 'Interactive Disclosure',
   belief: 'Belief Select Widget',
   toggle: 'Belief Toggle Widget',
   identify: 'Identify As Widget',

package/templates/src/types/tractstack.ts

@@ -443,3 +443,20 @@ export interface BunnyPlayer {
 export interface PlayerJS {
   Player: new (elementId: string) => BunnyPlayer;
 }
+
+export interface DiscoverySuggestion {
+  term: string;
+  type: 'EXACT' | 'TOPIC' | 'TEXT' | 'TITLE';
+}
+
+export interface FTSResult {
+  ID: string;
+  Relevance: number;
+  Term: string;
+}
+
+export interface CategorizedResults {
+  storyFragmentResults: FTSResult[];
+  contextPaneResults: FTSResult[];
+  resourceResults: FTSResult[];
+}

package/templates/src/utils/actions/lispLexer.ts

@@ -1,3 +1,5 @@
+import type { LispToken } from '@/types/compositorTypes';
+
 const DOUBLEQUOTE = [`"`];
 const BRACKETLEFT = `(`;
 const BRACKETRIGHT = `)`;
@@ -5,8 +7,6 @@ const SEMICOLON = `;`;
 const NEWLINE = `\n`;
 const WHITESPACE = [` `, `\n`, `\t`];
 
-type LispToken = string | number | LispToken[];
-
 export function lispLexer(
   payload: string = ``,
   inString: boolean = false

package/templates/src/utils/actions/preParse_Action.ts

@@ -17,6 +17,9 @@ export const preParseAction = (
   //const parameterFour = (parameters && parameters[3]) || null;
 
   switch (command) {
+    case `declare`:
+    case `identifyAs`:
+      return ``;
     case `goto`:
       switch (parameterOne) {
         case `storykeep`:

package/templates/src/utils/api/beliefHelpers.ts

@@ -4,9 +4,6 @@ import type {
   FieldErrors,
 } from '@/types/tractstack';
 
-/**
- * Convert backend BeliefNode to frontend BeliefNodeState
- */
 export function convertToLocalState(beliefNode: BeliefNode): BeliefNodeState {
   return {
     id: beliefNode.id,
@@ -17,9 +14,6 @@ export function convertToLocalState(beliefNode: BeliefNode): BeliefNodeState {
   };
 }
 
-/**
- * Convert frontend BeliefNodeState to backend BeliefNode format
- */
 export function convertToBackendFormat(state: BeliefNodeState): BeliefNode {
   return {
     id: state.id,
@@ -31,47 +25,45 @@ export function convertToBackendFormat(state: BeliefNodeState): BeliefNode {
   };
 }
 
-/**
- * Validate belief node state
- */
 export function validateBeliefNode(state: BeliefNodeState): FieldErrors {
   const errors: FieldErrors = {};
 
-  // Validate title
   if (!state.title?.trim()) {
     errors.title = 'Title is required';
   }
 
-  // Validate slug
   if (!state.slug?.trim()) {
     errors.slug = 'Slug is required';
+  } else {
+    const slugRegex = /^[a-zA-Z]+$/;
+    if (!slugRegex.test(state.slug)) {
+      errors.slug = 'Slug must contain only letters (a-z, A-Z)';
+    }
   }
 
-  // Validate scale
   if (!state.scale?.trim()) {
     errors.scale = 'Scale is required';
   }
 
-  // Validate custom values if scale is custom
   if (state.scale === 'custom') {
     if (!state.customValues || state.customValues.length === 0) {
       errors.customValues =
         'At least one custom value is required for custom scale';
     } else {
-      state.customValues.forEach((value, index) => {
-        if (!value?.trim()) {
-          errors[`customValues.${index}`] = 'Custom value cannot be empty';
+      const valueRegex = /^[a-zA-Z]([a-zA-Z0-9?!]| (?=[a-zA-Z0-9?!]))*$/;
+      for (const value of state.customValues) {
+        if (value.trim() && !valueRegex.test(value)) {
+          errors.customValues =
+            'Values must start with a letter, have no double or trailing spaces, and use valid characters.';
+          break;
         }
-      });
+      }
     }
   }
 
   return errors;
 }
 
-/**
- * State interceptor for form state management
- */
 export function beliefStateIntercept(
   state: BeliefNodeState,
   field: keyof BeliefNodeState,
@@ -88,7 +80,6 @@ export function beliefStateIntercept(
       break;
     case 'scale':
       newState.scale = value || '';
-      // Clear custom values when scale changes away from custom
       if (value !== 'custom') {
         newState.customValues = [];
       }
@@ -103,9 +94,6 @@ export function beliefStateIntercept(
   return newState;
 }
 
-/**
- * Add a new custom value to the state
- */
 export function addCustomValue(
   state: BeliefNodeState,
   value: string
@@ -118,9 +106,6 @@ export function addCustomValue(
   };
 }
 
-/**
- * Remove a custom value from the state
- */
 export function removeCustomValue(
   state: BeliefNodeState,
   index: number
@@ -131,9 +116,6 @@ export function removeCustomValue(
   };
 }
 
-/**
- * Update a specific custom value in the state
- */
 export function updateCustomValue(
   state: BeliefNodeState,
   index: number,
@@ -148,9 +130,6 @@ export function updateCustomValue(
   };
 }
 
-/**
- * Scale options for the belief form
- */
 export const SCALE_OPTIONS = [
   { value: 'likert', label: 'Likert Scale (1-5)' },
   { value: 'agreement', label: 'Agreement (Agree/Disagree)' },
@@ -160,9 +139,6 @@ export const SCALE_OPTIONS = [
   { value: 'custom', label: 'Custom Values' },
 ];
 
-/**
- * Get scale preview data for displaying scale options
- */
 export function getScalePreview(scale: string) {
   const scalePreviewData: {
     [key: string]: Array<{ id: number; name: string; color: string }>;

package/templates/src/utils/api/menuHelpers.ts

@@ -62,9 +62,9 @@ export function validateMenuNode(state: MenuNodeState): FieldErrors {
         errors[`menuLinks.${index}.actionLisp`] = 'Action is required';
       } else {
         // Basic ActionLisp validation
-        if (!link.actionLisp.startsWith('(goto ')) {
+        if (!link.actionLisp.startsWith('(')) {
           errors[`menuLinks.${index}.actionLisp`] =
-            'Action must start with "(goto "';
+            'Action must start with "("';
         }
         if (!link.actionLisp.endsWith('))')) {
           errors[`menuLinks.${index}.actionLisp`] = 'Action must end with "))"';

package/templates/src/utils/api.ts

@@ -1,3 +1,9 @@
+import type {
+  DiscoverySuggestion,
+  FTSResult,
+  CategorizedResults,
+} from '@/types/tractstack';
+
 export interface APIResponse<T = any> {
   success: boolean;
   data?: T;
@@ -73,6 +79,11 @@ export class TractStackAPI {
     const defaultHeaders = {
       'Content-Type': 'application/json',
       'X-Tenant-ID': this.tenantId,
+      ...(typeof window !== 'undefined' &&
+        (window as any).TRACTSTACK_CONFIG?.sessionId && {
+          'X-TractStack-Session-ID': (window as any).TRACTSTACK_CONFIG
+            .sessionId,
+        }),
     };
 
     try {
@@ -133,6 +144,21 @@ export class TractStackAPI {
     });
   }
 
+  async discover(
+    query: string
+  ): Promise<APIResponse<{ suggestions: DiscoverySuggestion[] }>> {
+    return this.get(`/api/v1/search/discover?q=${encodeURIComponent(query)}`);
+  }
+
+  async retrieve(
+    term: string,
+    isTopic: boolean = false
+  ): Promise<APIResponse<CategorizedResults>> {
+    return this.get(
+      `/api/v1/search/retrieve?term=${encodeURIComponent(term)}&topic=${isTopic}`
+    );
+  }
+
   async getContent(slug: string): Promise<APIResponse> {
     return this.get(`/api/v1/content/${slug}`);
   }

package/templates/src/utils/compositor/TemplateNodes.ts

@@ -116,6 +116,13 @@ export const TemplateBeliefNode = {
   codeHookParams: ['BeliefTag', 'likert', 'prompt'],
 } as TemplateNode;
 
+export const TemplateDisclosureNode = {
+  nodeType: 'TagElement',
+  tagName: 'code',
+  copy: 'interactiveDisclosure(BeliefTag)',
+  codeHookParams: ['BeliefTag'],
+} as TemplateNode;
+
 export const TemplateBunnyNode = {
   nodeType: 'TagElement',
   tagName: 'code',

package/templates/src/utils/compositor/allowInsert.ts

@@ -18,6 +18,7 @@ const allowInsert = (
         switch (tagNameNew) {
           case 'bunny':
           case 'yt':
+          case 'interactiveDisclosure':
           case 'belief':
           case 'toggle':
           case 'identify':
@@ -43,14 +44,14 @@ const allowInsert = (
 
               default:
                 console.log(
-                  `1 miss on allowInsert: tagName:${tagName} tagNameNew:${tagNameNew} tagNameAdjacent:${tagNameAdjacent}`
+                  `miss on allowInsert: tagName:${tagName} tagNameNew:${tagNameNew} tagNameAdjacent:${tagNameAdjacent}`
                 );
             }
             break;
 
           default:
             console.log(
-              `2 miss on allowInsert: tagName:${tagName} tagNameNew:${tagNameNew} tagNameAdjacent:${tagNameAdjacent}`
+              `miss on allowInsert: tagName:${tagName} tagNameNew:${tagNameNew} tagNameAdjacent:${tagNameAdjacent}`
             );
         }
       }
@@ -61,6 +62,7 @@ const allowInsert = (
         case 'bunny':
         case 'yt':
         case 'belief':
+        case 'interactiveDisclosure':
         case 'toggle':
         case 'identify':
         case 'signup':
@@ -83,7 +85,7 @@ const allowInsert = (
           return false;
         default:
           console.log(
-            `3 miss on allowInsert: tagName:${tagName} tagNameNew:${tagNameNew} tagNameAdjacent:${tagNameAdjacent}`
+            `miss on allowInsert: tagName:${tagName} tagNameNew:${tagNameNew} tagNameAdjacent:${tagNameAdjacent}`
           );
       }
       break;