create-croissant 0.1.48 → 0.1.50

package/template/apps/desktop/src/renderer/src/routeTree.gen.ts

@@ -0,0 +1,240 @@
+/* eslint-disable */
+
+// @ts-nocheck
+
+// noinspection JSUnusedGlobalSymbols
+
+// This file was automatically generated by TanStack Router.
+// You should NOT make any changes in this file as it will be overwritten.
+// Additionally, you should also exclude this file from your linter and/or formatter to prevent it from being checked or modified.
+
+import { Route as rootRouteImport } from './routes/__root'
+import { Route as PublicRouteImport } from './routes/_public'
+import { Route as AuthRouteImport } from './routes/_auth'
+import { Route as PublicIndexRouteImport } from './routes/_public/index'
+import { Route as PublicSignupRouteImport } from './routes/_public/signup'
+import { Route as PublicLoginRouteImport } from './routes/_public/login'
+import { Route as AuthDashboardRouteImport } from './routes/_auth/dashboard'
+import { Route as AuthAccountRouteImport } from './routes/_auth/account'
+import { Route as PublicExamplesClientOrpcRouteImport } from './routes/_public/examples/client-orpc'
+import { Route as AuthExamplesClientOrpcAuthRouteImport } from './routes/_auth/examples/client-orpc-auth'
+
+const PublicRoute = PublicRouteImport.update({
+  id: '/_public',
+  getParentRoute: () => rootRouteImport,
+} as any)
+const AuthRoute = AuthRouteImport.update({
+  id: '/_auth',
+  getParentRoute: () => rootRouteImport,
+} as any)
+const PublicIndexRoute = PublicIndexRouteImport.update({
+  id: '/',
+  path: '/',
+  getParentRoute: () => PublicRoute,
+} as any)
+const PublicSignupRoute = PublicSignupRouteImport.update({
+  id: '/signup',
+  path: '/signup',
+  getParentRoute: () => PublicRoute,
+} as any)
+const PublicLoginRoute = PublicLoginRouteImport.update({
+  id: '/login',
+  path: '/login',
+  getParentRoute: () => PublicRoute,
+} as any)
+const AuthDashboardRoute = AuthDashboardRouteImport.update({
+  id: '/dashboard',
+  path: '/dashboard',
+  getParentRoute: () => AuthRoute,
+} as any)
+const AuthAccountRoute = AuthAccountRouteImport.update({
+  id: '/account',
+  path: '/account',
+  getParentRoute: () => AuthRoute,
+} as any)
+const PublicExamplesClientOrpcRoute =
+  PublicExamplesClientOrpcRouteImport.update({
+    id: '/examples/client-orpc',
+    path: '/examples/client-orpc',
+    getParentRoute: () => PublicRoute,
+  } as any)
+const AuthExamplesClientOrpcAuthRoute =
+  AuthExamplesClientOrpcAuthRouteImport.update({
+    id: '/examples/client-orpc-auth',
+    path: '/examples/client-orpc-auth',
+    getParentRoute: () => AuthRoute,
+  } as any)
+
+export interface FileRoutesByFullPath {
+  '/': typeof PublicIndexRoute
+  '/account': typeof AuthAccountRoute
+  '/dashboard': typeof AuthDashboardRoute
+  '/login': typeof PublicLoginRoute
+  '/signup': typeof PublicSignupRoute
+  '/examples/client-orpc-auth': typeof AuthExamplesClientOrpcAuthRoute
+  '/examples/client-orpc': typeof PublicExamplesClientOrpcRoute
+}
+export interface FileRoutesByTo {
+  '/': typeof PublicIndexRoute
+  '/account': typeof AuthAccountRoute
+  '/dashboard': typeof AuthDashboardRoute
+  '/login': typeof PublicLoginRoute
+  '/signup': typeof PublicSignupRoute
+  '/examples/client-orpc-auth': typeof AuthExamplesClientOrpcAuthRoute
+  '/examples/client-orpc': typeof PublicExamplesClientOrpcRoute
+}
+export interface FileRoutesById {
+  __root__: typeof rootRouteImport
+  '/_auth': typeof AuthRouteWithChildren
+  '/_public': typeof PublicRouteWithChildren
+  '/_auth/account': typeof AuthAccountRoute
+  '/_auth/dashboard': typeof AuthDashboardRoute
+  '/_public/login': typeof PublicLoginRoute
+  '/_public/signup': typeof PublicSignupRoute
+  '/_public/': typeof PublicIndexRoute
+  '/_auth/examples/client-orpc-auth': typeof AuthExamplesClientOrpcAuthRoute
+  '/_public/examples/client-orpc': typeof PublicExamplesClientOrpcRoute
+}
+export interface FileRouteTypes {
+  fileRoutesByFullPath: FileRoutesByFullPath
+  fullPaths:
+    | '/'
+    | '/account'
+    | '/dashboard'
+    | '/login'
+    | '/signup'
+    | '/examples/client-orpc-auth'
+    | '/examples/client-orpc'
+  fileRoutesByTo: FileRoutesByTo
+  to:
+    | '/'
+    | '/account'
+    | '/dashboard'
+    | '/login'
+    | '/signup'
+    | '/examples/client-orpc-auth'
+    | '/examples/client-orpc'
+  id:
+    | '__root__'
+    | '/_auth'
+    | '/_public'
+    | '/_auth/account'
+    | '/_auth/dashboard'
+    | '/_public/login'
+    | '/_public/signup'
+    | '/_public/'
+    | '/_auth/examples/client-orpc-auth'
+    | '/_public/examples/client-orpc'
+  fileRoutesById: FileRoutesById
+}
+export interface RootRouteChildren {
+  AuthRoute: typeof AuthRouteWithChildren
+  PublicRoute: typeof PublicRouteWithChildren
+}
+
+declare module '@tanstack/react-router' {
+  interface FileRoutesByPath {
+    '/_public': {
+      id: '/_public'
+      path: ''
+      fullPath: '/'
+      preLoaderRoute: typeof PublicRouteImport
+      parentRoute: typeof rootRouteImport
+    }
+    '/_auth': {
+      id: '/_auth'
+      path: ''
+      fullPath: '/'
+      preLoaderRoute: typeof AuthRouteImport
+      parentRoute: typeof rootRouteImport
+    }
+    '/_public/': {
+      id: '/_public/'
+      path: '/'
+      fullPath: '/'
+      preLoaderRoute: typeof PublicIndexRouteImport
+      parentRoute: typeof PublicRoute
+    }
+    '/_public/signup': {
+      id: '/_public/signup'
+      path: '/signup'
+      fullPath: '/signup'
+      preLoaderRoute: typeof PublicSignupRouteImport
+      parentRoute: typeof PublicRoute
+    }
+    '/_public/login': {
+      id: '/_public/login'
+      path: '/login'
+      fullPath: '/login'
+      preLoaderRoute: typeof PublicLoginRouteImport
+      parentRoute: typeof PublicRoute
+    }
+    '/_auth/dashboard': {
+      id: '/_auth/dashboard'
+      path: '/dashboard'
+      fullPath: '/dashboard'
+      preLoaderRoute: typeof AuthDashboardRouteImport
+      parentRoute: typeof AuthRoute
+    }
+    '/_auth/account': {
+      id: '/_auth/account'
+      path: '/account'
+      fullPath: '/account'
+      preLoaderRoute: typeof AuthAccountRouteImport
+      parentRoute: typeof AuthRoute
+    }
+    '/_public/examples/client-orpc': {
+      id: '/_public/examples/client-orpc'
+      path: '/examples/client-orpc'
+      fullPath: '/examples/client-orpc'
+      preLoaderRoute: typeof PublicExamplesClientOrpcRouteImport
+      parentRoute: typeof PublicRoute
+    }
+    '/_auth/examples/client-orpc-auth': {
+      id: '/_auth/examples/client-orpc-auth'
+      path: '/examples/client-orpc-auth'
+      fullPath: '/examples/client-orpc-auth'
+      preLoaderRoute: typeof AuthExamplesClientOrpcAuthRouteImport
+      parentRoute: typeof AuthRoute
+    }
+  }
+}
+
+interface AuthRouteChildren {
+  AuthAccountRoute: typeof AuthAccountRoute
+  AuthDashboardRoute: typeof AuthDashboardRoute
+  AuthExamplesClientOrpcAuthRoute: typeof AuthExamplesClientOrpcAuthRoute
+}
+
+const AuthRouteChildren: AuthRouteChildren = {
+  AuthAccountRoute: AuthAccountRoute,
+  AuthDashboardRoute: AuthDashboardRoute,
+  AuthExamplesClientOrpcAuthRoute: AuthExamplesClientOrpcAuthRoute,
+}
+
+const AuthRouteWithChildren = AuthRoute._addFileChildren(AuthRouteChildren)
+
+interface PublicRouteChildren {
+  PublicLoginRoute: typeof PublicLoginRoute
+  PublicSignupRoute: typeof PublicSignupRoute
+  PublicIndexRoute: typeof PublicIndexRoute
+  PublicExamplesClientOrpcRoute: typeof PublicExamplesClientOrpcRoute
+}
+
+const PublicRouteChildren: PublicRouteChildren = {
+  PublicLoginRoute: PublicLoginRoute,
+  PublicSignupRoute: PublicSignupRoute,
+  PublicIndexRoute: PublicIndexRoute,
+  PublicExamplesClientOrpcRoute: PublicExamplesClientOrpcRoute,
+}
+
+const PublicRouteWithChildren =
+  PublicRoute._addFileChildren(PublicRouteChildren)
+
+const rootRouteChildren: RootRouteChildren = {
+  AuthRoute: AuthRouteWithChildren,
+  PublicRoute: PublicRouteWithChildren,
+}
+export const routeTree = rootRouteImport
+  ._addFileChildren(rootRouteChildren)
+  ._addFileTypes<FileRouteTypes>()

