@cimplify/cli 0.7.2 → 0.7.4

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

@@ -0,0 +1,35 @@
+import { headers } from "next/headers";
+import {
+  getAccessTokenFromCookieHeader,
+  getServerClient,
+  getSessionFromCookieHeader,
+  type CimplifyClient,
+  type CimplifySession,
+} from "@cimplify/sdk/server";
+
+const CLIENT_ID = process.env.CIMPLIFY_CLIENT_ID ?? "";
+const AUTH_URL = process.env.CIMPLIFY_AUTH_URL;
+
+const oidcConfig = { clientId: CLIENT_ID, authUrl: AUTH_URL };
+
+export async function getSession(): Promise<CimplifySession | null> {
+  if (!CLIENT_ID) return null;
+  const cookieHeader = (await headers()).get("cookie");
+  return getSessionFromCookieHeader(oidcConfig, cookieHeader);
+}
+
+// Returns a Cimplify server client with the signed-in customer's access
+// token attached (if any). Use this instead of getServerClient() on pages
+// that need personalized data: orders, subscriptions, price-list pricing.
+// Pages without `revalidate: 0` will share a cache across customers, so
+// only use this on routes that opt out of static caching.
+export async function getAuthenticatedServerClient(): Promise<CimplifyClient> {
+  const cookieHeader = (await headers()).get("cookie");
+  const accessToken =
+    CLIENT_ID && cookieHeader
+      ? getAccessTokenFromCookieHeader(oidcConfig, cookieHeader) ?? undefined
+      : undefined;
+  return getServerClient({ accessToken });
+}
+
+export type { CimplifySession } from "@cimplify/sdk/server";

package/templates/storefront-retail/package.json

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

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

@@ -0,0 +1,16 @@
+import { handleOidcCallback } from "@cimplify/sdk/server";
+
+const CLIENT_ID = process.env.CIMPLIFY_CLIENT_ID ?? "";
+const AUTH_URL = process.env.CIMPLIFY_AUTH_URL;
+const REDIRECT_URI = process.env.CIMPLIFY_REDIRECT_URI ?? "";
+
+export async function POST(req: Request): Promise<Response> {
+  if (!CLIENT_ID || !REDIRECT_URI) {
+    return Response.json({ error: "oidc_not_configured" }, { status: 500 });
+  }
+  return handleOidcCallback(req, {
+    clientId: CLIENT_ID,
+    authUrl: AUTH_URL,
+    redirectUri: REDIRECT_URI,
+  });
+}

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 { buildSignoutCookies } from "@cimplify/sdk/server";
+
+const CLIENT_ID = process.env.CIMPLIFY_CLIENT_ID ?? "";
+
+export async function POST(): Promise<Response> {
+  const headers = new Headers({ "Content-Type": "application/json" });
+  for (const cookie of buildSignoutCookies({ clientId: CLIENT_ID })) {
+    headers.append("Set-Cookie", cookie);
+  }
+  return new Response(JSON.stringify({ ok: true }), { status: 200, headers });
+}

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,49 @@
+"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 ?? "";
+
+// Attempts silent SSO on mount before showing the button so returning
+// shoppers don't see a flash of "Sign in" before landing as signed in.
+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,35 @@
+import { headers } from "next/headers";
+import {
+  getAccessTokenFromCookieHeader,
+  getServerClient,
+  getSessionFromCookieHeader,
+  type CimplifyClient,
+  type CimplifySession,
+} from "@cimplify/sdk/server";
+
+const CLIENT_ID = process.env.CIMPLIFY_CLIENT_ID ?? "";
+const AUTH_URL = process.env.CIMPLIFY_AUTH_URL;
+
+const oidcConfig = { clientId: CLIENT_ID, authUrl: AUTH_URL };
+
+export async function getSession(): Promise<CimplifySession | null> {
+  if (!CLIENT_ID) return null;
+  const cookieHeader = (await headers()).get("cookie");
+  return getSessionFromCookieHeader(oidcConfig, cookieHeader);
+}
+
+// Returns a Cimplify server client with the signed-in customer's access
+// token attached (if any). Use this instead of getServerClient() on pages
+// that need personalized data: orders, subscriptions, price-list pricing.
+// Pages without `revalidate: 0` will share a cache across customers, so
+// only use this on routes that opt out of static caching.
+export async function getAuthenticatedServerClient(): Promise<CimplifyClient> {
+  const cookieHeader = (await headers()).get("cookie");
+  const accessToken =
+    CLIENT_ID && cookieHeader
+      ? getAccessTokenFromCookieHeader(oidcConfig, cookieHeader) ?? undefined
+      : undefined;
+  return getServerClient({ accessToken });
+}
+
+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.56.0",
     "next": "^16.2.6",
     "react": "^19.0.0",
     "react-dom": "^19.0.0"