create-croissant 0.1.57 → 0.1.59

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-croissant",
-  "version": "0.1.57",
+  "version": "0.1.59",
   "description": "Scaffold a new project using the Croissant Stack",
   "repository": {
     "type": "git",
@@ -33,6 +33,7 @@
     "@types/inquirer": "^9.0.9",
     "@types/node": "^25.6.0",
     "tsup": "^8.5.1",
+    "typescript": "6.0.3",
     "@workspace/config-typescript": "0.0.0"
   },
   "scripts": {

package/template/apps/platform/package.json

@@ -37,6 +37,7 @@
     "@workspace/config-typescript": "workspace:*",
     "dotenv": "^17.4.2",
     "drizzle-kit": "^0.31.10",
+    "typescript": "6.0.3",
     "vite": "^8.0.10"
   }
 }

package/template/apps/platform/src/components/access-denied.tsx

@@ -0,0 +1,32 @@
+import * as React from "react";
+import { Link } from "@tanstack/react-router";
+import { Lock } from "lucide-react";
+import { buttonVariants } from "@workspace/ui/components/button";
+
+export function AccessDenied() {
+  return (
+    <div className="flex flex-col items-center justify-center h-[60vh] gap-4 text-center">
+      <div className="rounded-full bg-muted p-6">
+        <Lock className="h-12 w-12 text-muted-foreground" />
+      </div>
+      <h2 className="text-2xl font-bold tracking-tight">Access Denied</h2>
+      <p className="text-muted-foreground max-w-[400px]">
+        You need to be logged in to access this page. Please sign in to view this content.
+      </p>
+      <div className="flex gap-2">
+        <Link
+          to="/login"
+          className={buttonVariants({ variant: "default" })}
+        >
+          Sign In
+        </Link>
+        <Link
+          to="/"
+          className={buttonVariants({ variant: "outline" })}
+        >
+          Go Home
+        </Link>
+      </div>
+    </div>
+  );
+}

package/template/apps/platform/src/components/app-sidebar.tsx

@@ -20,8 +20,8 @@ import { ModeToggle } from "@workspace/ui/components/mode-toggle";
 
 import { authClient } from "@/lib/auth-client";
 