package/template/apps/desktop/src/renderer/src/routes/__root.tsx

@@ -0,0 +1,29 @@
+import { Outlet, createRootRoute } from "@tanstack/react-router";
+import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
+import { Toaster } from "@workspace/ui/components/sonner";
+import { ThemeProvider } from "@workspace/ui/components/theme-provider";
+import { ORPCProvider } from "@workspace/orpc/react";
+import { orpc } from "@/lib/orpc";
+import { TanStackRouterDevtools } from "@tanstack/react-router-devtools";
+
+import "@workspace/ui/globals.css";
+
+const queryClient = new QueryClient();
+
+export const Route = createRootRoute({
+  component: RootLayout,
+});
+
+function RootLayout() {
+  return (
+    <ThemeProvider defaultTheme="system" storageKey="theme">
+      <QueryClientProvider client={queryClient}>
+        <ORPCProvider client={orpc}>
+          <Outlet />
+          <Toaster />
+          <TanStackRouterDevtools />
+        </ORPCProvider>
+      </QueryClientProvider>
+    </ThemeProvider>
+  );
+}

package/template/apps/desktop/src/renderer/src/routes/_auth/account.tsx

@@ -0,0 +1,267 @@
+import * as React from "react";
+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 { Button } from "@workspace/ui/components/button";
+import { Input } from "@workspace/ui/components/input";
+import {
+  Card,
+  CardContent,
+  CardDescription,
+  CardFooter,
+  CardHeader,
+  CardTitle,
+} from "@workspace/ui/components/card";
+import { Field, FieldError, FieldLabel } from "@workspace/ui/components/field";
+import { Avatar, AvatarFallback, AvatarImage } from "@workspace/ui/components/avatar";
+import { Separator } from "@workspace/ui/components/separator";
+
+import { authClient } from "@/lib/auth-client";
+
+const profileSchema = z.object({
+  name: z.string().min(1, "Name is required"),
+});
+
+const passwordSchema = z
+  .object({
+    currentPassword: z.string().min(1, "Current password is required"),
+    newPassword: z.string().min(8, "New password must be at least 8 characters"),
+    confirmPassword: z.string().min(1, "Confirm password is required"),
+  })
+  .refine((data) => data.newPassword === data.confirmPassword, {
+    message: "Passwords do not match",
+    path: ["confirmPassword"],
+  });
+
+export const Route = createFileRoute("/_auth/account")({
+  component: AccountPage,
+});
+
+function AccountPage() {
+  const { data: sessionData, isPending } = authClient.useSession();
+  const [loading, setLoading] = React.useState(false);
+  
+  const user = sessionData?.user;
+
+  const profileForm = useForm({
+    defaultValues: {
+      name: user?.name || "",
+    },
+    validators: {
+      onChange: profileSchema,
+    },
+    onSubmit: async ({ value }) => {
+      setLoading(true);
+      const { error } = await authClient.updateUser({
+        name: value.name,
+      });
+
+      if (error) {
+        toast.error(error.message || "Failed to update profile");
+      } else {
+        toast.success("Profile updated successfully");
+      }
+      setLoading(false);
+    },
+  });
+
+  const passwordForm = useForm({
+    defaultValues: {
+      currentPassword: "",
+      newPassword: "",
+      confirmPassword: "",
+    },
+    validators: {
+      onChange: passwordSchema,
+    },
+    onSubmit: async ({ value }) => {
+      setLoading(true);
+      const { error } = await authClient.changePassword({
+        currentPassword: value.currentPassword,
+        newPassword: value.newPassword,
+      });
+
+      if (error) {
+        toast.error(error.message || "Failed to change password");
+      } else {
+        toast.success("Password changed successfully");
+        passwordForm.reset();
+      }
+      setLoading(false);
+    },
+  });
+
+  if (isPending) return <div>Loading...</div>;
+  if (!user) return null;
+
+  return (
+    <div className="container max-w-4xl py-10">
+      <div className="flex flex-col gap-8">
+        <div>
+          <h1 className="text-3xl font-bold">Account Settings</h1>
+          <p className="text-muted-foreground">Manage your profile and account preferences.</p>
+        </div>
+
+        <Separator />
+
+        <div className="grid gap-8">
+          {/* Profile Section */}
+          <Card>
+            <CardHeader>
+              <CardTitle>Profile</CardTitle>
+              <CardDescription>Update your personal information.</CardDescription>
+            </CardHeader>
+            <CardContent className="space-y-6">
+              <div className="flex items-center gap-4">
+                <Avatar className="h-20 w-20">
+                  <AvatarImage src={user.image || ""} />
+                  <AvatarFallback className="text-2xl">
+                    {user.name.charAt(0) || <User className="h-10 w-10" />}
+                  </AvatarFallback>
+                </Avatar>
+                <div className="space-y-1">
+                  <p className="text-sm font-medium leading-none">{user.name}</p>
+                  <p className="text-sm text-muted-foreground">{user.email}</p>
+                </div>
+              </div>
+
+              <form
+                onSubmit={(e) => {
+                  e.preventDefault();
+                  e.stopPropagation();
+                  profileForm.handleSubmit();
+                }}
+                className="space-y-4"
+              >
+                <profileForm.Field
+                  name="name"
+                  children={(field) => (
+                    <Field>
+                      <FieldLabel htmlFor={field.name}>Display Name</FieldLabel>
+                      <Input
+                        id={field.name}
+                        value={field.state.value}
+                        onBlur={field.handleBlur}
+                        onChange={(e) => field.handleChange(e.target.value)}
+                      />
+                      <FieldError />
+                    </Field>
+                  )}
+                />
+                <Button type="submit" disabled={loading}>
+                  {loading && <Loader2 className="mr-2 h-4 w-4 animate-spin" />}
+                  Update Profile
+                </Button>
+              </form>
+            </CardContent>
+          </Card>
+
+          {/* Password Section */}
+          <Card>
+            <CardHeader>
+              <CardTitle>Security</CardTitle>
+              <CardDescription>Change your password to keep your account secure.</CardDescription>
+            </CardHeader>
+            <CardContent>
+              <form
+                onSubmit={(e) => {
+                  e.preventDefault();
+                  e.stopPropagation();
+                  passwordForm.handleSubmit();
+                }}
+                className="space-y-4"
+              >
+                <passwordForm.Field
+                  name="currentPassword"
+                  children={(field) => (
+                    <Field>
+                      <FieldLabel htmlFor={field.name}>Current Password</FieldLabel>
+                      <Input
+                        id={field.name}
+                        type="password"
+                        value={field.state.value}
+                        onBlur={field.handleBlur}
+                        onChange={(e) => field.handleChange(e.target.value)}
+                      />
+                      <FieldError />
+                    </Field>
+                  )}
+                />
+                <div className="grid grid-cols-1 md:grid-cols-2 gap-4">
+                  <passwordForm.Field
+                    name="newPassword"
+                    children={(field) => (
+                      <Field>
+                        <FieldLabel htmlFor={field.name}>New Password</FieldLabel>
+                        <Input
+                          id={field.name}
+                          type="password"
+                          value={field.state.value}
+                          onBlur={field.handleBlur}
+                          onChange={(e) => field.handleChange(e.target.value)}
+                        />
+                        <FieldError />
+                      </Field>
+                    )}
+                  />
+                  <passwordForm.Field
+                    name="confirmPassword"
+                    children={(field) => (
+                      <Field>
+                        <FieldLabel htmlFor={field.name}>Confirm New Password</FieldLabel>
+                        <Input
+                          id={field.name}
+                          type="password"
+                          value={field.state.value}
+                          onBlur={field.handleBlur}
+                          onChange={(e) => field.handleChange(e.target.value)}
+                        />
+                        <FieldError />
+                      </Field>
+                    )}
+                  />
+                </div>
+                <Button type="submit" variant="secondary" disabled={loading}>
+                  {loading && <Loader2 className="mr-2 h-4 w-4 animate-spin" />}
+                  Change Password
+                </Button>
+              </form>
+            </CardContent>
+          </Card>
+
+          {/* Danger Zone */}
+          <Card className="border-destructive/50">
+            <CardHeader>
+              <CardTitle className="text-destructive">Danger Zone</CardTitle>
+              <CardDescription>Permanently delete your account and all data.</CardDescription>
+            </CardHeader>
+            <CardFooter>
+              <Button
+                variant="destructive"
+                onClick={async () => {
+                  if (
+                    confirm(
+                      "Are you sure you want to delete your account? This action cannot be undone.",
+                    )
+                  ) {
+                    const { error } = await authClient.deleteUser();
+                    if (error) {
+                      toast.error(error.message || "Failed to delete account");
+                    } else {
+                      window.location.reload();
+                    }
+                  }
+                }}
+              >
+                Delete Account
+              </Button>
+            </CardFooter>
+          </Card>
+        </div>
+      </div>
+    </div>
+  );
+}

