@cimplify/cli 0.7.15 → 0.7.17

package/templates/storefront-pharmacy/app/account/orders/[id]/page.tsx

@@ -0,0 +1,42 @@
+import { notFound } from "next/navigation";
+import { AccountSignedOutPrompt, toAccountOrderView } from "@cimplify/sdk/react";
+import type { EnrichedOrder } from "@cimplify/sdk";
+import { brand } from "@/lib/brand";
+import { apiFetch, serverAccessToken, serverSession } from "@/lib/cimplify-server";
+import { OrderDetail } from "@/components/order-detail";
+
+const CLIENT_ID = process.env.NEXT_PUBLIC_CIMPLIFY_CLIENT_ID ?? "";
+const REDIRECT_URI = process.env.CIMPLIFY_REDIRECT_URI ?? "";
+
+export default async function OrderDetailPage({
+  params,
+}: {
+  params: Promise<{ id: string }>;
+}) {
+  const { id } = await params;
+
+  const session = await serverSession();
+  if (!session) {
+    return (
+      <AccountSignedOutPrompt
+        clientId={CLIENT_ID}
+        redirectUri={REDIRECT_URI}
+        eyebrow={brand.account.loginEyebrow}
+        title={brand.account.loginTitle}
+        description={brand.account.loginSubtitle}
+      />
+    );
+  }
+
+  const bearer = await serverAccessToken();
+  const order = await apiFetch<EnrichedOrder>(`/api/v1/orders/${encodeURIComponent(id)}`, {
+    bearer,
+  });
+  if (!order) notFound();
+
+  return (
+    <div className="mx-auto w-full max-w-5xl px-4 py-8 sm:px-6">
+      <OrderDetail {...toAccountOrderView(order)} />
+    </div>
+  );
+}

package/templates/storefront-pharmacy/app/sitemap-page/page.tsx

