astro-tractstack 2.3.5 → 2.4.1

package/templates/custom/shopify/cart-reset.astro

@@ -0,0 +1,19 @@
+---
+import Layout from '@/layouts/Layout.astro';
+import CartReset from '@/custom/shopify/CartReset';
+import { getBrandConfig } from '@/utils/api/brandConfig';
+
+const tenantId =
+  Astro.locals.tenant?.id || import.meta.env.PUBLIC_TENANTID || 'default';
+
+const brandConfig = await getBrandConfig(tenantId);
+if (!brandConfig.HAS_SHOPIFY) {
+  return Astro.redirect('/storykeep');
+}
+---
+
+<Layout title="Reset Cart" slug="cart">
+  <main class="mx-auto max-w-7xl px-4 py-16 md:px-6 xl:px-8">
+    <CartReset client:only="react" />
+  </main>
+</Layout>

package/templates/custom/with-examples/codehooks.ts

@@ -0,0 +1,15 @@
+// Static, hand-maintained per-install manifest of available codehook ids.
+// The backend never sees this; it is a frontend build capability list only.
+// To add/remove a hook, edit this array AND add/remove the matching blade at
+// src/pages/codehooks/{id}.astro. Not regenerated automatically.
+export const availableCodeHookIds: string[] = [
+  'featured-article',
+  'list-content',
+  'search-widget',
+  'bunny-video',
+  'epinet',
+  'shopify-product-grid',
+  'shopify-service-list',
+  'custom-hero',
+  'get-crafting',
+];

package/templates/src/components/Header.astro