-// This is sample data.
-export const authNavItems = [
+// Unified navigation items
+export const navItems = [
   {
     title: "Dashboard",
     items: [
@@ -35,22 +35,6 @@ export const authNavItems = [
       },
     ],
   },
-  {
-    title: "Examples",
-    items: [
-      {
-        title: "SSR + oRPC (Auth)",
-        url: "/examples/ssr-orpc-auth",
-      },
-      {
-        title: "Client + oRPC (Auth)",
-        url: "/examples/client-orpc-auth",
-      },
-    ],
-  },
-];
-
-export const publicNavItems = [
   {
     title: "Welcome",
     items: [
@@ -75,10 +59,18 @@ export const publicNavItems = [
         title: "SSR + oRPC",
         url: "/examples/ssr-orpc",
       },
+      {
+        title: "SSR + oRPC (Auth)",
+        url: "/examples/ssr-orpc-auth",
+      },
       {
         title: "Client + oRPC",
         url: "/examples/client-orpc",
       },
+      {
+        title: "Client + oRPC (Auth)",
+        url: "/examples/client-orpc-auth",
+      },
       {
         title: "ISR",
         url: "/examples/isr",
@@ -87,27 +79,8 @@ export const publicNavItems = [
   },
 ];
 
-interface AppSidebarProps extends React.ComponentProps<typeof Sidebar> {
-  items?: Array<{
-    title: string;
-    items: Array<{
-      title: string;
-      url: string;
-    }>;
-  }>;
-}
-
-export function AuthSidebar(props: React.ComponentProps<typeof Sidebar>) {
-  return <AppSidebar items={authNavItems} {...props} />;
-}
-
-export function PublicSidebar(props: React.ComponentProps<typeof Sidebar>) {
-  return <AppSidebar items={publicNavItems} {...props} />;
-}
-
-export function AppSidebar({ items = authNavItems, ...props }: AppSidebarProps) {
+export function AppSidebar(props: React.ComponentProps<typeof Sidebar>) {
   const { data: session } = authClient.useSession();
-
   const user = session?.user || null;
 
   return (
@@ -119,22 +92,29 @@ export function AppSidebar({ items = authNavItems, ...props }: AppSidebarProps)
         </div>
       </SidebarHeader>
       <SidebarContent>
-        {items.map((item) => (
+        {navItems.map((item) => (
           <SidebarGroup key={item.title}>
             <SidebarGroupLabel>{item.title}</SidebarGroupLabel>
             <SidebarGroupContent>
               <SidebarMenu>
-                {item.items.map((subItem) => (
-                  <SidebarMenuItem key={subItem.title}>
-                    <SidebarMenuButton
-                      render={
-                        <Link to={subItem.url} activeProps={{ className: "bg-sidebar-accent" }} />
-                      }
-                    >
-                      {subItem.title}
-                    </SidebarMenuButton>
-                  </SidebarMenuItem>
-                ))}
+                {item.items.map((subItem) => {
+                  // Hide Login/Signup if user is already logged in
+                  if (user && (subItem.url === "/login" || subItem.url === "/signup")) {
+                    return null;
+                  }
+
+                  return (
+                    <SidebarMenuItem key={subItem.title}>
+                      <SidebarMenuButton
+                        render={
+                          <Link to={subItem.url} activeProps={{ className: "bg-sidebar-accent" }} />
+                        }
+                      >
+                        {subItem.title}
+                      </SidebarMenuButton>
+                    </SidebarMenuItem>
+                  );
+                })}
               </SidebarMenu>
             </SidebarGroupContent>
           </SidebarGroup>

package/template/apps/platform/src/lib/auth-utils.ts

@@ -1,13 +1,27 @@
 import { createServerFn } from "@tanstack/react-start";
-import { getRequest } from "@tanstack/react-start/server";
+import { getRequestHeaders } from "@tanstack/react-start/server";
 import { auth } from "@workspace/auth/lib/auth";
 
 export const getSessionFn = createServerFn({ method: "GET" }).handler(async () => {
-  const request = getRequest();
+  const headers = getRequestHeaders();
 
   const session = await auth.api.getSession({
-    headers: request.headers,
+    headers,
   });
 
   return session;
 });
+
+export const ensureSessionFn = createServerFn({ method: "GET" }).handler(async () => {
+  const headers = getRequestHeaders();
+
+  const session = await auth.api.getSession({
+    headers,
+  });
+
+  if (!session) {
+    throw new Error("Unauthorized");
+  }
+
+  return session;
+});

package/template/apps/platform/src/routes/__root.tsx

@@ -11,7 +11,7 @@ import {
   EmptyHeader,
   EmptyTitle,
 } from "@workspace/ui/components/empty";
-import { Button, buttonVariants } from "@workspace/ui/components/button";
+import { buttonVariants } from "@workspace/ui/components/button";
 
 import appCss from "@workspace/ui/globals.css?url";
 

package/template/apps/platform/src/routes/_auth/account.tsx

@@ -1,9 +1,10 @@
 import * as React from "react";
-import { createFileRoute, redirect } from "@tanstack/react-router";
+import { createFileRoute } from "@tanstack/react-router";
 import { useForm } from "@tanstack/react-form";
 import { z } from "zod";
 import { toast } from "sonner";
 import { Loader2, User } from "lucide-react";
+import { AccessDenied } from "@/components/access-denied";
 
 import { Button } from "@workspace/ui/components/button";
 import { Input } from "@workspace/ui/components/input";
@@ -40,14 +41,6 @@ const passwordSchema = z
 export const Route = createFileRoute("/_auth/account")({
   beforeLoad: async () => {
     const session = await getSessionFn();
-    if (!session) {
-      throw redirect({
-        to: "/login",
-        search: {
-          redirect: "/account",
-        },
-      });
-    }
     return { session };
   },
   component: AccountPage,
@@ -56,6 +49,11 @@ export const Route = createFileRoute("/_auth/account")({
 function AccountPage() {
   const { session } = Route.useRouteContext();
   const [loading, setLoading] = React.useState(false);
+
+  if (!session) {
+    return <AccessDenied />;
+  }
+
   const user = session.user;
 
   const profileForm = useForm({

package/template/apps/platform/src/routes/_auth/dashboard.tsx

@@ -1,19 +1,16 @@
-import { createFileRoute, redirect } from "@tanstack/react-router";
+import { createFileRoute } from "@tanstack/react-router";
 import { getSessionFn } from "@/lib/auth-utils";
 import { authClient } from "@/lib/auth-client";
 import { orpc } from "@/lib/orpc";
+import { AccessDenied } from "@/components/access-denied";
 
 export const Route = createFileRoute("/_auth/dashboard")({
   beforeLoad: async () => {
     const session = await getSessionFn();
-    if (!session) {
-      throw redirect({
-        to: "/",
-      });
-    }
     return { session };
   },
-  loader: async () => {
+  loader: async ({ context }) => {
+    if (!context.session) return { secretData: null };
     try {
       const data = await orpc.getSecretData();
       return { secretData: data.secret };
@@ -28,6 +25,10 @@ function Dashboard() {
   const { session } = Route.useRouteContext();
   const { secretData } = Route.useLoaderData();
 
+  if (!session) {
+    return <AccessDenied />;
+  }
+
   return (
     <div className="flex min-h-svh p-6">
       <div className="flex max-w-md min-w-0 flex-col gap-4 text-sm leading-loose">

package/template/apps/platform/src/routes/_auth/examples/client-orpc-auth.tsx

@@ -1,18 +1,11 @@
-import { createFileRoute, redirect } from "@tanstack/react-router";
+import { createFileRoute } from "@tanstack/react-router";
 import { getSessionFn } from "@/lib/auth-utils";
 import { useSecretData } from "@workspace/orpc/react";
+import { AccessDenied } from "@/components/access-denied";
 
 export const Route = createFileRoute("/_auth/examples/client-orpc-auth")({
   beforeLoad: async () => {
     const session = await getSessionFn();
-    if (!session) {
-      throw redirect({
-        to: "/login",
-        search: {
-          redirect: "/examples/client-orpc-auth",
-        },
-      });
-    }
     return { session };
   },
   component: ClientORPCAuth,
@@ -23,6 +16,10 @@ function ClientORPCAuth() {
 
   const { data, isLoading } = useSecretData();
 
+  if (!session) {
+    return <AccessDenied />;
+  }
+
   return (
     <div className="flex flex-col gap-4">
       <h1 className="text-2xl font-bold">Client + oRPC (Authenticated)</h1>

package/template/apps/platform/src/routes/_auth/examples/ssr-orpc-auth.tsx

@@ -1,10 +1,13 @@
-import { createFileRoute, redirect } from "@tanstack/react-router";
+import { createFileRoute } from "@tanstack/react-router";
 import { createServerFn } from "@tanstack/react-start";
 import { getSessionFn } from "@/lib/auth-utils";
 import { orpc } from "@/lib/orpc";
+import { AccessDenied } from "@/components/access-denied";
 
 const getSecretData = createServerFn({ method: "GET" }).handler(async () => {
   try {
+    const session = await getSessionFn();
+    if (!session) return { secretData: null, error: "Unauthorized" };
     const secretData = await orpc.getSecretData();
     return { secretData };
   } catch {
@@ -15,14 +18,6 @@ const getSecretData = createServerFn({ method: "GET" }).handler(async () => {
 export const Route = createFileRoute("/_auth/examples/ssr-orpc-auth")({
   beforeLoad: async () => {
     const session = await getSessionFn();
-    if (!session) {
-      throw redirect({
-        to: "/login",
-        search: {
-          redirect: "/examples/ssr-orpc-auth",
-        },
-      });
-    }
     return { session };
   },
   loader: () => getSecretData(),
@@ -33,6 +28,10 @@ function SSRORPCAuth() {
   const { session } = Route.useRouteContext();
   const { secretData, error } = Route.useLoaderData();
 
+  if (!session) {
+    return <AccessDenied />;
+  }
+
   return (
     <div className="flex flex-col gap-4">
       <h1 className="text-2xl font-bold">SSR + oRPC (Authenticated)</h1>

package/template/apps/platform/src/routes/_auth.tsx

@@ -1,6 +1,6 @@
 import { Outlet, createFileRoute } from "@tanstack/react-router";
 import { SidebarProvider, SidebarTrigger } from "@workspace/ui/components/sidebar";
-import { AuthSidebar } from "@/components/app-sidebar";
+import { AppSidebar } from "@/components/app-sidebar";
 
 export const Route = createFileRoute("/_auth")({
   component: AuthLayout,
@@ -9,7 +9,7 @@ export const Route = createFileRoute("/_auth")({
 function AuthLayout() {
   return (
     <SidebarProvider>
-      <AuthSidebar />
+      <AppSidebar />
       <main className="flex flex-1 flex-col overflow-hidden">
         <header className="flex h-16 shrink-0 items-center gap-2 border-b px-4">
           <SidebarTrigger />

package/template/apps/platform/src/routes/_public.tsx

@@ -1,6 +1,6 @@
 import { Outlet, createFileRoute } from "@tanstack/react-router";
 import { SidebarProvider, SidebarTrigger } from "@workspace/ui/components/sidebar";
-import { PublicSidebar } from "@/components/app-sidebar";
+import { AppSidebar } from "@/components/app-sidebar";
 
 export const Route = createFileRoute("/_public")({
   component: PublicLayout,
@@ -9,7 +9,7 @@ export const Route = createFileRoute("/_public")({
 function PublicLayout() {
   return (
     <SidebarProvider>
-      <PublicSidebar />
+      <AppSidebar />
       <main className="flex flex-1 flex-col overflow-hidden">
         <header className="flex h-16 shrink-0 items-center gap-2 border-b px-4">
           <SidebarTrigger />

package/template/apps/platform/src/routes/api/auth/$.ts

@@ -1,34 +1,44 @@
 import { auth } from "@workspace/auth/lib/auth";
 import { createFileRoute } from "@tanstack/react-router";
 
-const CORS_HEADERS = {
-  "Access-Control-Allow-Origin": "*",
-  "Access-Control-Allow-Methods": "GET, POST, PUT, DELETE, OPTIONS",
-  "Access-Control-Allow-Headers": "Content-Type, Authorization",
-  "Access-Control-Allow-Credentials": "true",
-};
-
 export const Route = createFileRoute("/api/auth/$")({
   server: {
     handlers: {
       GET: async ({ request }: { request: Request }) => {
         const response = await auth.handler(request);
-        Object.entries(CORS_HEADERS).forEach(([key, value]) => {
-          response.headers.set(key, value);
-        });
+        const origin = request.headers.get("Origin");
+        if (origin) {
+          response.headers.set("Access-Control-Allow-Origin", origin);
+        }
+        response.headers.set("Access-Control-Allow-Methods", "GET, POST, PUT, DELETE, OPTIONS");
+        response.headers.set("Access-Control-Allow-Headers", "Content-Type, Authorization");
+        response.headers.set("Access-Control-Allow-Credentials", "true");
         return response;
       },
       POST: async ({ request }: { request: Request }) => {
         const response = await auth.handler(request);
-        Object.entries(CORS_HEADERS).forEach(([key, value]) => {
-          response.headers.set(key, value);
-        });
+        const origin = request.headers.get("Origin");
+        if (origin) {
+          response.headers.set("Access-Control-Allow-Origin", origin);
+        }
+        response.headers.set("Access-Control-Allow-Methods", "GET, POST, PUT, DELETE, OPTIONS");
+        response.headers.set("Access-Control-Allow-Headers", "Content-Type, Authorization");
+        response.headers.set("Access-Control-Allow-Credentials", "true");
         return response;
       },
-      OPTIONS: async () => {
+      OPTIONS: async ({ request }: { request: Request }) => {
+        const origin = request.headers.get("Origin");
+        const headers: Record<string, string> = {
+          "Access-Control-Allow-Methods": "GET, POST, PUT, DELETE, OPTIONS",
+          "Access-Control-Allow-Headers": "Content-Type, Authorization",
+          "Access-Control-Allow-Credentials": "true",
+        };
+        if (origin) {
+          headers["Access-Control-Allow-Origin"] = origin;
+        }
         return new Response(null, {
           status: 204,
-          headers: CORS_HEADERS,
+          headers,
         });
       },
     },

package/template/apps/platform/src/routes/api/rpc.$.ts

@@ -28,7 +28,10 @@ export const Route = createFileRoute("/api/rpc/$")({
         });
 
         if (response) {
-          response.headers.set("Access-Control-Allow-Origin", "*");
+          const origin = request.headers.get("Origin");
+          if (origin) {
+            response.headers.set("Access-Control-Allow-Origin", origin);
+          }
           response.headers.set("Access-Control-Allow-Methods", "GET, POST, PUT, DELETE, OPTIONS");
           response.headers.set("Access-Control-Allow-Headers", "Content-Type, Authorization");
           response.headers.set("Access-Control-Allow-Credentials", "true");
@@ -36,15 +39,19 @@ export const Route = createFileRoute("/api/rpc/$")({
 
         return response ?? new Response("Not Found", { status: 404 });
       },
-      OPTIONS: async () => {
+      OPTIONS: async ({ request }) => {
+        const origin = request.headers.get("Origin");
+        const headers: Record<string, string> = {
+          "Access-Control-Allow-Methods": "GET, POST, PUT, DELETE, OPTIONS",
+          "Access-Control-Allow-Headers": "Content-Type, Authorization",
+          "Access-Control-Allow-Credentials": "true",
+        };
+        if (origin) {
+          headers["Access-Control-Allow-Origin"] = origin;
+        }
         return new Response(null, {
           status: 204,
-          headers: {
-            "Access-Control-Allow-Origin": "*",
-            "Access-Control-Allow-Methods": "GET, POST, PUT, DELETE, OPTIONS",
-            "Access-Control-Allow-Headers": "Content-Type, Authorization",
-            "Access-Control-Allow-Credentials": "true",
-          },
+          headers,
         });
       },
     },

package/template/docker-compose.yml

@@ -1,8 +1,6 @@
-version: "3.8"
-
 services:
   db:
-    image: postgres:latest
+    image: postgres:17-alpine
     container_name: croissant-stack
     environment:
       POSTGRES_PASSWORD: postgres

package/template/package.json

@@ -14,8 +14,6 @@
     "quality:fix": "turbo quality:fix",
     "typecheck": "turbo typecheck",
     "ci": "pnpm run lint && pnpm run typecheck && pnpm run build",
-    "dev:desktop": "turbo run dev --filter=desktop",
-    "build:desktop": "turbo run build --filter=desktop",
     "db:up": "docker compose up -d",
     "db:down": "docker compose down",
     "db:logs": "docker compose logs -f",
@@ -41,14 +39,5 @@
   "engines": {
     "node": ">=20"
   },
-  "packageManager": "pnpm@11.1.2",
-  "pnpm": {
-    "onlyBuiltDependencies": [
-      "@prisma/client",
-      "better-sqlite3",
-      "esbuild",
-      "msw",
-      "unrs-resolver"
-    ]
-  }
+  "packageManager": "pnpm@11.1.2"
 }

package/template/packages/auth/package.json

@@ -9,15 +9,15 @@
   },
   "scripts": {
     "typecheck": "tsc --noEmit",
-    "generate": "better-auth generate --output ../db/src/lib/auth-schema.ts"
+    "generate": "auth generate --output ../db/src/lib/auth-schema.ts"
   },
   "dependencies": {
     "@workspace/db": "workspace:*",
     "better-auth": "1.6.11"
   },
   "devDependencies": {
-    "@better-auth/cli": "^1.4.22",
     "@workspace/config-typescript": "workspace:*",
+    "auth": "^1.6.11",
     "drizzle-kit": "^0.31.10",
     "tsx": "^4.21.0"
   }

package/template/packages/auth/src/lib/auth.ts

@@ -1,6 +1,7 @@
 import { betterAuth } from "better-auth";
 import { drizzleAdapter } from "better-auth/adapters/drizzle";
 import { db } from "@workspace/db";
+import { tanstackStartCookies } from "better-auth/tanstack-start";
 
 export const auth = betterAuth({
   database: drizzleAdapter(db, {
@@ -8,6 +9,15 @@ export const auth = betterAuth({
   }),
   baseURL: process.env.BETTER_AUTH_URL,
   emailAndPassword: { enabled: true },
+  advanced: {
+    cookiePrefix: "croissant",
+    useSecureCookies: true,
+  },
+  cookie: {
+    sameSite: "none",
+    secure: true,
+  },
+  plugins: [tanstackStartCookies()],
 });
 
 export type Session = typeof auth.$Infer.Session;

package/template/apps/desktop/.vscode/extensions.json

@@ -1,3 +0,0 @@
-{
-  "recommendations": ["tauri-apps.tauri-vscode", "rust-lang.rust-analyzer"]
-}

package/template/apps/desktop/README.md

@@ -1,7 +0,0 @@
-# Tauri + React + Typescript
-
-This template should help get you started developing with Tauri, React and Typescript in Vite.
-
-## Recommended IDE Setup
-
-- [VS Code](https://code.visualstudio.com/) + [Tauri](https://marketplace.visualstudio.com/items?itemName=tauri-apps.tauri-vscode) + [rust-analyzer](https://marketplace.visualstudio.com/items?itemName=rust-lang.rust-analyzer)

package/template/apps/desktop/index.html

@@ -1,14 +0,0 @@
-<!doctype html>
-<html lang="en">
-  <head>
-    <meta charset="UTF-8" />
-    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>Tauri + React + Typescript</title>
-  </head>
-
-  <body>
-    <div id="root"></div>
-    <script type="module" src="/src/main.tsx"></script>
-  </body>
-</html>

package/template/apps/desktop/package.json

@@ -1,40 +0,0 @@
-{
-  "name": "desktop",
-  "version": "0.1.0",
-  "private": true,
-  "type": "module",
-  "scripts": {
-    "dev": "vite",
-    "build": "tsc && vite build",
-    "preview": "vite preview",
-    "tauri": "tauri"
-  },
-  "dependencies": {
-    "@noble/ciphers": "^2.2.0",
-    "@tailwindcss/vite": "^4.2.4",
-    "@tanstack/react-router": "^1.168.24",
-    "@tanstack/router-plugin": "^1.167.27",
-    "@tauri-apps/api": "^2",
-    "@tauri-apps/plugin-opener": "^2",
-    "@workspace/auth": "workspace:*",
-    "@workspace/orpc": "workspace:*",
-    "@workspace/ui": "workspace:*",
-    "better-auth": "1.6.11",
-    "lucide-react": "^1.11.0",
-    "react": "19.2.5",
-    "react-dom": "19.2.5",
-    "sonner": "^2.0.7",
-    "tailwindcss": "^4.2.4"
-  },
-  "devDependencies": {
-    "@tauri-apps/cli": "^2",
-    "@types/node": "^25.6.0",
-    "@types/react": "19.2.14",
-    "@types/react-dom": "19.2.3",
-    "@vitejs/plugin-react": "^4.6.0",
-    "@workspace/config-typescript": "workspace:*",
-    "typescript": "~5.8.3",
-    "vite": "^8.0.10",
-    "vite-tsconfig-paths": "^6.1.1"
-  }
-}