@cimplify/sdk 0.40.1 → 0.42.0

package/templates/storefront-bakery/app/contact/contact-form.tsx

@@ -0,0 +1,109 @@
+"use client";
+
+import { useState } from "react";
+
+/**
+ * Local-only contact form. On submit, fakes a successful response so the
+ * template ships a usable interaction. Wire to a real handler (Server
+ * Action posting to your CRM, support inbox, or Cimplify Support API)
+ * before going to production.
+ */
+export function ContactForm({ reasons }: { reasons: string[] }) {
+  const [submitted, setSubmitted] = useState(false);
+  const [reason, setReason] = useState(reasons[0] ?? "");
+
+  if (submitted) {
+    return (
+      <div className="rounded-2xl border border-border bg-card p-8">
+        <p className="text-[11px] font-semibold uppercase tracking-[0.16em] text-primary mb-2">
+          ✓ Sent
+        </p>
+        <h2 className="font-serif text-2xl font-semibold mb-2">Thanks — we'll be in touch.</h2>
+        <p className="text-muted-foreground">
+          We respond within one business day. Check your spam folder if you don't see a
+          reply by tomorrow.
+        </p>
+      </div>
+    );
+  }
+
+  return (
+    <form
+      onSubmit={(e) => {
+        e.preventDefault();
+        setSubmitted(true);
+      }}
+      className="space-y-5"
+    >
+      <div className="grid grid-cols-1 sm:grid-cols-2 gap-4">
+        <Field label="Your name" name="name" required />
+        <Field label="Email" name="email" type="email" required />
+      </div>
+      <div>
+        <label className="text-xs font-semibold uppercase tracking-wider text-muted-foreground block mb-1.5">
+          What's it about?
+        </label>
+        <select
+          name="reason"
+          value={reason}
+          onChange={(e) => setReason(e.target.value)}
+          className="w-full px-4 py-2.5 rounded-md bg-background border border-border focus:border-primary focus:ring-2 focus:ring-primary/20 outline-none text-sm"
+        >
+          {reasons.map((r) => (
+            <option key={r} value={r}>
+              {r}
+            </option>
+          ))}
+        </select>
+      </div>
+      <Field label="Order number (optional)" name="order" />
+      <div>
+        <label className="text-xs font-semibold uppercase tracking-wider text-muted-foreground block mb-1.5">
+          Message
+        </label>
+        <textarea
+          name="message"
+          required
+          rows={6}
+          className="w-full px-4 py-2.5 rounded-md bg-background border border-border focus:border-primary focus:ring-2 focus:ring-primary/20 outline-none text-sm resize-y"
+        />
+      </div>
+      <button
+        type="submit"
+        className="inline-flex items-center justify-center px-5 py-3 rounded-md bg-primary text-primary-foreground font-semibold text-sm hover:bg-primary/90 transition-colors"
+      >
+        Send message
+      </button>
+    </form>
+  );
+}
+
+function Field({
+  label,
+  name,
+  type = "text",
+  required,
+}: {
+  label: string;
+  name: string;
+  type?: string;
+  required?: boolean;
+}) {
+  return (
+    <div>
+      <label
+        htmlFor={name}
+        className="text-xs font-semibold uppercase tracking-wider text-muted-foreground block mb-1.5"
+      >
+        {label}
+      </label>
+      <input
+        id={name}
+        name={name}
+        type={type}
+        required={required}
+        className="w-full px-4 py-2.5 rounded-md bg-background border border-border focus:border-primary focus:ring-2 focus:ring-primary/20 outline-none text-sm"
+      />
+    </div>
+  );
+}

package/templates/storefront-bakery/app/contact/page.tsx