@@ -54,8 +54,6 @@ const STATIC_LINKS: { title: string; links: { href: string; label: string }[] }[
     links: [
       { href: "/account", label: "Account" },
       { href: "/account/orders", label: "Orders" },
-      { href: "/account/addresses", label: "Addresses" },
-      { href: "/account/wallets", label: "Wallets" },
       { href: "/login", label: "Sign in" },
       { href: "/signup", label: "Create account" },
       { href: "/track-order", label: "Track an order" },

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

@@ -1,8 +1,7 @@
 "use client";
 
 import { useEffect, useRef } from "react";
-import Link from "next/link";
-import { CimplifySignInButton, useCimplifySession } from "@cimplify/sdk/react";
+import { CimplifyUserButton, useCimplifySession } from "@cimplify/sdk/react";
 import { signInSilent } from "@cimplify/sdk";
 
 const CLIENT_ID = process.env.NEXT_PUBLIC_CIMPLIFY_CLIENT_ID ?? "";
@@ -26,24 +25,12 @@ export function AccountPill() {
 
   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
+    <CimplifyUserButton
+      session={session}
       clientId={CLIENT_ID}
       redirectUri={`${typeof window !== "undefined" ? window.location.origin : ""}/auth/callback`}
-      variant="text"
-      onSuccess={() => refresh()}
+      onSignIn={refresh}
     />
   );
 }

package/templates/storefront-pharmacy/components/order-detail.tsx

@@ -0,0 +1,11 @@
+"use client";
+
+import { useRouter } from "next/navigation";
+import { AccountOrderView, type AccountOrderViewProps } from "@cimplify/sdk/react";
+
+// Thin client wrapper so the server page can pass the (serializable) view-model
+// while `onBack` (a function) is supplied on the client.
+export function OrderDetail(props: AccountOrderViewProps) {
+  const router = useRouter();
+  return <AccountOrderView {...props} onBack={() => router.push("/account/orders")} />;
+}

package/templates/storefront-pharmacy/lib/brand.ts

@@ -762,7 +762,6 @@ export const brand: Brand = {
           { label: "Sign in", href: "/login" },
           { label: "Create account", href: "/signup" },
           { label: "Your orders", href: "/account/orders" },
-          { label: "Wallets", href: "/account/wallets" },
         ],
       },
       {

package/templates/storefront-pharmacy/lib/cimplify-server.ts

@@ -8,8 +8,6 @@ import type { NavItem } from "@cimplify/sdk/react";
 export const ACCOUNT_NAV: NavItem[] = [
   { label: "Dashboard", href: "/account" },
   { label: "Orders", href: "/account/orders" },
-  { label: "Addresses", href: "/account/addresses" },
-  { label: "Wallets", href: "/account/wallets" },
   { label: "Cimplify identity", href: "https://link.cimplify.io", external: true },
 ];
 

package/templates/storefront-restaurant/AGENTS.md

@@ -33,8 +33,6 @@ app/
 
   account/page.tsx               <AccountDashboardPage /> (native, Server Component)
   account/orders/page.tsx        <AccountOrdersPage /> (native)
-  account/addresses/page.tsx     Native list + Server Actions for CRUD
-  account/wallets/page.tsx       Native list + Server Actions for CRUD
   login/page.tsx, signup/page.tsx  redirects → /account
 
   contact/page.tsx, track-order/page.tsx

package/templates/storefront-restaurant/app/account/orders/[id]/page.tsx

@@ -0,0 +1,42 @@
+import { notFound } from "next/navigation";
+import { AccountSignedOutPrompt, toAccountOrderView } from "@cimplify/sdk/react";
+import type { EnrichedOrder } from "@cimplify/sdk";
+import { brand } from "@/lib/brand";
+import { apiFetch, serverAccessToken, serverSession } from "@/lib/cimplify-server";
+import { OrderDetail } from "@/components/order-detail";
+
+const CLIENT_ID = process.env.NEXT_PUBLIC_CIMPLIFY_CLIENT_ID ?? "";
+const REDIRECT_URI = process.env.CIMPLIFY_REDIRECT_URI ?? "";
+
+export default async function OrderDetailPage({
+  params,
+}: {
+  params: Promise<{ id: string }>;
+}) {
+  const { id } = await params;
+
+  const session = await serverSession();
+  if (!session) {
+    return (
+      <AccountSignedOutPrompt
+        clientId={CLIENT_ID}
+        redirectUri={REDIRECT_URI}
+        eyebrow={brand.account.loginEyebrow}
+        title={brand.account.loginTitle}
+        description={brand.account.loginSubtitle}
+      />
+    );
+  }
+
+  const bearer = await serverAccessToken();
+  const order = await apiFetch<EnrichedOrder>(`/api/v1/orders/${encodeURIComponent(id)}`, {
+    bearer,
+  });
+  if (!order) notFound();
+
+  return (
+    <div className="mx-auto w-full max-w-5xl px-4 py-8 sm:px-6">
+      <OrderDetail {...toAccountOrderView(order)} />
+    </div>
+  );
+}

package/templates/storefront-restaurant/app/sitemap-page/page.tsx

@@ -54,8 +54,6 @@ const STATIC_LINKS: { title: string; links: { href: string; label: string }[] }[
     links: [
       { href: "/account", label: "Account" },
       { href: "/account/orders", label: "Orders" },
-      { href: "/account/addresses", label: "Addresses" },
-      { href: "/account/wallets", label: "Wallets" },
       { href: "/login", label: "Sign in" },
       { href: "/signup", label: "Create account" },
       { href: "/track-order", label: "Track an order" },

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

@@ -1,8 +1,7 @@
 "use client";
 
 import { useEffect, useRef } from "react";
-import Link from "next/link";
-import { CimplifySignInButton, useCimplifySession } from "@cimplify/sdk/react";
+import { CimplifyUserButton, useCimplifySession } from "@cimplify/sdk/react";
 import { signInSilent } from "@cimplify/sdk";
 
 const CLIENT_ID = process.env.NEXT_PUBLIC_CIMPLIFY_CLIENT_ID ?? "";
@@ -26,24 +25,12 @@ export function AccountPill() {
 
   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
+    <CimplifyUserButton
+      session={session}
       clientId={CLIENT_ID}
       redirectUri={`${typeof window !== "undefined" ? window.location.origin : ""}/auth/callback`}
-      variant="text"
-      onSuccess={() => refresh()}
+      onSignIn={refresh}
     />
   );
 }

package/templates/storefront-restaurant/components/order-detail.tsx

@@ -0,0 +1,11 @@
+"use client";
+
+import { useRouter } from "next/navigation";
+import { AccountOrderView, type AccountOrderViewProps } from "@cimplify/sdk/react";
+
+// Thin client wrapper so the server page can pass the (serializable) view-model
+// while `onBack` (a function) is supplied on the client.
+export function OrderDetail(props: AccountOrderViewProps) {
+  const router = useRouter();
+  return <AccountOrderView {...props} onBack={() => router.push("/account/orders")} />;
+}

package/templates/storefront-restaurant/lib/brand.ts

@@ -349,7 +349,6 @@ export const brand: Brand = {
           { label: "Sign in", href: "/login" },
           { label: "Create account", href: "/signup" },
           { label: "Your orders", href: "/account/orders" },
-          { label: "Wallets", href: "/account/wallets" },
         ],
       },
       {

package/templates/storefront-restaurant/lib/cimplify-server.ts

@@ -8,8 +8,6 @@ import type { NavItem } from "@cimplify/sdk/react";
 export const ACCOUNT_NAV: NavItem[] = [
   { label: "Dashboard", href: "/account" },
   { label: "Orders", href: "/account/orders" },
-  { label: "Addresses", href: "/account/addresses" },
-  { label: "Wallets", href: "/account/wallets" },
   { label: "Cimplify identity", href: "https://link.cimplify.io", external: true },
 ];
 

package/templates/storefront-retail/AGENTS.md

@@ -34,8 +34,6 @@ app/
 
   account/page.tsx               <AccountDashboardPage /> (native, Server Component)
   account/orders/page.tsx        <AccountOrdersPage /> (native)
-  account/addresses/page.tsx     Native list + Server Actions for CRUD
-  account/wallets/page.tsx       Native list + Server Actions for CRUD
   login/page.tsx, signup/page.tsx  redirects → /account
 
   contact/page.tsx               Branded contact form

package/templates/storefront-retail/app/account/orders/[id]/page.tsx

@@ -0,0 +1,42 @@
+import { notFound } from "next/navigation";
+import { AccountSignedOutPrompt, toAccountOrderView } from "@cimplify/sdk/react";
+import type { EnrichedOrder } from "@cimplify/sdk";
+import { brand } from "@/lib/brand";
+import { apiFetch, serverAccessToken, serverSession } from "@/lib/cimplify-server";
+import { OrderDetail } from "@/components/order-detail";
+
+const CLIENT_ID = process.env.NEXT_PUBLIC_CIMPLIFY_CLIENT_ID ?? "";
+const REDIRECT_URI = process.env.CIMPLIFY_REDIRECT_URI ?? "";
+
+export default async function OrderDetailPage({
+  params,
+}: {
+  params: Promise<{ id: string }>;
+}) {
+  const { id } = await params;
+
+  const session = await serverSession();
+  if (!session) {
+    return (
+      <AccountSignedOutPrompt
+        clientId={CLIENT_ID}
+        redirectUri={REDIRECT_URI}
+        eyebrow={brand.account.loginEyebrow}
+        title={brand.account.loginTitle}
+        description={brand.account.loginSubtitle}
+      />
+    );
+  }
+
+  const bearer = await serverAccessToken();
+  const order = await apiFetch<EnrichedOrder>(`/api/v1/orders/${encodeURIComponent(id)}`, {
+    bearer,
+  });
+  if (!order) notFound();
+
+  return (
+    <div className="mx-auto w-full max-w-5xl px-4 py-8 sm:px-6">
+      <OrderDetail {...toAccountOrderView(order)} />
+    </div>
+  );
+}

package/templates/storefront-retail/app/sitemap-page/page.tsx

@@ -54,8 +54,6 @@ const STATIC_LINKS: { title: string; links: { href: string; label: string }[] }[
     links: [
       { href: "/account", label: "Account" },
       { href: "/account/orders", label: "Orders" },
-      { href: "/account/addresses", label: "Addresses" },
-      { href: "/account/wallets", label: "Wallets" },
       { href: "/login", label: "Sign in" },
       { href: "/signup", label: "Create account" },
       { href: "/track-order", label: "Track an order" },

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

@@ -1,8 +1,7 @@
 "use client";
 
 import { useEffect, useRef } from "react";
-import Link from "next/link";
-import { CimplifySignInButton, useCimplifySession } from "@cimplify/sdk/react";
+import { CimplifyUserButton, useCimplifySession } from "@cimplify/sdk/react";
 import { signInSilent } from "@cimplify/sdk";
 
 const CLIENT_ID = process.env.NEXT_PUBLIC_CIMPLIFY_CLIENT_ID ?? "";
@@ -26,24 +25,12 @@ export function AccountPill() {
 
   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
+    <CimplifyUserButton
+      session={session}
       clientId={CLIENT_ID}
       redirectUri={`${typeof window !== "undefined" ? window.location.origin : ""}/auth/callback`}
-      variant="text"
-      onSuccess={() => refresh()}
+      onSignIn={refresh}
     />
   );
 }

package/templates/storefront-retail/components/order-detail.tsx

@@ -0,0 +1,11 @@
+"use client";
+
+import { useRouter } from "next/navigation";
+import { AccountOrderView, type AccountOrderViewProps } from "@cimplify/sdk/react";
+
+// Thin client wrapper so the server page can pass the (serializable) view-model
+// while `onBack` (a function) is supplied on the client.
+export function OrderDetail(props: AccountOrderViewProps) {
+  const router = useRouter();
+  return <AccountOrderView {...props} onBack={() => router.push("/account/orders")} />;
+}

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

@@ -636,7 +636,6 @@ export const brand: Brand = {
           { label: "Sign in", href: "/login" },
           { label: "Create account", href: "/signup" },
           { label: "Your orders", href: "/account/orders" },
-          { label: "Wallets", href: "/account/wallets" },
         ],
       },
       {

package/templates/storefront-retail/lib/cimplify-server.ts

@@ -8,8 +8,6 @@ import type { NavItem } from "@cimplify/sdk/react";
 export const ACCOUNT_NAV: NavItem[] = [
   { label: "Dashboard", href: "/account" },
   { label: "Orders", href: "/account/orders" },
-  { label: "Addresses", href: "/account/addresses" },
-  { label: "Wallets", href: "/account/wallets" },
   { label: "Cimplify identity", href: "https://link.cimplify.io", external: true },
 ];
 

package/templates/storefront-services/AGENTS.md

@@ -34,8 +34,6 @@ app/
 
   account/page.tsx               <AccountDashboardPage /> (native, Server Component)
   account/orders/page.tsx        <AccountOrdersPage /> (native)
-  account/addresses/page.tsx     Native list + Server Actions for CRUD
-  account/wallets/page.tsx       Native list + Server Actions for CRUD
   login/page.tsx, signup/page.tsx  redirects → /account
 
   contact/page.tsx, track-order/page.tsx (find a booking)

package/templates/storefront-services/app/account/orders/[id]/page.tsx

@@ -0,0 +1,42 @@
+import { notFound } from "next/navigation";
+import { AccountSignedOutPrompt, toAccountOrderView } from "@cimplify/sdk/react";
+import type { EnrichedOrder } from "@cimplify/sdk";
+import { brand } from "@/lib/brand";
+import { apiFetch, serverAccessToken, serverSession } from "@/lib/cimplify-server";
+import { OrderDetail } from "@/components/order-detail";
+
+const CLIENT_ID = process.env.NEXT_PUBLIC_CIMPLIFY_CLIENT_ID ?? "";
+const REDIRECT_URI = process.env.CIMPLIFY_REDIRECT_URI ?? "";
+
+export default async function OrderDetailPage({
+  params,
+}: {
+  params: Promise<{ id: string }>;
+}) {
+  const { id } = await params;
+
+  const session = await serverSession();
+  if (!session) {
+    return (
+      <AccountSignedOutPrompt
+        clientId={CLIENT_ID}
+        redirectUri={REDIRECT_URI}
+        eyebrow={brand.account.loginEyebrow}
+        title={brand.account.loginTitle}
+        description={brand.account.loginSubtitle}
+      />
+    );
+  }
+
+  const bearer = await serverAccessToken();
+  const order = await apiFetch<EnrichedOrder>(`/api/v1/orders/${encodeURIComponent(id)}`, {
+    bearer,
+  });
+  if (!order) notFound();
+
+  return (
+    <div className="mx-auto w-full max-w-5xl px-4 py-8 sm:px-6">
+      <OrderDetail {...toAccountOrderView(order)} />
+    </div>
+  );
+}

package/templates/storefront-services/app/sitemap-page/page.tsx

@@ -54,8 +54,6 @@ const STATIC_LINKS: { title: string; links: { href: string; label: string }[] }[
     links: [
       { href: "/account", label: "Account" },
       { href: "/account/orders", label: "Orders" },
-      { href: "/account/addresses", label: "Addresses" },
-      { href: "/account/wallets", label: "Wallets" },
       { href: "/login", label: "Sign in" },
       { href: "/signup", label: "Create account" },
       { href: "/track-order", label: "Track an order" },

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

@@ -1,8 +1,7 @@
 "use client";
 
 import { useEffect, useRef } from "react";
-import Link from "next/link";
-import { CimplifySignInButton, useCimplifySession } from "@cimplify/sdk/react";
+import { CimplifyUserButton, useCimplifySession } from "@cimplify/sdk/react";
 import { signInSilent } from "@cimplify/sdk";
 
 const CLIENT_ID = process.env.NEXT_PUBLIC_CIMPLIFY_CLIENT_ID ?? "";
@@ -26,24 +25,12 @@ export function AccountPill() {
 
   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
+    <CimplifyUserButton
+      session={session}
       clientId={CLIENT_ID}
       redirectUri={`${typeof window !== "undefined" ? window.location.origin : ""}/auth/callback`}
-      variant="text"
-      onSuccess={() => refresh()}
+      onSignIn={refresh}
     />
   );
 }

package/templates/storefront-services/components/order-detail.tsx

@@ -0,0 +1,11 @@
+"use client";
+
+import { useRouter } from "next/navigation";
+import { AccountOrderView, type AccountOrderViewProps } from "@cimplify/sdk/react";
+
+// Thin client wrapper so the server page can pass the (serializable) view-model
+// while `onBack` (a function) is supplied on the client.
+export function OrderDetail(props: AccountOrderViewProps) {
+  const router = useRouter();
+  return <AccountOrderView {...props} onBack={() => router.push("/account/orders")} />;
+}

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

@@ -368,7 +368,6 @@ export const brand: Brand = {
           { label: "Sign in", href: "/login" },
           { label: "Create account", href: "/signup" },
           { label: "Your bookings", href: "/account/orders" },
-          { label: "Wallets", href: "/account/wallets" },
         ],
       },
       {

package/templates/storefront-services/lib/cimplify-server.ts

@@ -8,8 +8,6 @@ import type { NavItem } from "@cimplify/sdk/react";
 export const ACCOUNT_NAV: NavItem[] = [
   { label: "Dashboard", href: "/account" },
   { label: "Orders", href: "/account/orders" },
-  { label: "Addresses", href: "/account/addresses" },
-  { label: "Wallets", href: "/account/wallets" },
   { label: "Cimplify identity", href: "https://link.cimplify.io", external: true },
 ];
 

package/templates/storefront-auto/app/account/addresses/actions.ts

@@ -1,56 +0,0 @@
-"use server";
-
-import { revalidatePath } from "next/cache";
-import { apiFetch, serverAccessToken } from "@/lib/cimplify-server";
-import type { CustomerAddress } from "@cimplify/sdk";
-
-const ACCOUNT_ADDRESSES = "/account/addresses";
-
-function required(form: FormData, key: string): string {
-  const value = String(form.get(key) ?? "").trim();
-  if (!value) throw new Error(`Missing required field: ${key}`);
-  return value;
-}
-
-function optional(form: FormData, key: string): string | undefined {
-  const value = String(form.get(key) ?? "").trim();
-  return value || undefined;
-}
-
-export async function createAddressAction(form: FormData): Promise<void> {
-  const bearer = await serverAccessToken();
-  await apiFetch<CustomerAddress>("/v1/link/addresses", {
-    bearer,
-    method: "POST",
-    body: JSON.stringify({
-      label: optional(form, "label"),
-      street_address: required(form, "street_address"),
-      apartment: optional(form, "apartment"),
-      city: required(form, "city"),
-      region: optional(form, "region"),
-      postal_code: optional(form, "postal_code"),
-      country: optional(form, "country"),
-    }),
-  });
-  revalidatePath(ACCOUNT_ADDRESSES);
-}
-
-export async function deleteAddressAction(form: FormData): Promise<void> {
-  const bearer = await serverAccessToken();
-  const id = required(form, "address_id");
-  await apiFetch<unknown>(`/v1/link/addresses/${encodeURIComponent(id)}`, {
-    bearer,
-    method: "DELETE",
-  });
-  revalidatePath(ACCOUNT_ADDRESSES);
-}
-
-export async function setDefaultAddressAction(form: FormData): Promise<void> {
-  const bearer = await serverAccessToken();
-  const id = required(form, "address_id");
-  await apiFetch<unknown>(`/v1/link/addresses/${encodeURIComponent(id)}/default`, {
-    bearer,
-    method: "POST",
-  });
-  revalidatePath(ACCOUNT_ADDRESSES);
-}