cloudcommerce 0.37.1 → 0.39.0

package/packages/storefront/dist/server/manifest_dSwvaOdW.mjs

@@ -0,0 +1,195 @@
+import '@astrojs/internal-helpers/path';
+import 'cookie';
+import { bold, red, yellow, dim, blue } from 'kleur/colors';
+import 'string-width';
+import './chunks/astro_zcC1GStV.mjs';
+import 'clsx';
+import { compile } from 'path-to-regexp';
+
+const dateTimeFormat = new Intl.DateTimeFormat([], {
+  hour: "2-digit",
+  minute: "2-digit",
+  second: "2-digit",
+  hour12: false
+});
+const levels = {
+  debug: 20,
+  info: 30,
+  warn: 40,
+  error: 50,
+  silent: 90
+};
+function log(opts, level, label, message) {
+  const logLevel = opts.level;
+  const dest = opts.dest;
+  const event = {
+    label,
+    level,
+    message
+  };
+  if (!isLogLevelEnabled(logLevel, level)) {
+    return;
+  }
+  dest.write(event);
+}
+function isLogLevelEnabled(configuredLogLevel, level) {
+  return levels[configuredLogLevel] <= levels[level];
+}
+function info(opts, label, message) {
+  return log(opts, "info", label, message);
+}
+function warn(opts, label, message) {
+  return log(opts, "warn", label, message);
+}
+function error(opts, label, message) {
+  return log(opts, "error", label, message);
+}
+function debug(...args) {
+  if ("_astroGlobalDebug" in globalThis) {
+    globalThis._astroGlobalDebug(...args);
+  }
+}
+function getEventPrefix({ level, label }) {
+  const timestamp = `${dateTimeFormat.format(/* @__PURE__ */ new Date())}`;
+  const prefix = [];
+  if (level === "error" || level === "warn") {
+    prefix.push(bold(timestamp));
+    prefix.push(`[${level.toUpperCase()}]`);
+  } else {
+    prefix.push(timestamp);
+  }
+  if (label) {
+    prefix.push(`[${label}]`);
+  }
+  if (level === "error") {
+    return red(prefix.join(" "));
+  }
+  if (level === "warn") {
+    return yellow(prefix.join(" "));
+  }
+  if (prefix.length === 1) {
+    return dim(prefix[0]);
+  }
+  return dim(prefix[0]) + " " + blue(prefix.splice(1).join(" "));
+}
+if (typeof process !== "undefined") {
+  let proc = process;
+  if ("argv" in proc && Array.isArray(proc.argv)) {
+    if (proc.argv.includes("--verbose")) ; else if (proc.argv.includes("--silent")) ; else ;
+  }
+}
+class Logger {
+  options;
+  constructor(options) {
+    this.options = options;
+  }
+  info(label, message) {
+    info(this.options, label, message);
+  }
+  warn(label, message) {
+    warn(this.options, label, message);
+  }
+  error(label, message) {
+    error(this.options, label, message);
+  }
+  debug(label, ...messages) {
+    debug(label, ...messages);
+  }
+  level() {
+    return this.options.level;
+  }
+  forkIntegrationLogger(label) {
+    return new AstroIntegrationLogger(this.options, label);
+  }
+}
+class AstroIntegrationLogger {
+  options;
+  label;
+  constructor(logging, label) {
+    this.options = logging;
+    this.label = label;
+  }
+  /**
+   * Creates a new logger instance with a new label, but the same log options.
+   */
+  fork(label) {
+    return new AstroIntegrationLogger(this.options, label);
+  }
+  info(message) {
+    info(this.options, this.label, message);
+  }
+  warn(message) {
+    warn(this.options, this.label, message);
+  }
+  error(message) {
+    error(this.options, this.label, message);
+  }
+  debug(message) {
+    debug(this.label, message);
+  }
+}
+
+function getRouteGenerator(segments, addTrailingSlash) {
+  const template = segments.map((segment) => {
+    return "/" + segment.map((part) => {
+      if (part.spread) {
+        return `:${part.content.slice(3)}(.*)?`;
+      } else if (part.dynamic) {
+        return `:${part.content}`;
+      } else {
+        return part.content.normalize().replace(/\?/g, "%3F").replace(/#/g, "%23").replace(/%5B/g, "[").replace(/%5D/g, "]").replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+      }
+    }).join("");
+  }).join("");
+  let trailing = "";
+  if (addTrailingSlash === "always" && segments.length) {
+    trailing = "/";
+  }
+  const toPath = compile(template + trailing);
+  return toPath;
+}
+
+function deserializeRouteData(rawRouteData) {
+  return {
+    route: rawRouteData.route,
+    type: rawRouteData.type,
+    pattern: new RegExp(rawRouteData.pattern),
+    params: rawRouteData.params,
+    component: rawRouteData.component,
+    generate: getRouteGenerator(rawRouteData.segments, rawRouteData._meta.trailingSlash),
+    pathname: rawRouteData.pathname || void 0,
+    segments: rawRouteData.segments,
+    prerender: rawRouteData.prerender,
+    redirect: rawRouteData.redirect,
+    redirectRoute: rawRouteData.redirectRoute ? deserializeRouteData(rawRouteData.redirectRoute) : void 0,
+    fallbackRoutes: rawRouteData.fallbackRoutes.map((fallback) => {
+      return deserializeRouteData(fallback);
+    })
+  };
+}
+
+function deserializeManifest(serializedManifest) {
+  const routes = [];
+  for (const serializedRoute of serializedManifest.routes) {
+    routes.push({
+      ...serializedRoute,
+      routeData: deserializeRouteData(serializedRoute.routeData)
+    });
+    const route = serializedRoute;
+    route.routeData = deserializeRouteData(serializedRoute.routeData);
+  }
+  const assets = new Set(serializedManifest.assets);
+  const componentMetadata = new Map(serializedManifest.componentMetadata);
+  const clientDirectives = new Map(serializedManifest.clientDirectives);
+  return {
+    ...serializedManifest,
+    assets,
+    componentMetadata,
+    clientDirectives,
+    routes
+  };
+}
+
+const manifest = deserializeManifest({"adapterName":"@astrojs/node","routes":[{"file":"","links":[],"scripts":[],"styles":[],"routeData":{"type":"endpoint","route":"/_image","pattern":"^\\/_image$","segments":[[{"content":"_image","dynamic":false,"spread":false}]],"params":[],"component":"../../node_modules/.pnpm/astro@4.0.4_@types+node@18.19.3_typescript@5.2.2/node_modules/astro/dist/assets/endpoint/node.js","pathname":"/_image","prerender":false,"fallbackRoutes":[],"_meta":{"trailingSlash":"ignore"}}},{"file":"","links":[],"scripts":[{"type":"external","value":"/_astro/hoisted._FbzheVm.js"}],"styles":[{"type":"external","src":"/_astro/_slug_.r8QHNfdw.css"}],"routeData":{"route":"/","type":"page","pattern":"^\\/$","segments":[],"params":[],"component":"src/pages/index.astro","pathname":"/","prerender":false,"fallbackRoutes":[],"_meta":{"trailingSlash":"ignore"}}},{"file":"","links":[],"scripts":[{"type":"external","value":"/_astro/hoisted._FbzheVm.js"}],"styles":[{"type":"external","src":"/_astro/_slug_.r8QHNfdw.css"}],"routeData":{"route":"/~fallback","type":"page","pattern":"^\\/~fallback\\/?$","segments":[[{"content":"~fallback","dynamic":false,"spread":false}]],"params":[],"component":"src/pages/~fallback.astro","pathname":"/~fallback","prerender":false,"fallbackRoutes":[],"_meta":{"trailingSlash":"ignore"}}},{"file":"","links":[],"scripts":[{"type":"external","value":"/_astro/hoisted.B6fKrLPR.js"}],"styles":[{"type":"external","src":"/_astro/_slug_.r8QHNfdw.css"}],"routeData":{"route":"/app","type":"page","pattern":"^\\/app\\/?$","segments":[[{"content":"app","dynamic":false,"spread":false}]],"params":[],"component":"src/pages/app/index.astro","pathname":"/app","prerender":false,"fallbackRoutes":[],"_meta":{"trailingSlash":"ignore"}}},{"file":"","links":[],"scripts":[{"type":"external","value":"/_astro/hoisted._FbzheVm.js"}],"styles":[{"type":"external","src":"/_astro/_slug_.r8QHNfdw.css"}],"routeData":{"route":"/app/account","type":"page","pattern":"^\\/app\\/account\\/?$","segments":[[{"content":"app","dynamic":false,"spread":false}],[{"content":"account","dynamic":false,"spread":false}]],"params":[],"component":"src/pages/app/account.astro","pathname":"/app/account","prerender":false,"fallbackRoutes":[],"_meta":{"trailingSlash":"ignore"}}},{"file":"","links":[],"scripts":[{"type":"external","value":"/_astro/hoisted._FbzheVm.js"}],"styles":[{"type":"external","src":"/_astro/_slug_.r8QHNfdw.css"}],"routeData":{"route":"/[...slug]","type":"page","pattern":"^(?:\\/(.*?))?\\/?$","segments":[[{"content":"...slug","dynamic":true,"spread":true}]],"params":["...slug"],"component":"src/pages/[...slug].astro","prerender":false,"fallbackRoutes":[],"_meta":{"trailingSlash":"ignore"}}}],"site":"https://demo.ecomplus.app","base":"/","trailingSlash":"ignore","compressHTML":false,"componentMetadata":[["/home/leo/code/ecomplus/cloud-commerce/packages/storefront/src/lib/layouts/BaseHead.astro",{"propagation":"in-tree","containsHead":false}],["/home/leo/code/ecomplus/cloud-commerce/packages/storefront/src/pages/[...slug].astro",{"propagation":"in-tree","containsHead":false}],["\u0000@astro-page:src/pages/[...slug]@_@astro",{"propagation":"in-tree","containsHead":false}],["\u0000@astrojs-ssr-virtual-entry",{"propagation":"in-tree","containsHead":false}],["/home/leo/code/ecomplus/cloud-commerce/packages/storefront/src/pages/app/account.astro",{"propagation":"in-tree","containsHead":false}],["\u0000@astro-page:src/pages/app/account@_@astro",{"propagation":"in-tree","containsHead":false}],["/home/leo/code/ecomplus/cloud-commerce/packages/storefront/src/pages/app/index.astro",{"propagation":"in-tree","containsHead":false}],["\u0000@astro-page:src/pages/app/index@_@astro",{"propagation":"in-tree","containsHead":false}],["/home/leo/code/ecomplus/cloud-commerce/packages/storefront/src/pages/index.astro",{"propagation":"in-tree","containsHead":false}],["\u0000@astro-page:src/pages/index@_@astro",{"propagation":"in-tree","containsHead":false}],["/home/leo/code/ecomplus/cloud-commerce/packages/storefront/src/pages/~fallback.astro",{"propagation":"in-tree","containsHead":false}],["\u0000@astro-page:src/pages/~fallback@_@astro",{"propagation":"in-tree","containsHead":false}]],"renderers":[],"clientDirectives":[["idle","(()=>{var i=t=>{let e=async()=>{await(await t())()};\"requestIdleCallback\"in window?window.requestIdleCallback(e):setTimeout(e,200)};(self.Astro||(self.Astro={})).idle=i;window.dispatchEvent(new Event(\"astro:idle\"));})();"],["load","(()=>{var e=async t=>{await(await t())()};(self.Astro||(self.Astro={})).load=e;window.dispatchEvent(new Event(\"astro:load\"));})();"],["media","(()=>{var s=(i,t)=>{let a=async()=>{await(await i())()};if(t.value){let e=matchMedia(t.value);e.matches?a():e.addEventListener(\"change\",a,{once:!0})}};(self.Astro||(self.Astro={})).media=s;window.dispatchEvent(new Event(\"astro:media\"));})();"],["only","(()=>{var e=async t=>{await(await t())()};(self.Astro||(self.Astro={})).only=e;window.dispatchEvent(new Event(\"astro:only\"));})();"],["visible","(()=>{var r=(i,c,s)=>{let n=async()=>{await(await i())()},t=new IntersectionObserver(e=>{for(let o of e)if(o.isIntersecting){t.disconnect(),n();break}});for(let e of s.children)t.observe(e)};(self.Astro||(self.Astro={})).visible=r;window.dispatchEvent(new Event(\"astro:visible\"));})();"],["context","(()=>{var n=(d,i)=>{let t=async()=>{await(await d())()},e=()=>{if(i.value===\"idle\"){if(typeof window.requestIdleCallback==\"function\"){setTimeout(()=>window.requestIdleCallback(t),9);return}setTimeout(t,200);return}t()},o=window.$storefront?.apiContext?.doc._id||null;if(window._firstLoadContextId===o&&window._emitedContextId===o){console.log(\"[ctx] first load\"),e(),document.addEventListener(\"astro:beforeload\",()=>{delete window._firstLoadContextId},{once:!0});return}window.addEventListener(\"storefront:apiContext\",e,{once:!0})};(self.Astro||(self.Astro={})).context=n;window.dispatchEvent(new Event(\"astro:context\"));})();\n"]],"entryModules":{"\u0000@astrojs-ssr-virtual-entry":"entry.mjs","\u0000@astro-renderers":"renderers.mjs","\u0000empty-middleware":"_empty-middleware.mjs","/src/pages/app/account.astro":"chunks/pages/account_iG-YqJ5q.mjs","/../../node_modules/.pnpm/astro@4.0.4_@types+node@18.19.3_typescript@5.2.2/node_modules/astro/dist/assets/endpoint/node.js":"chunks/pages/node_bKqL47eZ.mjs","/src/pages/~fallback.astro":"chunks/pages/~fallback_73R5VA6j.mjs","\u0000@astrojs-manifest":"manifest_dSwvaOdW.mjs","\u0000@astro-page:../../node_modules/.pnpm/astro@4.0.4_@types+node@18.19.3_typescript@5.2.2/node_modules/astro/dist/assets/endpoint/node@_@js":"chunks/node_2VvC7trl.mjs","\u0000@astro-page:src/pages/index@_@astro":"chunks/index_nIwq11oA.mjs","\u0000@astro-page:src/pages/~fallback@_@astro":"chunks/~fallback_7q1dqY4e.mjs","\u0000@astro-page:src/pages/app/index@_@astro":"chunks/index_uAR5ZV4d.mjs","\u0000@astro-page:src/pages/app/account@_@astro":"chunks/account_3ySmGzMc.mjs","\u0000@astro-page:src/pages/[...slug]@_@astro":"chunks/_.._S7DDBn_b.mjs","/home/leo/code/ecomplus/cloud-commerce/packages/storefront/src/components/SearchModal.vue":"_astro/SearchModal.F7vbwxIv.js","/home/leo/code/ecomplus/cloud-commerce/packages/storefront/src/components/CartSidebar.vue":"_astro/CartSidebar.1kUFk9Xn.js","/home/leo/code/ecomplus/cloud-commerce/node_modules/photoswipe/dist/photoswipe.css?inline":"_astro/photoswipe.0V7m2jWu.js","/home/leo/code/ecomplus/cloud-commerce/node_modules/photoswipe/dist/photoswipe-lightbox.esm.js":"_astro/photoswipe-lightbox.esm.dZBqKD9u.js","/home/leo/code/ecomplus/cloud-commerce/packages/storefront/src/lib/scripts/firebase-app.ts":"_astro/firebase-app.cPMfoOsn.js","~/components/PitchBar.vue":"_astro/PitchBar.FelC04wE.js","~/components/SearchContainer.vue":"_astro/SearchContainer.BzixfU3R.js","~/components/AccountPage.vue":"_astro/AccountPage.j0C5JBLY.js","~/components/HeroSlider.vue":"_astro/HeroSlider.tR1dVXyu.js","/astro/hoisted.js?q=0":"_astro/hoisted.B6fKrLPR.js","~/components/ProductDetails.vue":"_astro/ProductDetails.B6Ih5MGf.js","~/components/ProductShelf.vue":"_astro/ProductShelf.GESxuPZ_.js","@astrojs/vue/client.js":"_astro/client.RF8UxjZd.js","/astro/hoisted.js?q=1":"_astro/hoisted._FbzheVm.js","/home/leo/code/ecomplus/cloud-commerce/node_modules/photoswipe/dist/photoswipe.esm.js":"_astro/photoswipe.esm.Ylh9TGkz.js","~/components/ShopHeader.vue":"_astro/ShopHeader.5vR1LgSW.js","astro:scripts/before-hydration.js":""},"assets":["/_astro/_slug_.r8QHNfdw.css","/robots.txt","/_astro/AccountPage.j0C5JBLY.js","/_astro/CartSidebar.1kUFk9Xn.js","/_astro/HeroSlider.tR1dVXyu.js","/_astro/PitchBar.FelC04wE.js","/_astro/Prices.PuQc6C7F.js","/_astro/ProductCard.ephJafAE.js","/_astro/ProductDetails.B6Ih5MGf.js","/_astro/ProductShelf.GESxuPZ_.js","/_astro/QuantitySelector.YNmWjN8y.js","/_astro/SearchContainer.BzixfU3R.js","/_astro/SearchModal.F7vbwxIv.js","/_astro/ShopHeader.5vR1LgSW.js","/_astro/_plugin-vue_export-helper.sk5AFsEV.js","/_astro/afetch.5c8VmT0-.js","/_astro/client.RF8UxjZd.js","/_astro/customer-session._VkzXnXT.js","/_astro/ecom-utils.gJYgRPRz.js","/_astro/firebase-app.cPMfoOsn.js","/_astro/format-money.FMQXgKHB.js","/_astro/hoisted.B6fKrLPR.js","/_astro/hoisted._FbzheVm.js","/_astro/i18n.m7SpISxy.js","/_astro/img-sizes.gxAI9JNh.js","/_astro/img.zh-Drf-O.js","/_astro/index-dd468b12.D5s8VdAL.js","/_astro/index.5PN-EYMS.js","/_astro/index.XrHFaN2F.js","/_astro/modules-info.sD0tdb2b.js","/_astro/name.HU5l7TJo.js","/_astro/photoswipe-lightbox.esm.dZBqKD9u.js","/_astro/photoswipe.0V7m2jWu.js","/_astro/photoswipe.esm.Ylh9TGkz.js","/_astro/price.Easct8WC.js","/_astro/sf-utils.5t7r9A2G.js","/_astro/shopping-cart.A-1jhlKi.js","/_astro/use-analytics.1EVxbrS7.js","/_astro/use-product-card.erbOV6Fv.js","/img/icon.png","/img/large-icon.png","/img/uploads/banner2.webp","/img/uploads/ecom-icon.png","/img/uploads/headphone.webp","/img/uploads/logo.png","/img/uploads/og-image.png","/img/uploads/passion.webp","/img/uploads/rect8589.png","/img/uploads/rect859.png","/img/uploads/rect89.webp"]});
+
+export { AstroIntegrationLogger as A, Logger as L, getEventPrefix as g, levels as l, manifest };

package/packages/storefront/dist/server/renderers.mjs

@@ -1,7 +1,7 @@
 import { useSSRContext, defineComponent, computed, createVNode, resolveDynamicComponent, mergeProps, withCtx, renderSlot, inject, ref, watch, toRef, onMounted, onBeforeUnmount, provide, h, createSSRApp } from 'vue';
 import { ssrRenderSlotInner, ssrRenderVNode, ssrRenderSlot, ssrRenderAttrs, ssrRenderClass, ssrRenderComponent, renderToString } from 'vue/server-renderer';
 import { img, imgSizes, i18n, formatMoney } from '@ecomplus/utils';
-import { _ as _export_sfc } from './chunks/pages/__93ade2dd.mjs';
+import { _ as _export_sfc } from './chunks/pages/__MSibDuuV.mjs';
 import { useScroll, useElementHover, useDebounceFn } from '@vueuse/core';
 
 const _sfc_main$5 = /* @__PURE__ */ defineComponent({
@@ -322,7 +322,7 @@ function _sfc_ssrRender$1(_ctx, _push, _parent, _attrs, $props, $setup, $data, $
   _push(`<button${ssrRenderAttrs(mergeProps({
     type: "button",
     "aria-label": !$props.isPrev ? "Pr\xF3ximo" : "Anterior",
-    class: ["group absolute z-[2]", $setup.isX ? `${!$props.isPrev ? "right-0" : "left-0"} top-0` : `${!$props.isPrev ? "bottom-0" : "top-0"} left-0`],
+    class: ["group absolute z-[11]", $setup.isX ? `${!$props.isPrev ? "right-0" : "left-0"} top-0` : `${!$props.isPrev ? "bottom-0" : "top-0"} left-0`],
     "data-carousel-control": !$props.isPrev ? "next" : "previous"
   }, _attrs))}>`);
   ssrRenderSlot(_ctx.$slots, "default", {}, () => {

package/packages/storefront/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@cloudcommerce/storefront",
   "type": "module",
-  "version": "0.37.1",
+  "version": "0.39.0",
   "description": "E-Com Plus Cloud Commerce storefront with Astro",
   "bin": {
     "storefront": "./scripts/build-prod.sh"
@@ -29,8 +29,8 @@
     "prepare-monorepo": "bash scripts/prepare-monorepo.sh"
   },
   "dependencies": {
-    "@astrojs/node": "6.1.0",
-    "@astrojs/vue": "3.0.4",
+    "@astrojs/node": "7.0.1",
+    "@astrojs/vue": "4.0.3",
     "@cloudcommerce/api": "workspace:*",
     "@cloudcommerce/config": "workspace:*",
     "@cloudcommerce/i18n": "workspace:*",
@@ -40,24 +40,24 @@
     "@iconify-json/heroicons": "^1.1.15",
     "@iconify-json/logos": "^1.1.40",
     "@types/gtag.js": "^0.0.18",
-    "@vite-pwa/astro": "^0.1.6",
-    "@vueuse/core": "10.6.1",
-    "astro": "3.6.4",
+    "@vite-pwa/astro": "^0.2.0",
+    "@vueuse/core": "10.7.0",
+    "astro": "4.0.4",
     "astro-capo": "^0.0.1",
     "chroma-js": "^2.4.2",
     "dotenv": "^16.3.1",
-    "firebase": "^10.7.0",
+    "firebase": "^10.7.1",
     "image-size": "^1.0.2",
     "mime": "^3.0.0",
     "mitt": "^3.0.1",
     "semver": "^7.5.4",
     "sharp": "^0.32.6",
-    "tailwindcss": "^3.3.5",
+    "tailwindcss": "^3.3.6",
     "unocss": "^0.57.7",
-    "unplugin-auto-import": "^0.16.7",
-    "vite": "^4.5.1",
-    "vite-plugin-pwa": "^0.17.2",
-    "vue": "3.3.10",
+    "unplugin-auto-import": "^0.17.2",
+    "vite": "^5.0.8",
+    "vite-plugin-pwa": "^0.17.4",
+    "vue": "3.3.11",
     "wade": "0.3.3"
   },
   "devDependencies": {

package/packages/storefront/src/helpers/sf-utils.ts

@@ -14,7 +14,7 @@ export const requestIdleCallback = (fn: (...args: any[]) => any, fallbackMs = 30
 export const clearAccents = (str: string) => {
   return str
     .replace(/[ÁáÃãÂâÀà]/g, 'a')
-    .replace(/[Éé]/g, 'e')
+    .replace(/[ÉéÊê]/g, 'e')
     .replace(/[Íí]/g, 'i')
     .replace(/[ÕõÓóÔô]/g, 'o')
     .replace(/[Úú]/g, 'u')
@@ -28,3 +28,31 @@ export const slugify = (str: string) => {
     .replace(/-{2,}/g, '-')
     .replace(/(^-)|(-$)/g, '');
 };
+
+export const toLowerCaseAccents = (str: string) => {
+  return str
+    .toLowerCase()
+    .replace(/Á/g, 'á')
+    .replace(/Ã/g, 'ã')
+    .replace(/Â/g, 'â')
+    .replace(/À/g, 'à')
+    .replace(/É/g, 'é')
+    .replace(/Ê/g, 'ê')
+    .replace(/Í/g, 'í')
+    .replace(/Õ/g, 'õ')
+    .replace(/Ó/g, 'ó')
+    .replace(/Ô/g, 'ô')
+    .replace(/Ú/g, 'ú')
+    .replace(/Ç/g, 'ç');
+};
+
+export const termify = (str: string) => {
+  return toLowerCaseAccents(str.trim())
+    .replace(/[\r\n]/gm, ' ')
+    .replace(/[^\w-&%áãâàéêíõóôúç]/g, ' ')
+    .replace(/\s{2,}/g, ' ');
+};
+
+export const getSearchUrl = (term: string, baseUrl = '/s/') => {
+  return `${baseUrl}${encodeURIComponent(termify(term))}`;
+};

package/packages/storefront/src/lib/components/SharedData.astro

@@ -6,7 +6,7 @@ import {
 
 export interface Props extends UseSharedDataProps {}
 
-const { inlineClientJS } = await useSharedData(Astro.props);
+const { getInlineClientJS } = await useSharedData(Astro.props);
 ---
 
-<script is:inline set:html={inlineClientJS} />
+<script is:inline set:html={getInlineClientJS()} />

package/packages/storefront/src/lib/composables/use-breadcrumbs.ts

@@ -22,7 +22,7 @@ const useBreadcrumbs = async (props: Props = {}) => {
     apiDoc = apiContext?.doc,
     domain = settings.domain,
   } = props;
-  let categories: Props['categories'] = props.categories || data.categories;
+  let categories: Props['categories'] | null = props.categories || data.categories;
   if (!categories) {
     categories = (await useSharedData({ field: 'categories' })).value;
   }

package/packages/storefront/src/lib/composables/use-search-modal.ts

@@ -81,7 +81,7 @@ export const useSearchModal = (props: Props) => {
     searchHistory: filteredHistory,
     searchEngine,
     isFetching: searchEngine.isFetching,
-    productHits: searchEngine.products,
+    products: searchEngine.products,
     productCount,
     linkHits,
   };

package/packages/storefront/src/lib/composables/use-search-showcase.ts

@@ -0,0 +1,55 @@
+import type { SearchItem } from '@cloudcommerce/types';
+import { watch, shallowReactive } from 'vue';
+import { SearchEngine } from '@@sf/state/search-engine';
+
+export interface Props {
+  searchEngine?: InstanceType<typeof SearchEngine>;
+  term?: string | null;
+  params?: Record<string, any>;
+  sort?: '-sales' | '-created_at' | 'price' | '-price' | '-price_discount' | string;
+  products?: SearchItem[];
+  ssrError?: string | null;
+}
+
+const useSearchShowcase = (props: Props) => {
+  let { term, searchEngine } = props;
+  if (props.ssrError && !import.meta.env.SSR) {
+    console.error(new Error(`SSR search error: ${props.ssrError}`));
+    if (window.location.pathname.startsWith('/s/')) {
+      window.location.href = `/s?q=${encodeURIComponent(term || '')}`;
+    }
+  }
+  const products = shallowReactive<SearchItem[]>(props.products || []);
+  if (!searchEngine) {
+    searchEngine = new SearchEngine({ debounce: 50 });
+    if (term === undefined && !import.meta.env.SSR) {
+      term = new URLSearchParams(window.location.search).get('q') || null;
+    }
+    if (term !== undefined) {
+      searchEngine.term.value = term;
+    }
+    if (props.params) {
+      Object.assign(searchEngine.params, props.params);
+    }
+    if (props.sort) {
+      searchEngine.params.sort = props.sort;
+    }
+  }
+  if (!searchEngine.wasFetched.value && !props.products) {
+    searchEngine.fetch().catch(console.error);
+  }
+  watch(searchEngine.products, () => {
+    products.splice(0);
+    searchEngine?.products.forEach((item) => products.push(item));
+  });
+  return {
+    searchEngine,
+    fetching: searchEngine.fetching.value,
+    isFetching: searchEngine.isFetching,
+    products,
+  };
+};
+
+export default useSearchShowcase;
+
+export { useSearchShowcase };

package/packages/storefront/src/lib/composables/use-shared-data.ts

@@ -1,14 +1,19 @@
+import type { Categories, Brands } from '@cloudcommerce/api/types';
 import { EventEmitter } from 'node:events';
 
-export interface Props {
-  field: string;
-  value?: any;
+export type Props<T extends string = string> = {
+  field: T;
+  value?: T extends 'categories' ? Partial<Categories>[]
+    : T extends 'brands' ? Partial<Brands>[]
+    : any;
   timeout?: number;
 }
 
 const emitter = new EventEmitter();
 
-const useSharedData = async ({ field, value, timeout = 1000 }: Props) => {
+const useSharedData = async <T extends string = string>(props: Props<T>) => {
+  const { field, timeout = 1000 } = props;
+  let value: typeof props.value | null = props.value;
   const $data = global.$storefront.data;
   if (value) {
     $data[field] = value;
@@ -32,7 +37,7 @@ const useSharedData = async ({ field, value, timeout = 1000 }: Props) => {
   }
   return {
     value,
-    inlineClientJS: `
+    getInlineClientJS: () => `
 window.$storefront.data['${field}'] = ${JSON.stringify(value)};`,
   };
 };

package/packages/storefront/src/lib/composables/use-shop-header.ts

@@ -2,6 +2,7 @@ import type { Ref } from 'vue';
 import type { Categories } from '@cloudcommerce/api/types';
 import { ref, computed, watch } from 'vue';
 import { watchOnce } from '@vueuse/core';
+import { getSearchUrl } from '@@sf/sf-lib';
 import { totalItems } from '@@sf/state/shopping-cart';
 import useStickyHeader from '@@sf/composables/use-sticky-header';
 
@@ -131,10 +132,15 @@ const useShopHeader = (props: Props) => {
     isSearchOpenOnce.value = true;
   });
   const searchTerm = ref('');
-  const isSearchPage = !import.meta.env.SSR && window.location.pathname === '/s';
-  const urlSearchQ = isSearchPage
-    ? new URLSearchParams(window.location.search).get('q')
-    : undefined;
+  const isSearchPage = !import.meta.env.SSR && /^\/s\/?/.test(window.location.pathname);
+  let urlSearchQ: string | null | undefined;
+  if (isSearchPage) {
+    const { pathname, search } = window.location;
+    urlSearchQ = new URLSearchParams(search).get('q');
+    if (!urlSearchQ && pathname.startsWith('/s/')) {
+      urlSearchQ = decodeURIComponent(pathname.split('/')[2]);
+    }
+  }
   if (typeof urlSearchQ === 'string') {
     searchTerm.value = urlSearchQ;
   }
@@ -146,8 +152,11 @@ const useShopHeader = (props: Props) => {
     return '';
   });
   const toggleSearch = (ev: Event) => {
-    if (isSearchOpen.value && searchTerm.value) return;
     ev.preventDefault();
+    if (isSearchOpen.value && searchTerm.value) {
+      window.location.href = getSearchUrl(searchTerm.value);
+      return;
+    }
     isSearchOpen.value = !isSearchOpen.value;
     if (isSearchOpen.value && searchInput) {
       setTimeout(() => {

package/packages/storefront/src/lib/composables/use-sticky-header.ts

@@ -109,6 +109,8 @@ const useStickyHeader = (props: Props) => {
           const headerElm = header.value as HTMLElement;
           headerElm.style.opacity = opacity;
           headerElm.style.transform = transform;
+          const bodyClassAction = _isSticky && !opacity ? 'add' : 'remove';
+          document.body.classList[bodyClassAction]('StickyHeader');
         });
         watch(transition, (_transition) => {
           (header.value as HTMLElement).style.transition = _transition;

package/packages/storefront/src/lib/layouts/BaseHead.astro

@@ -19,6 +19,7 @@ const getIconUrl = (size: number) => {
 
 const {
   storeId,
+  searchPageTerm,
   cmsContent,
   fetchingApiContext,
   apiContext,
@@ -38,11 +39,17 @@ if (fetchingApiContext) {
 
 const apiDoc = apiContext.doc;
 const state: Record<string, any> = apiDoc || cmsContent || {};
-const title = state.meta_title ||
+let title = state.meta_title ||
   state.metaTitle ||
   (state.name && `${state.name} | ${settings.name}`) ||
   (state.title && `${state.title} | ${settings.name}`) ||
   settings.name;
+if (searchPageTerm) {
+  title = title.replace('$term', searchPageTerm);
+  if (!title.includes(searchPageTerm)) {
+    title = `${searchPageTerm} | ${title}`;
+  }
+}
 const description = state.meta_description ||
   state.metaDescription ||
   state.short_description ||

package/packages/storefront/src/lib/layouts/use-page-header.ts

@@ -1,9 +1,10 @@
 import type { RouteContext } from '@@sf/ssr-context';
 import type { Props as UseShopHeaderProps } from '@@sf/composables/use-shop-header';
 import api from '@cloudcommerce/api';
+import { useSharedData } from '@@sf/composables/use-shared-data';
 import { parseLayoutContent } from '@@sf/composables/use-pitch-bar';
 
-type ShopHeaderProps = Omit<UseShopHeaderProps, 'header'>;
+type ShopHeaderProps = Omit<UseShopHeaderProps, 'header' | 'categories'>;
 
 export interface Props {
   routeContext: RouteContext;
@@ -21,7 +22,7 @@ const usePageHeader = async ({ routeContext, listedCategoryFields }: Props) => {
   } = layoutContent;
   const pitchBar = parseLayoutContent(layoutContent);
   let { categories } = apiState;
-  if (!categories && listedCategoryFields !== null) {
+  if (listedCategoryFields !== null) {
     try {
       categories = (await api.get('categories', {
         fields: listedCategoryFields || ([
@@ -39,8 +40,10 @@ const usePageHeader = async ({ routeContext, listedCategoryFields }: Props) => {
       console.error(err);
     }
   }
+  if (categories) {
+    useSharedData({ field: 'categories', value: categories });
+  }
   const shopHeader: ShopHeaderProps = {
-    categories,
     menuCategorySlugs: inlineMenuCategories?.featured,
     menuRandomCategories: inlineMenuCategories?.random,
     isAlphabeticalSortSubmenu,

package/packages/storefront/src/lib/layouts/use-page-main.ts

@@ -1,9 +1,12 @@
-import type { ResourceId } from '@cloudcommerce/types';
+import type { ResourceId, Collections } from '@cloudcommerce/types';
 import type { PageContent } from '@@sf/content';
 import type { RouteContext } from '@@sf/ssr-context';
 import type { Props as UseBannerProps } from '@@sf/composables/use-banner';
 import type { Props as UseProductShelfProps } from '@@sf/composables/use-product-shelf';
+import type { Props as UseSearchShowcaseProps } from '@@sf/composables/use-search-showcase';
+import { useSharedData } from '@@sf/composables/use-shared-data';
 import { useProductShelf } from '@@sf/composables/use-product-shelf';
+import { useSearchShowcase } from '@@sf/composables/use-search-showcase';
 
 export interface Props {
   routeContext: RouteContext;
@@ -56,6 +59,7 @@ export const usePageSections = async <T extends CustomSection = CustomSection>
     | { type: 'related-products', props: {} }
     | { type: 'doc-description', props: {} }
     | { type: 'product-specifications', props: {} }
+    | { type: 'search-showcase' | 'context-showcase', props: UseSearchShowcaseProps }
   > = [];
   if (sectionsContent) {
     await Promise.all(sectionsContent.map(async ({ type, ...sectionContent }, index) => {
@@ -122,6 +126,46 @@ export const usePageSections = async <T extends CustomSection = CustomSection>
         return;
       }
 
+      if (type === 'search-showcase' || type === 'context-showcase') {
+        const props: UseSearchShowcaseProps = { ...sectionContent };
+        if (type === 'context-showcase') {
+          if (routeContext.fetchingApiContext) {
+            await routeContext.fetchingApiContext;
+          }
+          const { resource, doc } = routeContext.apiContext;
+          if (resource === 'categories' || resource === 'brands') {
+            const params = { [`${resource}.slug`]: [doc!.slug] };
+            if (resource === 'categories') {
+              const { value: categories } = await useSharedData({ field: 'categories' });
+              categories?.forEach(({ slug, parent }) => {
+                if (
+                  slug && parent
+                  && (parent._id === doc!._id || parent.slug === doc!.slug)
+                ) {
+                  params[`categories.slug`].push(slug);
+                }
+              });
+            }
+            props.params = params;
+          } else if (resource === 'collections') {
+            const { products } = (doc as Collections);
+            if (products?.length) {
+              props.params = { _id: products };
+            }
+          }
+        } else if (routeContext.searchPageTerm !== undefined) {
+          props.term = routeContext.searchPageTerm || null;
+        }
+        if (props.term !== undefined || props.params) {
+          const { searchEngine, fetching } = useSearchShowcase(props);
+          await fetching;
+          props.products = searchEngine.products;
+          props.ssrError = searchEngine.fetchError.value?.message;
+        }
+        sections[index] = { type, props };
+        return;
+      }
+
       if (type === 'banners-grid') {
         sections[index] = {
           type,

package/packages/storefront/src/lib/scripts/firestore.ts

@@ -0,0 +1,27 @@
+import { getFirestore, collection, addDoc } from 'firebase/firestore/lite';
+import { initializeAppCheck, ReCaptchaV3Provider } from 'firebase/app-check';
+import firebaseApp from './firebase-app';
+
+const firestore = getFirestore(firebaseApp);
+if (window.$reCaptchaSiteKey) {
+  initializeAppCheck(firebaseApp, {
+    provider: new ReCaptchaV3Provider(window.$reCaptchaSiteKey),
+    isTokenAutoRefreshEnabled: true,
+  });
+}
+
+export default firestore;
+
+export {
+  firestore,
+  collection,
+  addDoc,
+};
+
+export const getFormCollRef = (form: string) => {
+  return collection(firestore, `forms/p/${form}`);
+};
+
+export const addFormDoc = (form: string, data: Record<string, any>) => {
+  return addDoc(getFormCollRef(form), data);
+};