package/template/apps/desktop/src/renderer/src/routes/_auth/dashboard.tsx

@@ -0,0 +1,46 @@
+import { createFileRoute } from "@tanstack/react-router";
+import { authClient } from "@/lib/auth-client";
+import { useSecretData } from "@workspace/orpc/react";
+
+export const Route = createFileRoute("/_auth/dashboard")({
+  component: Dashboard,
+});
+
+function Dashboard() {
+  const { data: sessionData } = authClient.useSession();
+  const user = sessionData?.user;
+  const { data: secretData, isLoading, error } = useSecretData();
+
+  if (!user) return null;
+
+  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">
+        <div>
+          <h1 className="text-2xl font-bold">Dashboard</h1>
+          <p>Welcome, {user.name}!</p>
+          <p>This is a protected page. Only authenticated users can see this.</p>
+
+          <div className="mt-6 rounded-lg border bg-gray-50 p-4 dark:bg-zinc-900">
+            <h2 className="font-semibold mb-2">Secure oRPC Data:</h2>
+            <p className="font-mono text-xs">
+              {isLoading ? "Loading secret..." : error ? "Error: " + error.message : secretData?.secret}
+            </p>
+          </div>
+
+          <div className="mt-4 flex gap-2">
+            <button
+              onClick={async () => {
+                await authClient.signOut();
+                window.location.reload();
+              }}
+              className="rounded bg-red-500 px-4 py-2 text-white hover:bg-red-600"
+            >
+              Sign Out
+            </button>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+}

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