@@ -141,7 +141,7 @@ if (hasShopify) {
   <div
     class="flex flex-row flex-nowrap justify-between bg-mywhite px-4 pb-3 pt-4 shadow-inner md:px-8"
   >
-    <h1 class="truncate text-2xl text-mydarkgrey">{title}</h1>
+    <h1 id="page-title" class="truncate text-2xl text-mydarkgrey">{title}</h1>
     <div class="flex flex-row flex-nowrap items-center gap-x-2">
       {
         !isHome ? (

package/templates/src/components/codehooks/EpinetDurationSelector.tsx

@@ -11,7 +11,10 @@ import XMarkIcon from '@heroicons/react/24/outline/XMarkIcon';
 import CheckCircleIcon from '@heroicons/react/24/outline/CheckCircleIcon';
 import ChevronLeftIcon from '@heroicons/react/24/outline/ChevronLeftIcon';
 import ChevronRightIcon from '@heroicons/react/24/outline/ChevronRightIcon';
-import { epinetCustomFilters } from '@/stores/analytics';
+import {
+  epinetCustomFilters,
+  setEpinetCustomFilters,
+} from '@/stores/analytics';
 import EpinetTableView from './EpinetTableView';
 import { MAX_ANALYTICS_HOURS } from '@/constants';
 import type { AppliedFilter } from '@/stores/analytics';
@@ -220,7 +223,7 @@ const EpinetDurationSelector = ({
     }
     setIsApplying(true);
     try {
-      epinetCustomFilters.set(window.TRACTSTACK_CONFIG?.tenantId || 'default', {
+      setEpinetCustomFilters(window.TRACTSTACK_CONFIG?.tenantId || 'default', {
         ...$epinetCustomFilters,
         visitorType: localFilters.visitorType,
         selectedUserId: localFilters.selectedUserId,
@@ -794,10 +797,16 @@ const EpinetDurationSelector = ({
                           collection={createListCollection({
                             items: [
                               { value: '', label: 'Select user' },
-                              ...paginatedUserCounts.map((user) => ({
-                                value: user.id,
-                                label: `${user.id} (${user.count} events)`,
-                              })),
+                              ...paginatedUserCounts.map(
+                                (user: {
+                                  id: string;
+                                  count: number;
+                                  isKnown: boolean;
+                                }) => ({
+                                  value: user.id,
+                                  label: `${user.id} (${user.count} events)`,
+                                })
+                              ),
                             ],
                           })}
                           value={
@@ -844,23 +853,29 @@ const EpinetDurationSelector = ({
                                         Select user
                                       </Select.ItemText>
                                     </Select.Item>,
-                                    ...paginatedUserCounts.map((user) => (
-                                      <Select.Item
-                                        key={user.id}
-                                        item={{
-                                          value: user.id,
-                                          label: `${user.id} (${user.count} events)`,
-                                        }}
-                                        className="epinet-user-select-item cursor-pointer select-none p-2 text-sm text-gray-700 hover:bg-slate-100"
-                                      >
-                                        <Select.ItemText>
-                                          {user.id}{' '}
-                                          <span className="text-xs text-gray-500">
-                                            ({user.count} events)
-                                          </span>
-                                        </Select.ItemText>
-                                      </Select.Item>
-                                    )),
+                                    ...paginatedUserCounts.map(
+                                      (user: {
+                                        id: string;
+                                        count: number;
+                                        isKnown: boolean;
+                                      }) => (
+                                        <Select.Item
+                                          key={user.id}
+                                          item={{
+                                            value: user.id,
+                                            label: `${user.id} (${user.count} events)`,
+                                          }}
+                                          className="epinet-user-select-item cursor-pointer select-none p-2 text-sm text-gray-700 hover:bg-slate-100"
+                                        >
+                                          <Select.ItemText>
+                                            {user.id}{' '}
+                                            <span className="text-xs text-gray-500">
+                                              ({user.count} events)
+                                            </span>
+                                          </Select.ItemText>
+                                        </Select.Item>
+                                      )
+                                    ),
                                   ]
                                 ) : (
                                   <div className="p-2 text-sm text-gray-500">

package/templates/src/components/codehooks/EpinetTableView.tsx

@@ -1,7 +1,10 @@
 import { useState, useEffect } from 'react';
 import { useStore } from '@nanostores/react';
 import { classNames } from '@/utils/helpers';
-import { epinetCustomFilters } from '@/stores/analytics';
+import {
+  epinetCustomFilters,
+  setEpinetCustomFilters,
+} from '@/stores/analytics';
 import { Accordion } from '@ark-ui/react';
 import ChevronLeftIcon from '@heroicons/react/24/outline/ChevronLeftIcon';
 import ChevronRightIcon from '@heroicons/react/24/outline/ChevronRightIcon';
@@ -176,7 +179,7 @@ const EpinetTableView = ({
       const endTimeUTC = new Date(
         Date.UTC(year, month - 1, day, hour, 59, 59, 999)
       );
-      epinetCustomFilters.set(window.TRACTSTACK_CONFIG?.tenantId || 'default', {
+      setEpinetCustomFilters(window.TRACTSTACK_CONFIG?.tenantId || 'default', {
         ...$epinetCustomFilters,
         startTimeUTC: startTimeUTC.toISOString(),
         endTimeUTC: endTimeUTC.toISOString(),

package/templates/src/components/codehooks/EpinetWrapper.tsx

@@ -6,7 +6,12 @@ import {
   type ReactNode,
 } from 'react';
 import { useStore } from '@nanostores/react';
-import { epinetCustomFilters, type AppliedFilter } from '@/stores/analytics';
+import {
+  epinetCustomFilters,
+  getEpinetCustomFilters,
+  setEpinetCustomFilters,
+  type AppliedFilter,
+} from '@/stores/analytics';
 import { TractStackAPI } from '@/utils/api';
 import SankeyDiagram from './SankeyDiagram';
 import EpinetDurationSelector from './EpinetDurationSelector';
@@ -97,7 +102,7 @@ const EpinetWrapper = ({
   useEffect(() => {
     const nowUTC = new Date();
     const oneWeekAgoUTC = new Date(nowUTC.getTime() - 7 * 24 * 60 * 60 * 1000);
-    epinetCustomFilters.set(window.TRACTSTACK_CONFIG?.tenantId || 'default', {
+    setEpinetCustomFilters(window.TRACTSTACK_CONFIG?.tenantId || 'default', {
       enabled: true,
       visitorType: 'all',
       selectedUserId: null,
@@ -133,7 +138,7 @@ const EpinetWrapper = ({
 
   const handleBeliefFilterChange = (beliefSlug: string, value: string) => {
     const tenantId = window.TRACTSTACK_CONFIG?.tenantId || 'default';
-    const currentFilters = epinetCustomFilters.get();
+    const currentFilters = getEpinetCustomFilters();
     let newFilters: AppliedFilter[] = [
       ...(currentFilters.appliedFilters || []),
     ];
@@ -151,7 +156,7 @@ const EpinetWrapper = ({
       }
     }
 
-    epinetCustomFilters.set(tenantId, {
+    setEpinetCustomFilters(tenantId, {
       ...currentFilters,
       appliedFilters: newFilters,
     });
@@ -229,7 +234,7 @@ const EpinetWrapper = ({
           error: null,
           isLoading: false,
         });
-        epinetCustomFilters.set(
+        setEpinetCustomFilters(
           window.TRACTSTACK_CONFIG?.tenantId || 'default',
           {
             ...$epinetCustomFilters,

package/templates/src/components/codehooks/FeaturedArticle.astro

@@ -7,10 +7,10 @@ export interface Props {
       options?: string;
     };
   };
-  contentMap: FullContentMapItem[];
+  fullContentMap: FullContentMapItem[];
 }
 
-const { options, contentMap } = Astro.props;
+const { options, fullContentMap } = Astro.props;
 
 let parsedOptions;
 try {
@@ -22,7 +22,7 @@ try {
 
 const slug = parsedOptions.slug || '';
 
-const featuredStory = contentMap.find(
+const featuredStory = fullContentMap.find(
   (item: FullContentMapItem) =>
     item.slug === slug &&
     item.type === 'StoryFragment' &&

package/templates/src/components/codehooks/ListContent.astro

@@ -7,10 +7,10 @@ export interface Props {
       options?: string;
     };
   };
-  contentMap: FullContentMapItem[];
+  fullContentMap: FullContentMapItem[];
 }
 
-const { options, contentMap } = Astro.props;
+const { options, fullContentMap } = Astro.props;
 
 // Parse component options
 let parsedOptions;
@@ -36,7 +36,7 @@ const title = parsedOptions.title;
 const bgColor = parsedOptions.bgColor || '';
 
 // Filter for valid stories to display
-const validPages = contentMap.filter(
+const validPages = fullContentMap.filter(
   (item: FullContentMapItem): boolean =>
     item.type === 'StoryFragment' &&
     typeof item.description === 'string' &&

package/templates/src/components/compositor/Node.tsx

@@ -149,6 +149,7 @@ export const Node = memo((props: NodeProps) => {
                   first={true}
                   ctx={ctx}
                   isContextPane={true}
+                  isSandboxMode={props.isSandboxMode || false}
                 />
               </>
             );
@@ -201,7 +202,12 @@ export const Node = memo((props: NodeProps) => {
         element = (
           <>
             {first && (
-              <AddPanePanel nodeId={props.nodeId} first={true} ctx={ctx} />
+              <AddPanePanel
+                nodeId={props.nodeId}
+                first={true}
+                ctx={ctx}
+                isSandboxMode={props.isSandboxMode || false}
+              />
             )}
             <div className="py-0.5">
               <ConfigPanePanel
@@ -217,7 +223,12 @@ export const Node = memo((props: NodeProps) => {
                 {content}
               </PanelVisibilityWrapper>
             </div>
-            <AddPanePanel nodeId={props.nodeId} first={false} ctx={ctx} />
+            <AddPanePanel
+              nodeId={props.nodeId}
+              first={false}
+              ctx={ctx}
+              isSandboxMode={props.isSandboxMode || false}
+            />
           </>
         );
       }

package/templates/src/components/compositor/nodes/Pane.tsx

@@ -5,8 +5,6 @@ import { RenderChildren } from './RenderChildren';
 import FeaturedArticleSetup from '@/components/codehooks/FeaturedArticleSetup';
 import ListContentSetup from '@/components/codehooks/ListContentSetup';
 import BunnyVideoSetup from '@/components/codehooks/BunnyVideoSetup';
-import { ProductCardSetup } from '@/components/codehooks/ProductCardSetup';
-import { ProductGridSetup } from '@/components/codehooks/ProductGridSetup';
 import { PaneOverlay } from '@/components/compositor/tools/PaneOverlay';
 import type {
   PaneNode,
@@ -15,13 +13,7 @@ import type {
 } from '@/types/compositorTypes';
 import type { NodeProps } from '@/types/nodeProps';
 
-const TARGETS = [
-  'list-content',
-  'featured-article',
-  'bunny-video',
-  'product-card',
-  'product-grid',
-];
+const TARGETS = ['list-content', 'featured-article', 'bunny-video'];
 
 const CodeHookContainer = ({
   payload,
@@ -171,11 +163,7 @@ const Pane = memo(
           id={getCtx(props).getNodeSlug(props.nodeId)}
           className={useFlexLayout ? '' : wrapperClasses}
         >
-          {codeHookPayload && codeHookTarget === 'product-card' ? (
-            <ProductCardSetup nodeId={props.nodeId} params={codeHookParams} />
-          ) : codeHookPayload && codeHookTarget === 'product-grid' ? (
-            <ProductGridSetup nodeId={props.nodeId} params={codeHookParams} />
-          ) : codeHookPayload && codeHookTarget === 'featured-article' ? (
+          {codeHookPayload && codeHookTarget === 'featured-article' ? (
             <FeaturedArticleSetup
               nodeId={props.nodeId}
               params={codeHookParams}

package/templates/src/components/edit/pane/AddPanePanel.tsx

@@ -94,13 +94,14 @@ const AddPanePanel = ({
         />
       ) : mode === PaneAddMode.REUSE && !isContextPane ? (
         <AddPaneReUsePanel nodeId={nodeId} first={first} setMode={setMode} />
-      ) : mode === PaneAddMode.CODEHOOK && !isContextPane ? (
+      ) : mode === PaneAddMode.CODEHOOK ? (
         <AddPaneCodeHookPanel
           nodeId={nodeId}
           first={first}
           setMode={setMode}
           isStoryFragment={isStoryFragment}
           isContextPane={isContextPane}
+          isSandboxMode={isSandboxMode}
         />
       ) : mode === PaneAddMode.PASTE ? (
         <AddPanePanel_paste
@@ -139,7 +140,7 @@ const AddPanePanel = ({
                   )}
                 </>
               )}
-              {!isTemplate && !isContextPane && (
+              {!isTemplate && (
                 <button
                   onClick={() => setMode(PaneAddMode.CODEHOOK)}
                   className="rounded bg-white px-2 py-1 text-sm text-cyan-700 shadow-sm transition-colors hover:bg-cyan-700 hover:text-white"

package/templates/src/components/edit/pane/AddPanePanel_codehook.tsx

@@ -5,7 +5,11 @@ import { Combobox } from '@ark-ui/react';
 import { createListCollection } from '@ark-ui/react/collection';
 import ChevronUpDownIcon from '@heroicons/react/20/solid/ChevronUpDownIcon';
 import CheckIcon from '@heroicons/react/20/solid/CheckIcon';
-import { codehookMapStore, fullContentMapStore } from '@/stores/storykeep';
+import {
+  brandConfigStore,
+  codehookMapStore,
+  fullContentMapStore,
+} from '@/stores/storykeep';
 import { getCtx } from '@/stores/nodes';
 import { findUniqueSlug } from '@/utils/helpers';
 import { PaneAddMode, type TemplatePane } from '@/types/compositorTypes';
@@ -16,6 +20,7 @@ interface AddPaneCodeHookPanelProps {
   setMode: (mode: PaneAddMode) => void;
   isStoryFragment?: boolean;
   isContextPane?: boolean;
+  isSandboxMode?: boolean;
 }
 
 const AddPaneCodeHookPanel = ({
@@ -24,10 +29,13 @@ const AddPaneCodeHookPanel = ({
   setMode,
   isStoryFragment = false,
   isContextPane = false,
+  isSandboxMode = false,
 }: AddPaneCodeHookPanelProps) => {
   const [selected, setSelected] = useState<string | null>(null);
   const [query, setQuery] = useState('');
   const $contentMap = useStore(fullContentMapStore);
+  const brandConfig = useStore(brandConfigStore);
+  const hasShopify = brandConfig?.HAS_SHOPIFY === true;
 
   const existingSlugs = $contentMap
     .filter((item) => ['Pane', 'StoryFragment'].includes(item.type))
@@ -39,9 +47,22 @@ const AddPaneCodeHookPanel = ({
 
   const availableCodeHooks = codehookMapStore.get();
 
-  // Filter hooks based on search query
+  const isHookVisibleInPicker = (hookName: string) => {
+    if (
+      (hookName === 'shopify-product-grid' ||
+        hookName === 'shopify-service-list') &&
+      !hasShopify
+    ) {
+      return false;
+    }
+    if (hookName === 'get-crafting' && !isSandboxMode) {
+      return false;
+    }
+    return true;
+  };
+
+  // Filter hooks based on search query and tenant/sandbox gates
   const filteredHooks = useMemo(() => {
-    // Start with available hooks
     const hooks =
       query === ''
         ? [...availableCodeHooks]
@@ -49,9 +70,8 @@ const AddPaneCodeHookPanel = ({
             hook.toLowerCase().includes(query.toLowerCase())
           );
 
-    // Create a new array with unavailable hooks removed (don't just filter - we want to show them as disabled)
-    return hooks;
-  }, [availableCodeHooks, query]);
+    return hooks.filter(isHookVisibleInPicker);
+  }, [availableCodeHooks, query, hasShopify, isSandboxMode]);
 
   // Create collection for Ark UI Combobox
   const collection = useMemo(() => {
@@ -64,21 +84,22 @@ const AddPaneCodeHookPanel = ({
 
   const isHookAvailable = (hookName: string) => {
     if (
-      (hookName === 'featured-content' ||
-        hookName === 'list-content' ||
-        hookName === 'featured-article') &&
+      (hookName === 'list-content' || hookName === 'featured-article') &&
       !hasStoryFragments
     ) {
-      return hasStoryFragments;
+      return false;
+    }
+    if (
+      hookName === 'bunny-video' &&
+      import.meta.env.PUBLIC_ENABLE_BUNNY !== 'true'
+    ) {
+      return false;
     }
     return true;
   };
 
   const getDisplayName = (hookName: string) => {
-    if (
-      (hookName === 'featured-content' || hookName === 'list-content') &&
-      !hasStoryFragments
-    ) {
+    if (hookName === 'list-content' && !hasStoryFragments) {
       return `${hookName} (not yet available; no pages found)`;
     }
     return hookName;

package/templates/src/components/edit/pane/ConfigPanePanel.tsx

@@ -260,7 +260,7 @@ const ConfigPanePanel = ({
                     )}
                   </>
                 )}
-                {isCodeHook && !isContextPane && (
+                {isCodeHook && (
                   <button
                     onClick={handleCodeHookConfig}
                     className={buttonClass}

package/templates/src/components/edit/storyfragment/StoryFragmentPanel_menu.tsx

@@ -13,7 +13,7 @@ import {
   type MenuNode,
 } from '@/types/compositorTypes';
 import MenuForm from '@/components/storykeep/controls/content/MenuForm';
-import { fullContentMapStore, getFullContentMap } from '@/stores/analytics';
+import { getFullContentMap, setTenantFullContentMap } from '@/stores/analytics';
 import type { FullContentMapItem } from '@/types/tractstack';
 
 interface StoryFragmentMenuPanelProps {
@@ -53,7 +53,7 @@ const StoryFragmentMenuPanel = ({
         if (!contentMap) {
           const currentContentMap = await api.getContentMapWithTimestamp();
           if (currentContentMap.success && currentContentMap.data) {
-            fullContentMapStore.set(tenantId, currentContentMap.data);
+            setTenantFullContentMap(tenantId, currentContentMap.data);
             setContentMap(currentContentMap.data.data);
           }
         }

package/templates/src/components/storykeep/Dashboard_Analytics.tsx

@@ -1,7 +1,11 @@
 import { useState, useCallback, useMemo, Component } from 'react';
 import type { ReactNode } from 'react';
 import { useStore } from '@nanostores/react';
-import { epinetCustomFilters } from '@/stores/analytics';
+import {
+  epinetCustomFilters,
+  getEpinetCustomFilters,
+  setEpinetCustomFilters,
+} from '@/stores/analytics';
 import { classNames } from '@/utils/helpers';
 import ArrowDownTrayIcon from '@heroicons/react/24/outline/ArrowDownTrayIcon';
 import DashboardActivity from './Dashboard_Activity';
@@ -167,7 +171,7 @@ export default function StoryKeepDashboard_Analytics({
 
   const handleBeliefFilterChange = (beliefSlug: string, value: string) => {
     const tenantId = window.TRACTSTACK_CONFIG?.tenantId || 'default';
-    const currentFilters = epinetCustomFilters.get();
+    const currentFilters = getEpinetCustomFilters();
     let newFilters = [...(currentFilters.appliedFilters || [])];
 
     if (value === 'All') {
@@ -183,7 +187,7 @@ export default function StoryKeepDashboard_Analytics({
       }
     }
 
-    epinetCustomFilters.set(tenantId, {
+    setEpinetCustomFilters(tenantId, {
       ...currentFilters,
       appliedFilters: newFilters,
     });
@@ -220,7 +224,7 @@ export default function StoryKeepDashboard_Analytics({
         nowUTC.getTime() - hoursBack * 60 * 60 * 1000
       );
 
-      epinetCustomFilters.set(window.TRACTSTACK_CONFIG?.tenantId || 'default', {
+      setEpinetCustomFilters(window.TRACTSTACK_CONFIG?.tenantId || 'default', {
         ...$epinetCustomFilters,
         enabled: true,
         startTimeUTC: startTimeUTC.toISOString(),

package/templates/src/components/storykeep/controls/content/ContentBrowser.tsx

@@ -1,7 +1,10 @@
 import { useState, useEffect, useRef } from 'react';
 import { Switch } from '@ark-ui/react';
 import { useStore } from '@nanostores/react';
-import { epinetCustomFilters } from '@/stores/analytics';
+import {
+  epinetCustomFilters,
+  setEpinetCustomFilters,
+} from '@/stores/analytics';
 import { classNames } from '@/utils/helpers';
 import type { FullContentMapItem } from '@/types/tractstack';
 
@@ -104,7 +107,7 @@ const ContentBrowser = ({
   const setStandardDuration = (hours: number) => {
     const nowUTC = new Date();
     const startTimeUTC = new Date(nowUTC.getTime() - hours * 60 * 60 * 1000);
-    epinetCustomFilters.set(window.TRACTSTACK_CONFIG?.tenantId || 'default', {
+    setEpinetCustomFilters(window.TRACTSTACK_CONFIG?.tenantId || 'default', {
       ...$epinetCustomFilters,
       enabled: true,
       startTimeUTC: startTimeUTC.toISOString(),

package/templates/src/components/storykeep/state/FetchAnalytics.tsx

@@ -1,6 +1,10 @@
 import { useEffect, useRef } from 'react';
 import { useStore } from '@nanostores/react';
-import { epinetCustomFilters } from '@/stores/analytics';
+import {
+  epinetCustomFilters,
+  getEpinetCustomFilters,
+  setEpinetCustomFilters,
+} from '@/stores/analytics';
 import { TractStackAPI } from '@/utils/api';
 
 const VERBOSE = false;
@@ -252,7 +256,7 @@ class AnalyticsService {
       this.setCachedResponse(cacheKey, analyticsData);
       onUpdate(analyticsData);
 
-      epinetCustomFilters.set(window.TRACTSTACK_CONFIG?.tenantId || 'default', {
+      setEpinetCustomFilters(window.TRACTSTACK_CONFIG?.tenantId || 'default', {
         ...filters,
         availableFilters: data.availableFilters || [],
       });
@@ -298,9 +302,9 @@ class AnalyticsService {
     if (VERBOSE) console.log('🏁 Initializing analytics filters');
     const nowUTC = new Date();
     const oneWeekAgoUTC = new Date(nowUTC.getTime() - 7 * 24 * 60 * 60 * 1000);
-    const current = epinetCustomFilters.get();
+    const current = getEpinetCustomFilters();
     if (!current.enabled) {
-      epinetCustomFilters.set(tenantId, {
+      setEpinetCustomFilters(tenantId, {
         enabled: true,
         visitorType: 'all',
         selectedUserId: null,

package/templates/src/components/storykeep/widgets/Wizard.tsx

@@ -139,7 +139,7 @@ export default function Wizard({
     const buildWizardData = async () => {
       try {
         const homePage = activeContentMap.find(
-          (item) => item.slug === homeSlug
+          (item: FullContentMapItem) => item.slug === homeSlug
         );
 
         let homeData = null;
@@ -173,7 +173,9 @@ export default function Wizard({
           hasPanes: !!homePage?.panes?.length,
           hasSeo: !!homePage?.description,
           hasMenu: !!homeData?.menuId,
-          hasAnyMenu: activeContentMap.some((item) => item.type === 'Menu'),
+          hasAnyMenu: activeContentMap.some(
+            (item: FullContentMapItem) => item.type === 'Menu'
+          ),
         };
 
         setWizardData(data);