@@ -0,0 +1,54 @@
+import type { Metadata } from "next";
+import { ContactForm } from "./contact-form";
+import { brand } from "@/lib/brand";
+
+export const metadata: Metadata = {
+  title: `Contact — ${brand.name}`,
+  description: brand.contactPage.body,
+};
+
+export default function ContactPage() {
+  const c = brand.contactPage;
+  return (
+    <article className="max-w-5xl mx-auto px-6 sm:px-8 py-16">
+      <p className="text-[11px] font-semibold uppercase tracking-[0.16em] text-primary mb-2">
+        {c.eyebrow}
+      </p>
+      <h1 className="font-serif text-[clamp(2.25rem,5vw,3.5rem)] font-semibold mb-4 -tracking-[0.02em]">
+        {c.title}
+      </h1>
+      <p className="text-lg text-muted-foreground max-w-2xl mb-12 leading-relaxed">{c.body}</p>
+
+      <div className="grid grid-cols-1 lg:grid-cols-[1.5fr_1fr] gap-10 items-start">
+        <ContactForm reasons={c.reasons} />
+        <aside className="space-y-5 lg:pl-10 lg:border-l border-border">
+          <div>
+            <p className="text-[11px] font-semibold uppercase tracking-[0.16em] text-muted-foreground mb-3">
+              Direct lines
+            </p>
+            <ul className="space-y-3 list-none p-0 m-0">
+              {c.directLines.map((line) => (
+                <li key={line.label}>
+                  <p className="text-xs text-muted-foreground m-0">{line.label}</p>
+                  <a
+                    href={line.href}
+                    className="text-foreground hover:text-primary transition-colors"
+                  >
+                    {line.value}
+                  </a>
+                </li>
+              ))}
+            </ul>
+          </div>
+          <div>
+            <p className="text-[11px] font-semibold uppercase tracking-[0.16em] text-muted-foreground mb-3">
+              Visit
+            </p>
+            <p className="text-foreground m-0">{brand.contact.address}</p>
+            <p className="text-xs text-muted-foreground mt-1">{brand.contact.hours}</p>
+          </div>
+        </aside>
+      </div>
+    </article>
+  );
+}

package/templates/storefront-bakery/app/error.tsx

@@ -0,0 +1,60 @@
+"use client";
+
+import { useEffect } from "react";
+import Link from "next/link";
+
+/**
+ * Root error boundary. Next.js calls this whenever a thrown error escapes
+ * a Server Component without being caught by a closer `error.tsx`.
+ *
+ * Wire `reportError` (Sentry, Datadog, etc.) here so production failures
+ * surface — silently recovering hides real bugs.
+ */
+export default function GlobalError({
+  error,
+  reset,
+}: {
+  error: Error & { digest?: string };
+  reset: () => void;
+}) {
+  useEffect(() => {
+    // TODO: replace with your error reporter
+    // eslint-disable-next-line no-console
+    console.error("Storefront error:", error);
+  }, [error]);
+
+  return (
+    <section className="max-w-2xl mx-auto px-8 py-20 text-center">
+      <p className="text-[11px] font-semibold uppercase tracking-[0.16em] text-primary mb-3">
+        Something broke
+      </p>
+      <h1 className="font-serif text-[clamp(2rem,4vw,2.75rem)] font-semibold mb-4">
+        That wasn&apos;t supposed to happen.
+      </h1>
+      <p className="text-muted-foreground leading-relaxed mb-8">
+        We&apos;ve been notified. Refresh the page, or head back home —
+        most of the time the second try just works.
+      </p>
+      {error.digest && (
+        <p className="text-xs font-mono text-muted-foreground mb-6">
+          Reference: <code className="text-foreground">{error.digest}</code>
+        </p>
+      )}
+      <div className="flex flex-wrap items-center justify-center gap-3">
+        <button
+          type="button"
+          onClick={reset}
+          className="inline-block px-6 py-3 rounded-full bg-primary text-primary-foreground font-semibold text-sm transition-colors hover:bg-primary/90"
+        >
+          Try again
+        </button>
+        <Link
+          href="/"
+          className="inline-block px-6 py-3 rounded-full border border-border hover:bg-muted transition-colors text-sm font-medium"
+        >
+          Back home
+        </Link>
+      </div>
+    </section>
+  );
+}

package/templates/storefront-bakery/app/faq/page.tsx

@@ -1,102 +1,23 @@
 import type { Metadata } from "next";
