astro-tractstack 2.3.1 → 2.3.3

package/bin/create-tractstack.js

@@ -154,7 +154,7 @@ ${kleur.bold('Examples:')}
     console.log(kleur.red("❌ This doesn't appear to be an Astro project."));
     console.log('Please run this command in the root of your Astro project.\n');
     console.log('To create a new Astro project with TractStack:');
-    console.log(kleur.cyan('pnpm create astro@latest my-tractstack-site'));
+    console.log(kleur.cyan('pnpm create astro@5 my-tractstack-site'));
     console.log(kleur.cyan('cd my-tractstack-site'));
     console.log(kleur.cyan('npx create-tractstack'));
     process.exit(1);
@@ -332,7 +332,7 @@ PUBLIC_ENABLE_BUNNY="${finalResponses.enableBunny ? 'true' : 'false'}"
   try {
     // Install React and Node adapter
     execSync(
-      `${addCommand} react@^19.0.0 react-dom@^19.0.0 @astrojs/react@^4.4.2 @astrojs/node@^9.4.3`,
+      `${addCommand} react@^19.0.0 react-dom@^19.0.0 astro@^5.16.6 @astrojs/react@^4.4.2 @astrojs/node@^9.4.3`,
       { stdio: 'inherit' }
     );
     console.log(kleur.green('✅ React and Node adapter installed'));
@@ -382,7 +382,7 @@ PUBLIC_ENABLE_BUNNY="${finalResponses.enableBunny ? 'true' : 'false'}"
     console.log('Please run manually:');
     console.log(
       kleur.cyan(
-        `${addCommand} react@^19.0.0 react-dom@^19.0.0 @astrojs/react@^4.4.2 @astrojs/node@^9.4.3 @nanostores/react@^1.0.0 nanostores@^1.0.1 @nanostores/persistent ulid@^3.0.1 @ark-ui/react@^5.30.0 @heroicons/react@^2.1.1 @internationalized/date@3.10.0 d3@^7.9.0 d3-sankey@^0.12.3 recharts@^3.1.2 player.js@^0.1.0 tinycolor2@1.6.0 html-to-image@^1.11.13 path-to-regexp@^8.0.0 postcss postcss-selector-parser`
+        `${addCommand} react@^19.0.0 react-dom@^19.0.0 astro@^5.16.6 @astrojs/react@^4.4.2 @astrojs/node@^9.4.3 @nanostores/react@^1.0.0 nanostores@^1.0.1 @nanostores/persistent ulid@^3.0.1 @ark-ui/react@^5.30.0 @heroicons/react@^2.1.1 @internationalized/date@3.10.0 d3@^7.9.0 d3-sankey@^0.12.3 recharts@^3.1.2 player.js@^0.1.0 tinycolor2@1.6.0 html-to-image@^1.11.13 path-to-regexp@^8.0.0 postcss postcss-selector-parser`
       )
     );
     console.log(

package/dist/index.js

@@ -2,13 +2,13 @@ import { fileURLToPath as d } from "node:url";
 import { dirname as i, resolve as l } from "node:path";
 import { existsSync as n, mkdirSync as x, copyFileSync as k, writeFileSync as u } from "node:fs";
 import { resolve as a } from "path";
-function b(t) {
+function g(t) {
   const e = i(d(t));
   return {
     resolve: (...c) => l(e, ...c)
   };
 }
-function g(t, e) {
+function b(t, e) {
   e.info("TractStack configuration applied"), t.enableMultiTenant && e.info("Multi-tenant mode enabled"), t.includeExamples && e.info("Example components will be included");
   const c = process.env.PUBLIC_GO_BACKEND, o = process.env.PUBLIC_TENANTID;
   if (!c)
@@ -747,10 +747,6 @@ async function y(t, e, c) {
       src: t("../templates/src/utils/actions/preParse_Action.ts"),
       dest: "src/utils/actions/preParse_Action.ts"
     },
-    {
-      src: t("../templates/src/utils/actions/preParse_Clicked.ts"),
-      dest: "src/utils/actions/preParse_Clicked.ts"
-    },
     {
       src: t("../templates/src/utils/actions/preParse_Impression.ts"),
       dest: "src/utils/actions/preParse_Impression.ts"
@@ -891,6 +887,14 @@ async function y(t, e, c) {
       src: t("../templates/custom/shopify/cart.astro"),
       dest: "src/pages/cart.astro"
     },
+    {
+      src: t("../templates/src/pages/privacy.astro"),
+      dest: "src/pages/privacy.astro"
+    },
+    {
+      src: t("../templates/src/pages/terms.astro"),
+      dest: "src/pages/terms.astro"
+    },
     {
       src: t("../templates/src/pages/404.astro"),
       dest: "src/pages/404.astro"
@@ -989,6 +993,22 @@ async function y(t, e, c) {
       src: t("../templates/src/pages/api/auth/logout.ts"),
       dest: "src/pages/api/auth/logout.ts"
     },
+    {
+      src: t("../templates/src/pages/api/google/oauth/start.ts"),
+      dest: "src/pages/api/google/oauth/start.ts"
+    },
+    {
+      src: t("../templates/src/pages/api/google/oauth/status.ts"),
+      dest: "src/pages/api/google/oauth/status.ts"
+    },
+    {
+      src: t("../templates/src/pages/api/google/oauth/disconnect.ts"),
+      dest: "src/pages/api/google/oauth/disconnect.ts"
+    },
+    {
+      src: t("../templates/src/pages/api/google/oauth/callback.ts"),
+      dest: "src/pages/api/google/oauth/callback.ts"
+    },
     {
       src: t("../templates/src/pages/api/orphan-analysis.ts"),
       dest: "src/pages/api/orphan-analysis.ts"
@@ -1242,6 +1262,36 @@ async function y(t, e, c) {
       ),
       dest: "src/components/storykeep/shopify/ShopifyDashboard_Services.tsx"
     },
+    {
+      src: t(
+        "../templates/src/components/storykeep/shopify/ShopifyDashboard_Emails.tsx"
+      ),
+      dest: "src/components/storykeep/shopify/ShopifyDashboard_Emails.tsx"
+    },
+    {
+      src: t(
+        "../templates/src/components/storykeep/email-builder/EmailBuilder.tsx"
+      ),
+      dest: "src/components/storykeep/email-builder/EmailBuilder.tsx"
+    },
+    {
+      src: t(
+        "../templates/src/components/storykeep/email-builder/Blocks.tsx"
+      ),
+      dest: "src/components/storykeep/email-builder/Blocks.tsx"
+    },
+    {
+      src: t(
+        "../templates/src/components/storykeep/email-builder/PropertyPanel.tsx"
+      ),
+      dest: "src/components/storykeep/email-builder/PropertyPanel.tsx"
+    },
+    {
+      src: t(
+        "../templates/src/components/storykeep/email-builder/PreviewModal.tsx"
+      ),
+      dest: "src/components/storykeep/email-builder/PreviewModal.tsx"
+    },
     {
       src: t(
         "../templates/src/components/storykeep/shopify/ShopifyDashboard_Search.tsx"
@@ -2230,6 +2280,10 @@ async function y(t, e, c) {
       src: t("../templates/src/utils/api/setupHelpers.ts"),
       dest: "src/utils/api/setupHelpers.ts"
     },
+    {
+      src: t("../templates/src/utils/api/emailHelpers.ts"),
+      dest: "src/utils/api/emailHelpers.ts"
+    },
     {
       src: t(
         "../templates/src/components/storykeep/widgets/HydrateWizard.tsx"
@@ -2273,6 +2327,11 @@ async function y(t, e, c) {
       dest: "src/utils/customHelpers.ts",
       protected: !0
     },
+    {
+      src: t("../templates/src/utils/booking/appointmentMode.ts"),
+      dest: "src/utils/booking/appointmentMode.ts",
+      protected: !0
+    },
     {
       src: t("../templates/custom/shopify/ShopifyProductGrid.tsx"),
       dest: "src/custom/shopify/ShopifyProductGrid.tsx",
@@ -2372,7 +2431,7 @@ async function y(t, e, c) {
         if (n(s.src))
           k(s.src, s.dest), e.info(`Updated ${s.dest}`);
         else {
-          const m = w(s.dest);
+          const m = f(s.dest);
           u(s.dest, m), e.info(`Created placeholder ${s.dest}`);
         }
       else s.protected ? e.info(`Protected: ${s.dest} (skipped overwrite)`) : e.info(`Skipped existing ${s.dest}`);
@@ -2381,24 +2440,23 @@ async function y(t, e, c) {
       e.error(`Failed to create ${s.dest}: ${r}`);
     }
 }
-function w(t) {
+function f(t) {
   return t.endsWith(".astro") ? `---
 // TractStack placeholder component
 ---
 <div>TractStack placeholder: ${t}</div>` : t.endsWith(".tsx") ? `// TractStack placeholder component
-import React from 'react';
 export default function Placeholder() {
   return <div>TractStack placeholder: ${t}</div>;
 }` : t.endsWith(".ts") ? `// TractStack placeholder utility
 export const placeholder = "${t}";` : `# TractStack placeholder: ${t}`;
 }
 function P(t = {}) {
-  const { resolve: e } = b(import.meta.url);
+  const { resolve: e } = g(import.meta.url);
   return {
     name: "astro-tractstack",
     hooks: {
       "astro:config:setup": async ({ config: c, updateConfig: o, logger: s }) => {
-        g(t, s);
+        b(t, s);
         const p = t.enableMultiTenant || !1;
         if (s.info(
           `DEBUG: enableMultiTenant = ${p}, process.env.PUBLIC_ENABLE_MULTI_TENANT = ${process.env.PUBLIC_ENABLE_MULTI_TENANT}`

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "astro-tractstack",
-  "version": "2.3.1",
+  "version": "2.3.3",
   "description": "Astro integration for TractStack - the free web press by At Risk Media",
   "type": "module",
   "main": "dist/index.js",

package/templates/custom/shopify/Cart.tsx

@@ -1,4 +1,4 @@
-import { useState, useEffect } from 'react';
+import { useState, useEffect, useMemo } from 'react';
 import { ulid } from 'ulid';
 import { useStore } from '@nanostores/react';
 import {
@@ -7,14 +7,18 @@ import {
   cartState,
   CART_STATES,
   isShopifyHandoff,
+  preferredAppointmentMode,
   transactionTraceId,
   type CartItemState,
 } from '@/stores/shopify';
 import { getShopifyImage } from '@/utils/helpers';
+import { deriveAppointmentConstraints } from '@/utils/booking/appointmentMode';
 import type { ResourceNode } from '@/types/compositorTypes';
 
 interface CartProps {
   resources: ResourceNode[];
+  allowRemote?: boolean;
+  remoteOnly?: boolean;
 }
 
 const getCleanVariantTitle = (variant: any) => {
@@ -34,9 +38,14 @@ const getCleanVariantTitle = (variant: any) => {
   return title === 'Default Title' ? '' : title;
 };
 
-export default function Cart({ resources = [] }: CartProps) {
+export default function Cart({
+  resources = [],
+  allowRemote = false,
+  remoteOnly = false,
+}: CartProps) {
   const cart = useStore(cartStore);
   const isHandoff = useStore(isShopifyHandoff);
+  const appointmentMode = useStore(preferredAppointmentMode);
   const [pickupEnabled, setPickupEnabled] = useState(false);
 
   const cartValues = Object.values(cart);
@@ -67,12 +76,34 @@ export default function Cart({ resources = [] }: CartProps) {
     return !!resource?.optionsPayload?.bookingLengthMinutes;
   });
 
+  const appointmentConstraints = useMemo(
+    () =>
+      deriveAppointmentConstraints(cart, resources, {
+        allowRemote,
+        remoteOnly,
+      }),
+    [cart, resources, allowRemote, remoteOnly]
+  );
+  const { effectiveRemoteOnly, remoteAvailable, inPersonAvailable, canRemote } =
+    appointmentConstraints;
+
   const hasPhysicalProductWithPickup = cartValues.some(
     (item) =>
       item.variantIdPickup && item.variantIdPickup !== item.variantIdShipped
   );
 
-  const canPickup = hasService && hasPhysicalProductWithPickup;
+  const canPickup =
+    hasService && hasPhysicalProductWithPickup && appointmentMode !== 'REMOTE';
+
+  useEffect(() => {
+    if (effectiveRemoteOnly) {
+      preferredAppointmentMode.set('REMOTE');
+      return;
+    }
+    if (!canRemote && preferredAppointmentMode.get() === 'REMOTE') {
+      preferredAppointmentMode.set('IN_PERSON');
+    }
+  }, [effectiveRemoteOnly, canRemote]);
 
   useEffect(() => {
     if (canPickup) {
@@ -131,17 +162,55 @@ export default function Cart({ resources = [] }: CartProps) {
     <div className="rounded-lg bg-white shadow">
       <div className="flex items-center justify-between border-b border-gray-200 px-6 py-4">
         <h2 className="text-xl font-bold text-gray-800">Shopping Cart</h2>
-        {canPickup && (
-          <label className="flex items-center space-x-2 text-sm font-bold text-gray-900">
-            <input
-              type="checkbox"
-              checked={pickupEnabled}
-              onChange={(e) => setPickupEnabled(e.target.checked)}
-              className="h-4 w-4 rounded border-gray-300 text-black focus:ring-black"
-            />
-            <span>Pick up at Store</span>
-          </label>
-        )}
+        <div className="flex items-center gap-4">
+          {hasService && remoteAvailable && inPersonAvailable && (
+            <div className="flex flex-col items-end gap-1">
+              <p className="text-xs font-bold uppercase tracking-wide text-gray-500">
+                Appointment Mode
+              </p>
+              <div className="flex gap-2">
+                <button
+                  type="button"
+                  onClick={() => preferredAppointmentMode.set('IN_PERSON')}
+                  className={`rounded-md px-3 py-2 text-sm font-bold ${
+                    appointmentMode === 'IN_PERSON'
+                      ? 'bg-black text-white'
+                      : 'border border-gray-300 bg-white text-gray-700'
+                  }`}
+                >
+                  In Person
+                </button>
+                <button
+                  type="button"
+                  onClick={() => preferredAppointmentMode.set('REMOTE')}
+                  className={`rounded-md px-3 py-2 text-sm font-bold ${
+                    appointmentMode === 'REMOTE'
+                      ? 'bg-black text-white'
+                      : 'border border-gray-300 bg-white text-gray-700'
+                  }`}
+                >
+                  Remote
+                </button>
+              </div>
+            </div>
+          )}
+          {hasService && effectiveRemoteOnly && (
+            <p className="text-sm font-bold text-gray-900">
+              Appointment: Remote
+            </p>
+          )}
+          {canPickup && (
+            <label className="flex items-center space-x-2 text-sm font-bold text-gray-900">
+              <input
+                type="checkbox"
+                checked={pickupEnabled}
+                onChange={(e) => setPickupEnabled(e.target.checked)}
+                className="h-4 w-4 rounded border-gray-300 text-black focus:ring-black"
+              />
+              <span>Pick up at Store</span>
+            </label>
+          )}
+        </div>
       </div>
 
       <ul className="divide-y divide-gray-200">
@@ -163,9 +232,9 @@ export default function Cart({ resources = [] }: CartProps) {
             ? firstItem.variantIdPickup
             : firstItem.variantIdShipped;
           const displayIdFirst =
+            firstItem.variantId ||
             activeVariantIdFirst ||
-            firstItem.variantIdPickup ||
-            firstItem.variantId;
+            firstItem.variantIdPickup;
 
           const { src, srcSet } = getShopifyImage(
             resource,
@@ -240,9 +309,9 @@ export default function Cart({ resources = [] }: CartProps) {
                         : item.variantIdShipped;
 
                       const displayId =
+                        item.variantId ||
                         activeVariantId ||
-                        item.variantIdPickup ||
-                        item.variantId;
+                        item.variantIdPickup;
 
                       let price = '0.00';
                       let currency = 'USD';
@@ -348,13 +417,24 @@ export default function Cart({ resources = [] }: CartProps) {
               const sanitizedCart = { ...currentCart };
 
               Object.keys(sanitizedCart).forEach((key) => {
-                const item = sanitizedCart[key];
+                const item = { ...sanitizedCart[key] };
+
+                if (
+                  item.variantId &&
+                  !item.variantIdShipped &&
+                  !item.variantIdPickup
+                ) {
+                  sanitizedCart[key] = item;
+                  return;
+                }
 
                 if (isPickupMode && item.variantIdPickup) {
                   item.variantId = item.variantIdPickup;
                 } else if (!isPickupMode && item.variantIdShipped) {
                   item.variantId = item.variantIdShipped;
                 }
+
+                sanitizedCart[key] = item;
               });
 
               cartStore.set(sanitizedCart);