@@ -0,0 +1,35 @@
+import { createFileRoute } from "@tanstack/react-router";
+import { useSecretData } from "@workspace/orpc/react";
+import { authClient } from "@/lib/auth-client";
+
+export const Route = createFileRoute("/_auth/examples/client-orpc-auth")({
+  component: ClientORPCAuth,
+});
+
+function ClientORPCAuth() {
+  const { data: sessionData } = authClient.useSession();
+  const session = sessionData;
+
+  const { data, isLoading } = useSecretData();
+
+  return (
+    <div className="flex flex-col gap-4">
+      <h1 className="text-2xl font-bold">Client + oRPC (Authenticated)</h1>
+      <p>This page is protected and fetches secret data on the client using TanStack Query.</p>
+
+      <div className="rounded-lg border p-4">
+        <h2 className="font-semibold">User Session:</h2>
+        <pre className="text-xs bg-muted p-2 rounded dark:bg-zinc-900 overflow-auto">{JSON.stringify(session, null, 2)}</pre>
+      </div>
+
+      <div className="rounded-lg border p-4">
+        <h2 className="font-semibold">Secret Data (Client-side):</h2>
+        {isLoading ? (
+          <p>Loading...</p>
+        ) : (
+          <pre className="text-xs bg-muted p-2 rounded dark:bg-zinc-900 overflow-auto">{JSON.stringify(data, null, 2)}</pre>
+        )}
+      </div>
+    </div>
+  );
+}

package/template/apps/desktop/src/renderer/src/routes/_auth.tsx

@@ -0,0 +1,35 @@
+import { Outlet, createFileRoute, redirect } from "@tanstack/react-router";
+import { SidebarProvider, SidebarTrigger } from "@workspace/ui/components/sidebar";
+import { AuthSidebar } from "@/components/app-sidebar";
+import { authClient } from "@/lib/auth-client";
+
+export const Route = createFileRoute("/_auth")({
+  beforeLoad: async ({ location }) => {
+    const session = await authClient.getSession();
+    if (!session.data) {
+      throw redirect({
+        to: "/login",
+        search: {
+          redirect: location.href,
+        },
+      });
+    }
+  },
+  component: AuthLayout,
+});
+
+function AuthLayout() {
+  return (
+    <SidebarProvider>
+      <AuthSidebar />
+      <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 />
+        </header>
+        <div className="flex-1 overflow-auto p-4">
+          <Outlet />
+        </div>
+      </main>
+    </SidebarProvider>
+  );
+}