@cimplify/cli 0.7.2 → 0.7.3

package/templates/storefront-services/app/auth/session/route.ts

@@ -0,0 +1,11 @@
+import { handleSessionRequest } from "@cimplify/sdk/server";
+
+const CLIENT_ID = process.env.CIMPLIFY_CLIENT_ID ?? "";
+const AUTH_URL = process.env.CIMPLIFY_AUTH_URL;
+
+export async function GET(req: Request): Promise<Response> {
+  if (!CLIENT_ID) {
+    return Response.json({ sub: null }, { status: 200 });
+  }
+  return handleSessionRequest(req, { clientId: CLIENT_ID, authUrl: AUTH_URL });
+}

package/templates/storefront-services/app/auth/signout/route.ts

@@ -0,0 +1,11 @@
+import { buildSignoutCookie } from "@cimplify/sdk/server";
+
+const CLIENT_ID = process.env.CIMPLIFY_CLIENT_ID ?? "";
+
+export async function POST(): Promise<Response> {
+  const cookie = buildSignoutCookie({ clientId: CLIENT_ID });
+  return new Response(JSON.stringify({ ok: true }), {
+    status: 200,
+    headers: { "Content-Type": "application/json", "Set-Cookie": cookie },
+  });
+}

package/templates/storefront-services/components/account-iframe.tsx

@@ -1,13 +1,19 @@
 "use client";
 
 import { CimplifyAccount } from "@cimplify/sdk/react";
+import { brand } from "@/lib/brand";
 
 /**
  * Cimplify Account portal — iframe-mounted UI hosted by Cimplify Link.
  * Handles sign-in, sign-up, OTP, addresses, payment methods, sessions,
  * and order history. The iframe owns auth state; we just choose which
  * `section` to land on.
+ *
+ * `merchantName` is passed so the embedded widget can render scoping
+ * affordances ("Showing your account with {merchant} only.") and
+ * enforce the per-merchant data contract — orders/subs filter to this
+ * business, cross-merchant surfaces are hidden.
  */
 export function AccountIframe({ section }: { section?: string }) {
-  return <CimplifyAccount section={section} />;
+  return <CimplifyAccount section={section} merchantName={brand.name} />;
 }

package/templates/storefront-services/components/account-pill.tsx

@@ -0,0 +1,56 @@
+"use client";
+
+import { useEffect, useRef } from "react";
+import Link from "next/link";
+import { CimplifySignInButton, useCimplifySession } from "@cimplify/sdk/react";
+import { signInSilent } from "@cimplify/sdk";
+
+const CLIENT_ID = process.env.NEXT_PUBLIC_CIMPLIFY_CLIENT_ID ?? "";
+
+/**
+ * Header sign-in / signed-in pill.
+ *
+ * - Tries cross-storefront SSO once on mount. If the shopper signed
+ *   into any other Cimplify storefront recently, this resolves
+ *   silently and the session lands without any UI flicker.
+ * - When signed in, renders "Hi, {name}" linking to /account.
+ * - When not signed in, renders the Cimplify Sign-In button.
+ */
+export function AccountPill() {
+  const { session, loading, refresh } = useCimplifySession();
+  const triedSilent = useRef(false);
+
+  useEffect(() => {
+    if (triedSilent.current || session || !CLIENT_ID) return;
+    triedSilent.current = true;
+    void signInSilent({
+      clientId: CLIENT_ID,
+      redirectUri: `${window.location.origin}/auth/callback`,
+    }).then((r) => {
+      if (r.ok) refresh();
+    });
+  }, [session, refresh]);
+
+  if (loading || !CLIENT_ID) return <span className="h-9 w-24" aria-hidden />;
+
+  if (session) {
+    const first = session.name?.split(/\s+/)[0] ?? "Account";
+    return (
+      <Link
+        href="/account"
+        className="text-[13px] font-medium tracking-wide text-foreground hover:text-primary transition-colors"
+      >
+        Hi, {first}
+      </Link>
+    );
+  }
+
+  return (
+    <CimplifySignInButton
+      clientId={CLIENT_ID}
+      redirectUri={`${typeof window !== "undefined" ? window.location.origin : ""}/auth/callback`}
+      variant="text"
+      onSuccess={() => refresh()}
+    />
+  );
+}

package/templates/storefront-services/components/header.tsx

@@ -3,6 +3,7 @@ import { Suspense } from "react";
 import { NavLink } from "./nav-link";
 import { CartPill, CartPillSkeleton } from "./cart-pill";
 import { MobileNav } from "./mobile-nav";
+import { AccountPill } from "./account-pill";
 import { brand } from "@/lib/brand";
 
 /**
@@ -29,6 +30,7 @@ export function Header() {
             </Suspense>
           ))}
         </nav>
+        <AccountPill />
         <Suspense fallback={<CartPillSkeleton />}>
           <CartPill />
         </Suspense>

package/templates/storefront-services/lib/auth.ts

@@ -0,0 +1,16 @@
+import { headers } from "next/headers";
+import { getSessionFromCookieHeader, type CimplifySession } from "@cimplify/sdk/server";
+
+const CLIENT_ID = process.env.CIMPLIFY_CLIENT_ID ?? "";
+const AUTH_URL = process.env.CIMPLIFY_AUTH_URL;
+
+export async function getSession(): Promise<CimplifySession | null> {
+  if (!CLIENT_ID) return null;
+  const cookieHeader = (await headers()).get("cookie");
+  return getSessionFromCookieHeader(
+    { clientId: CLIENT_ID, authUrl: AUTH_URL },
+    cookieHeader,
+  );
+}
+
+export type { CimplifySession } from "@cimplify/sdk/server";

package/templates/storefront-services/package.json

@@ -17,7 +17,7 @@
     "check": "bun run typecheck && bun run test:run"
   },
   "dependencies": {
-    "@cimplify/sdk": "^0.54.0",
+    "@cimplify/sdk": "^0.55.0",
     "next": "^16.2.6",
     "react": "^19.0.0",
     "react-dom": "^19.0.0"