+import { brand } from "@/lib/brand";
 
 export const metadata: Metadata = {
-  title: "FAQ — Akua's Bakery",
-  description:
-    "Delivery, pickup, custom cakes, allergens, payment — answers to the questions we hear most often.",
+  title: `FAQ — ${brand.name}`,
+  description: "Delivery, pickup, custom cakes, allergens, payment — answers to the questions we hear most often.",
 };
 
-interface QA {
-  q: string;
-  a: string;
-}
-
-const SECTIONS: { title: string; items: QA[] }[] = [
-  {
-    title: "Ordering & delivery",
-    items: [
-      {
-        q: "Where do you deliver?",
-        a: "Same-day delivery within Greater Accra for orders placed before 2pm. Outside Accra, we offer next-day shipping by partner courier — checkout will show the available options for your address.",
-      },
-      {
-        q: "Can I pick up my order?",
-        a: "Yes. Pickup is available 8am–8pm at our East Legon location, 12 Independence Avenue. Choose 'Pickup' at checkout and we'll have everything boxed and ready when you arrive.",
-      },
-      {
-        q: "How quickly will my order arrive?",
-        a: "Same-day delivery typically arrives within 2–4 hours of order confirmation. You'll get an SMS when the rider is en route.",
-      },
-      {
-        q: "Do you offer subscriptions?",
-        a: "Yes — our Weekly Loaf Subscription delivers a fresh loaf to your door every week. Pause or skip any time. See the Classes & Stays category for details.",
-      },
-    ],
-  },
-  {
-    title: "Custom cakes & celebrations",
-    items: [
-      {
-        q: "How much notice do you need for a custom cake?",
-        a: "48 hours minimum for tier cakes; 7 days for elaborate designs with sugar work or fondant figures. Book a free Custom Cake Consultation to walk through flavours, sizes, and decoration.",
-      },
-      {
-        q: "Can I bring my own design?",
-        a: "Absolutely — send us a reference image and we'll quote what's possible within your timeline and budget.",
-      },
-      {
-        q: "Do you do wedding cakes?",
-        a: "We do, with at least 6 weeks' notice. Tasting sessions are GH₵150 and credited toward your final order.",
-      },
-    ],
-  },
-  {
-    title: "Allergens & ingredients",
-    items: [
-      {
-        q: "Is your kitchen allergen-free?",
-        a: "No. Our kitchen handles wheat, dairy, eggs, and tree nuts. Cross-contamination is possible. Please let us know about severe allergies before ordering — we'll be honest about whether we can safely accommodate them.",
-      },
-      {
-        q: "Do you have vegan options?",
-        a: "Yes. The country sourdough, whole-wheat seed loaf, baguette, and most of the breads are vegan. The hibiscus drink (Sobolo) and orange juice are also vegan.",
-      },
-      {
-        q: "Where does your flour come from?",
-        a: "We mill our own heritage wheat flour from the Volta Region. The 25kg sack is available in our Merch & More category for home bakers and trade customers.",
-      },
-    ],
-  },
-  {
-    title: "Payment & returns",
-    items: [
-      {
-        q: "What payment methods do you accept?",
-        a: "Mobile Money (MTN, Telecel, AirtelTigo), Visa/Mastercard, and cash on delivery for Accra-based orders.",
-      },
-      {
-        q: "What's your return policy?",
-        a: "We don't accept returns on baked goods for food-safety reasons, but if anything is wrong with your order — quality, accuracy, or freshness — message us within 24 hours and we'll make it right or refund you.",
-      },
-      {
-        q: "Do you offer wholesale pricing?",
-        a: "Yes — our Heritage Flour 25kg sack ships with quantity-tier pricing, and we'd love to talk if you run a café or restaurant. Email hello@akuasbakery.test.",
-      },
-    ],
-  },
-];
-
 export default function FaqPage() {
+  const f = brand.faq;
   return (
     <article className="max-w-3xl mx-auto px-8 py-16">
       <p className="text-[11px] font-semibold uppercase tracking-[0.16em] text-primary mb-2">
-        Frequently asked
+        {f.eyebrow}
       </p>
       <h1 className="font-serif text-[clamp(2.25rem,5vw,3.5rem)] font-semibold mb-10 -tracking-[0.02em]">
-        Questions, answered.
+        {f.title}
       </h1>
       <div className="space-y-12">
-        {SECTIONS.map((section) => (
+        {f.sections.map((section) => (
           <section key={section.title}>
             <h2 className="font-serif text-2xl font-semibold mb-5">{section.title}</h2>
             <dl className="space-y-6">
@@ -111,9 +32,12 @@ export default function FaqPage() {
         ))}
       </div>
       <p className="mt-12 pt-8 border-t border-border text-sm text-muted-foreground">
-        Still stuck? Email{" "}
-        <a href="mailto:hello@akuasbakery.test" className="text-primary font-semibold hover:underline">
-          hello@akuasbakery.test
+        {f.contactPrompt}{" "}
+        <a
+          href={`mailto:${f.contactEmail}`}
+          className="text-primary font-semibold hover:underline"
+        >
+          {f.contactEmail}
         </a>{" "}
         and a real human will reply within 24 hours.
       </p>

package/templates/storefront-bakery/app/layout.tsx

@@ -6,6 +6,7 @@ import { Header } from "@/components/header";
 import { Footer } from "@/components/footer";
 import { ProductModal } from "@/components/product-modal";
 import { Suspense } from "react";
+import { brand } from "@/lib/brand";
 
 const inter = Inter({
   subsets: ["latin"],
@@ -19,9 +20,39 @@ const playfair = Playfair_Display({
   display: "swap",
 });
 
+const SITE_URL =
+  process.env.NEXT_PUBLIC_SITE_URL?.trim() || "https://example.com";
+
 export const metadata: Metadata = {
-  title: "Akua's Bakery",
-  description: "Sourdough, croissants, cakes, and more — handcrafted in East Legon, delivered across Accra.",
+  metadataBase: new URL(SITE_URL),
+  title: {
+    default: brand.name,
+    template: `%s — ${brand.name}`,
+  },
+  description: brand.description,
+  openGraph: {
+    type: "website",
+    siteName: brand.name,
+    locale: brand.locale,
+  },
+  twitter: { card: "summary_large_image" },
+};
+
+const ORGANIZATION_LD = {
+  "@context": "https://schema.org",
+  "@type": brand.schemaType,
+  name: brand.name,
+  url: SITE_URL,
+  description: brand.description,
+  email: brand.contact.email,
+  telephone: brand.contact.phoneTel,
+  address: {
+    "@type": "PostalAddress",
+    streetAddress: brand.contact.streetAddress,
+    addressLocality: brand.contact.city,
+    addressCountry: brand.contact.countryCode,
+  },
+  sameAs: brand.socials.map((s) => s.href),
 };
 
 export default function RootLayout({ children }: { children: React.ReactNode }) {
@@ -31,6 +62,10 @@ export default function RootLayout({ children }: { children: React.ReactNode })
         suppressHydrationWarning
         className="min-h-screen flex flex-col bg-background text-foreground font-sans"
       >
+        <script
+          type="application/ld+json"
+          dangerouslySetInnerHTML={{ __html: JSON.stringify(ORGANIZATION_LD) }}
+        />
         <Providers>
           <Header />
           <main className="flex-1 pb-12 w-full">{children}</main>

package/templates/storefront-bakery/app/llms.txt/route.ts

@@ -0,0 +1,94 @@
+import { cacheTag, cacheLife } from "next/cache";
+import { getServerClient, tags, type Product } from "@cimplify/sdk/server";
+import { brand } from "@/lib/brand";
+
+const SITE_URL =
+  process.env.NEXT_PUBLIC_SITE_URL?.trim() || "https://example.com";
+
+async function buildLlmsTxt(): Promise<string> {
+  "use cache";
+  cacheTag(tags.products(), tags.categories(), tags.collections());
+  cacheLife("hours");
+
+  const client = getServerClient();
+  const [productsRes, categoriesRes, collectionsRes] = await Promise.all([
+    client.catalogue.getProducts({ limit: 500 }),
+    client.catalogue.getCategories(),
+    client.catalogue.getCollections(),
+  ]);
+
+  const products: Product[] = productsRes.ok ? productsRes.value.items : [];
+  const categories = categoriesRes.ok ? categoriesRes.value : [];
+  const collections = collectionsRes.ok ? collectionsRes.value : [];
+
+  const lines: string[] = [];
+  lines.push(`# ${brand.name}`);
+  lines.push("");
+  lines.push(`> ${brand.llms.summary}`);
+  lines.push("");
+  lines.push("## Browse");
+  lines.push(`- [Home](${SITE_URL}/)`);
+  lines.push(`- [Shop](${SITE_URL}/shop): Full menu with filter and sort.`);
+
+  if (categories.length > 0) {
+    lines.push("");
+    lines.push("## Categories");
+    for (const c of categories) {
+      lines.push(
+        `- [${c.name}](${SITE_URL}/categories/${c.slug})${c.description ? `: ${c.description}` : ""}`,
+      );
+    }
+  }
+
+  if (collections.length > 0) {
+    lines.push("");
+    lines.push("## Collections");
+    for (const c of collections) {
+      lines.push(
+        `- [${c.name}](${SITE_URL}/collections/${c.slug})${c.description ? `: ${c.description}` : ""}`,
+      );
+    }
+  }
+
+  if (products.length > 0) {
+    lines.push("");
+    lines.push("## Products");
+    for (const p of products) {
+      const slug = p.slug ?? p.id;
+      const price = `${p.currency ?? brand.currency} ${p.default_price}`;
+      const desc = p.description ? ` — ${p.description.replace(/\s+/g, " ").slice(0, 200)}` : "";
+      lines.push(`- [${p.name}](${SITE_URL}/shop?product=${slug}) (${price})${desc}`);
+    }
+  }
+
+  lines.push("");
+  lines.push("## Information");
+  lines.push(`- [About](${SITE_URL}/about)`);
+  lines.push(`- [FAQ](${SITE_URL}/faq)`);
+  lines.push(`- [Terms of Service](${SITE_URL}/terms)`);
+  lines.push(`- [Privacy Policy](${SITE_URL}/privacy)`);
+  lines.push(`- [Sitemap (XML)](${SITE_URL}/sitemap.xml)`);
+  lines.push("");
+  lines.push("## Contact");
+  lines.push(`- Email: ${brand.contact.email}`);
+  lines.push(`- Phone: ${brand.contact.phone}`);
+  lines.push(`- Address: ${brand.contact.address}`);
+
+  return lines.join("\n") + "\n";
+}
+
+/**
+ * `/llms.txt` — machine-readable site index for LLMs (per llmstxt.org).
+ * Lets coding agents and chat assistants find products, categories, and
+ * support pages without scraping HTML. Plain Markdown so it streams cheaply
+ * into context windows.
+ */
+export async function GET(): Promise<Response> {
+  const body = await buildLlmsTxt();
+  return new Response(body, {
+    headers: {
+      "Content-Type": "text/plain; charset=utf-8",
+      "Cache-Control": "public, max-age=0, s-maxage=3600, stale-while-revalidate=86400",
+    },
+  });
+}

package/templates/storefront-bakery/app/login/page.tsx

@@ -0,0 +1,17 @@
+import type { Metadata } from "next";
+import { redirect } from "next/navigation";
+import { brand } from "@/lib/brand";
+
+export const metadata: Metadata = {
+  title: `Sign in — ${brand.name}`,
+  description: brand.account.loginSubtitle,
+};
+
+/**
+ * Cimplify Link (the iframe in `<CimplifyAccount>`) handles sign-in
+ * automatically when no session exists. We just bounce /login to /account
+ * so consumers landing here get the right UI without a duplicate form.
+ */
+export default function LoginPage(): never {
+  redirect("/account");
+}

package/templates/storefront-bakery/app/not-found.tsx

@@ -0,0 +1,39 @@
+import type { Metadata } from "next";
+import Link from "next/link";
+import { brand } from "@/lib/brand";
+
+export const metadata: Metadata = {
+  title: `Page not found — ${brand.name}`,
+  description: "We couldn't find that page.",
+};
+
+export default function NotFound() {
+  return (
+    <section className="max-w-2xl mx-auto px-8 py-20 text-center">
+      <p className="text-[11px] font-semibold uppercase tracking-[0.16em] text-primary mb-3">
+        404
+      </p>
+      <h1 className="font-serif text-[clamp(2.5rem,5vw,3.5rem)] font-semibold mb-4">
+        Page not found.
+      </h1>
+      <p className="text-muted-foreground leading-relaxed mb-8">
+        The URL you followed might be old, a typo, or pointing at a product
+        that&apos;s sold out for the day. Try the menu or head back home.
+      </p>
+      <div className="flex flex-wrap items-center justify-center gap-3">
+        <Link
+          href="/shop"
+          className="inline-block px-6 py-3 rounded-full bg-primary text-primary-foreground font-semibold text-sm transition-colors hover:bg-primary/90"
+        >
+          Browse the menu
+        </Link>
+        <Link
+          href="/"
+          className="inline-block px-6 py-3 rounded-full border border-border hover:bg-muted transition-colors text-sm font-medium"
+        >
+          Back home
+        </Link>
+      </div>
+    </section>
+  );
+}

package/templates/storefront-bakery/app/opensearch.xml/route.ts

@@ -0,0 +1,37 @@
+import { brand } from "@/lib/brand";
+
+const SITE_URL =
+  process.env.NEXT_PUBLIC_SITE_URL?.trim() || "https://example.com";
+
+/**
+ * OpenSearch description document — lets browsers add this site to the
+ * address bar's search engine list. When users press Tab after typing the
+ * domain, they get an inline search box that hits /search?q=...
+ */
+export async function GET(): Promise<Response> {
+  const xml = `<?xml version="1.0" encoding="UTF-8"?>
+<OpenSearchDescription xmlns="http://a9.com/-/spec/opensearch/1.1/">
+  <ShortName>${escapeXml(brand.shortName)}</ShortName>
+  <Description>Search ${escapeXml(brand.name)}</Description>
+  <InputEncoding>UTF-8</InputEncoding>
+  <Url type="text/html" method="get" template="${SITE_URL}/search?q={searchTerms}" />
+  <Url type="application/opensearchdescription+xml" rel="self" template="${SITE_URL}/opensearch.xml" />
+  <moz:SearchForm>${SITE_URL}/search</moz:SearchForm>
+</OpenSearchDescription>
+`;
+  return new Response(xml, {
+    headers: {
+      "Content-Type": "application/opensearchdescription+xml; charset=utf-8",
+      "Cache-Control": "public, max-age=86400",
+    },
+  });
+}
+
+function escapeXml(s: string): string {
+  return s
+    .replace(/&/g, "&amp;")
+    .replace(/</g, "&lt;")
+    .replace(/>/g, "&gt;")
+    .replace(/"/g, "&quot;")
+    .replace(/'/g, "&apos;");
+}

package/templates/storefront-bakery/app/page.tsx

@@ -5,11 +5,11 @@ import { getServerClient, tags, type Product } from "@cimplify/sdk/server";
 import { Hero } from "@/components/hero";
 import { CollectionStrip } from "@/components/collection-strip";
 import { CategoryGrid } from "@/components/category-grid";
+import { brand } from "@/lib/brand";
 
 export const metadata: Metadata = {
-  title: "Akua's Bakery — Fresh from the oven, every day",
-  description:
-    "Sourdough, croissants, cakes, and more — handcrafted in East Legon, delivered across Accra.",
+  title: `${brand.name} — ${brand.hero.title}`,
+  description: brand.description,
 };
 
 async function getHomeData() {
@@ -47,9 +47,9 @@ export default async function HomePage() {
   return (
     <>
       <Hero
-        badge="BAKERY · PÂTISSERIE · COFFEE"
-        title="Fresh from the oven, every day."
-        subtitle="Sourdough, croissants, cakes, and more — handcrafted in East Legon, delivered across Accra."
+        badge={brand.hero.badge}
+        title={brand.hero.title}
+        subtitle={brand.hero.subtitle}
       />
       {collections.map(({ collection, products }) => (
         <Suspense