create-better-t-stack 3.9.0 → 3.11.0-pr749.7e7198c

package/templates/auth/better-auth/convex/web/react/tanstack-start/src/components/user-menu.tsx.hbs

@@ -1,49 +1,46 @@
 import {
     DropdownMenu,
     DropdownMenuContent,
+    DropdownMenuGroup,
     DropdownMenuItem,
     DropdownMenuLabel,
     DropdownMenuSeparator,
     DropdownMenuTrigger,
 } from "@/components/ui/dropdown-menu";
 import { authClient } from "@/lib/auth-client";
-import { useNavigate } from "@tanstack/react-router";
-import { Button } from "./ui/button";
 import { useQuery } from "convex/react";
 import { api } from "@{{projectName}}/backend/convex/_generated/api";
 
+import { Button } from "./ui/button";
+
 export default function UserMenu() {
-    const navigate = useNavigate();
     const user = useQuery(api.auth.getCurrentUser)
 
     return (
         <DropdownMenu>
-            <DropdownMenuTrigger asChild>
-                <Button variant="outline">{user?.name}</Button>
+            <DropdownMenuTrigger render={<Button variant="outline" />}>
+                {user?.name}
             </DropdownMenuTrigger>
             <DropdownMenuContent className="bg-card">
-                <DropdownMenuLabel>My Account</DropdownMenuLabel>
-                <DropdownMenuSeparator />
-                <DropdownMenuItem>{user?.email}</DropdownMenuItem>
-                <DropdownMenuItem asChild>
-                    <Button
+                <DropdownMenuGroup>
+                    <DropdownMenuLabel>My Account</DropdownMenuLabel>
+                    <DropdownMenuSeparator />
+                    <DropdownMenuItem>{user?.email}</DropdownMenuItem>
+                    <DropdownMenuItem
                         variant="destructive"
-                        className="w-full"
                         onClick={() => {
                             authClient.signOut({
                                 fetchOptions: {
                                     onSuccess: () => {
-                                        navigate({
-                                            to: "/dashboard",
-                                        });
+                                        location.reload();
                                     },
                                 },
                             });
                         }}
                     >
                         Sign Out
-                    </Button>
-                </DropdownMenuItem>
+                    </DropdownMenuItem>
+                </DropdownMenuGroup>
             </DropdownMenuContent>
         </DropdownMenu>
     );

package/templates/auth/better-auth/convex/web/react/tanstack-start/src/lib/auth-server.ts.hbs

@@ -1,6 +1,12 @@
-import { createAuth } from "@{{projectName}}/backend/convex/auth";
-import { setupFetchClient } from "@convex-dev/better-auth/react-start";
-import { getCookie } from "@tanstack/react-start/server";
+import { convexBetterAuthReactStart } from "@convex-dev/better-auth/react-start";
 
-export const { fetchQuery, fetchMutation, fetchAction } =
-	await setupFetchClient(createAuth, getCookie);
+export const {
+  handler,
+  getToken,
+  fetchAuthQuery,
+  fetchAuthMutation,
+  fetchAuthAction,
+} = convexBetterAuthReactStart({
+  convexUrl: process.env.VITE_CONVEX_URL!,
+  convexSiteUrl: process.env.VITE_CONVEX_SITE_URL!,
+});

package/templates/auth/better-auth/convex/web/react/tanstack-start/src/routes/api/auth/$.ts.hbs

@@ -1,11 +1,11 @@
-import { reactStartHandler } from "@convex-dev/better-auth/react-start";
 import { createFileRoute } from "@tanstack/react-router";
+import { handler } from "@/lib/auth-server";
 
 export const Route = createFileRoute("/api/auth/$")({
   server: {
     handlers: {
-      GET: ({ request }) => reactStartHandler(request),
-      POST: ({ request }) => reactStartHandler(request),
+      GET: ({ request }) => handler(request),
+      POST: ({ request }) => handler(request),
     },
   },
-});
+});

package/templates/auth/better-auth/fullstack/tanstack-start/src/routes/api/auth/$.ts.hbs

@@ -12,4 +12,4 @@ export const Route = createFileRoute('/api/auth/$')({
       },
     },
   },
-})
+})

package/templates/auth/better-auth/web/react/next/src/components/user-menu.tsx.hbs

@@ -1,16 +1,19 @@
+import Link from "next/link";
+import { useRouter } from "next/navigation";
+
 import {
   DropdownMenu,
   DropdownMenuContent,
+  DropdownMenuGroup,
   DropdownMenuItem,
   DropdownMenuLabel,
   DropdownMenuSeparator,
   DropdownMenuTrigger,
 } from "@/components/ui/dropdown-menu";
 import { authClient } from "@/lib/auth-client";
+
 import { Button } from "./ui/button";
 import { Skeleton } from "./ui/skeleton";
-import { useRouter } from "next/navigation";
-import Link from "next/link";
 
 export default function UserMenu() {
   const router = useRouter();
@@ -22,25 +25,24 @@ export default function UserMenu() {
 
   if (!session) {
     return (
-      <Button variant="outline" asChild>
-        <Link href="/login">Sign In</Link>
-      </Button>
+      <Link href="/login">
+        <Button variant="outline">Sign In</Button>
+      </Link>
     );
   }
 
   return (
     <DropdownMenu>
-      <DropdownMenuTrigger asChild>
-        <Button variant="outline">{session.user.name}</Button>
+      <DropdownMenuTrigger render={<Button variant="outline" />}>
+        {session.user.name}
       </DropdownMenuTrigger>
       <DropdownMenuContent className="bg-card">
-        <DropdownMenuLabel>My Account</DropdownMenuLabel>
-        <DropdownMenuSeparator />
-        <DropdownMenuItem>{session.user.email}</DropdownMenuItem>
-        <DropdownMenuItem asChild>
-          <Button
+        <DropdownMenuGroup>
+          <DropdownMenuLabel>My Account</DropdownMenuLabel>
+          <DropdownMenuSeparator />
+          <DropdownMenuItem>{session.user.email}</DropdownMenuItem>
+          <DropdownMenuItem
             variant="destructive"
-            className="w-full"
             onClick={() => {
               authClient.signOut({
                 fetchOptions: {
@@ -52,8 +54,8 @@ export default function UserMenu() {
             }}
           >
             Sign Out
-          </Button>
-        </DropdownMenuItem>
+          </DropdownMenuItem>
+        </DropdownMenuGroup>
       </DropdownMenuContent>
     </DropdownMenu>
   );

package/templates/auth/better-auth/web/react/react-router/src/components/user-menu.tsx.hbs

@@ -1,16 +1,18 @@
+import { Link, useNavigate } from "react-router";
+
 import {
   DropdownMenu,
   DropdownMenuContent,
+  DropdownMenuGroup,
   DropdownMenuItem,
   DropdownMenuLabel,
   DropdownMenuSeparator,
   DropdownMenuTrigger,
 } from "@/components/ui/dropdown-menu";
 import { authClient } from "@/lib/auth-client";
-import { useNavigate } from "react-router";
+
 import { Button } from "./ui/button";
 import { Skeleton } from "./ui/skeleton";
-import { Link } from "react-router";
 
 export default function UserMenu() {
   const navigate = useNavigate();
@@ -22,25 +24,24 @@ export default function UserMenu() {
 
   if (!session) {
     return (
-      <Button variant="outline" asChild>
-        <Link to="/login">Sign In</Link>
-      </Button>
+      <Link to="/login">
+        <Button variant="outline">Sign In</Button>
+      </Link>
     );
   }
 
   return (
     <DropdownMenu>
-      <DropdownMenuTrigger asChild>
-        <Button variant="outline">{session.user.name}</Button>
+      <DropdownMenuTrigger render={<Button variant="outline" />}>
+        {session.user.name}
       </DropdownMenuTrigger>
       <DropdownMenuContent className="bg-card">
-        <DropdownMenuLabel>My Account</DropdownMenuLabel>
-        <DropdownMenuSeparator />
-        <DropdownMenuItem>{session.user.email}</DropdownMenuItem>
-        <DropdownMenuItem asChild>
-          <Button
+        <DropdownMenuGroup>
+          <DropdownMenuLabel>My Account</DropdownMenuLabel>
+          <DropdownMenuSeparator />
+          <DropdownMenuItem>{session.user.email}</DropdownMenuItem>
+          <DropdownMenuItem
             variant="destructive"
-            className="w-full"
             onClick={() => {
               authClient.signOut({
                 fetchOptions: {
@@ -52,8 +53,8 @@ export default function UserMenu() {
             }}
           >
             Sign Out
-          </Button>
-        </DropdownMenuItem>
+          </DropdownMenuItem>
+        </DropdownMenuGroup>
       </DropdownMenuContent>
     </DropdownMenu>
   );

package/templates/auth/better-auth/web/react/tanstack-router/src/components/{user-menu.tsx → user-menu.tsx.hbs}

@@ -1,16 +1,18 @@
+import { Link, useNavigate } from "@tanstack/react-router";
+
 import {
   DropdownMenu,
   DropdownMenuContent,
+  DropdownMenuGroup,
   DropdownMenuItem,
   DropdownMenuLabel,
   DropdownMenuSeparator,
   DropdownMenuTrigger,
 } from "@/components/ui/dropdown-menu";
 import { authClient } from "@/lib/auth-client";
-import { useNavigate } from "@tanstack/react-router";
+
 import { Button } from "./ui/button";
 import { Skeleton } from "./ui/skeleton";
-import { Link } from "@tanstack/react-router";
 
 export default function UserMenu() {
   const navigate = useNavigate();
@@ -22,25 +24,24 @@ export default function UserMenu() {
 
   if (!session) {
     return (
-      <Button variant="outline" asChild>
-        <Link to="/login">Sign In</Link>
-      </Button>
+      <Link to="/login">
+        <Button variant="outline">Sign In</Button>
+      </Link>
     );
   }
 
   return (
     <DropdownMenu>
-      <DropdownMenuTrigger asChild>
-        <Button variant="outline">{session.user.name}</Button>
+      <DropdownMenuTrigger render={<Button variant="outline" />}>
+        {session.user.name}
       </DropdownMenuTrigger>
       <DropdownMenuContent className="bg-card">
-        <DropdownMenuLabel>My Account</DropdownMenuLabel>
-        <DropdownMenuSeparator />
-        <DropdownMenuItem>{session.user.email}</DropdownMenuItem>
-        <DropdownMenuItem asChild>
-          <Button
+        <DropdownMenuGroup>
+          <DropdownMenuLabel>My Account</DropdownMenuLabel>
+          <DropdownMenuSeparator />
+          <DropdownMenuItem>{session.user.email}</DropdownMenuItem>
+          <DropdownMenuItem
             variant="destructive"
-            className="w-full"
             onClick={() => {
               authClient.signOut({
                 fetchOptions: {
@@ -54,8 +55,8 @@ export default function UserMenu() {
             }}
           >
             Sign Out
-          </Button>
-        </DropdownMenuItem>
+          </DropdownMenuItem>
+        </DropdownMenuGroup>
       </DropdownMenuContent>
     </DropdownMenu>
   );

package/templates/auth/better-auth/web/react/tanstack-start/src/components/{user-menu.tsx → user-menu.tsx.hbs}

@@ -1,16 +1,18 @@
+import { Link, useNavigate } from "@tanstack/react-router";
+
 import {
   DropdownMenu,
   DropdownMenuContent,
+  DropdownMenuGroup,
   DropdownMenuItem,
   DropdownMenuLabel,
   DropdownMenuSeparator,
   DropdownMenuTrigger,
 } from "@/components/ui/dropdown-menu";
 import { authClient } from "@/lib/auth-client";
-import { useNavigate } from "@tanstack/react-router";
+
 import { Button } from "./ui/button";
 import { Skeleton } from "./ui/skeleton";
-import { Link } from "@tanstack/react-router";
 
 export default function UserMenu() {
   const navigate = useNavigate();
@@ -22,25 +24,24 @@ export default function UserMenu() {
 
   if (!session) {
     return (
-      <Button variant="outline" asChild>
-        <Link to="/login">Sign In</Link>
-      </Button>
+      <Link to="/login">
+        <Button variant="outline">Sign In</Button>
+      </Link>
     );
   }
 
   return (
     <DropdownMenu>
-      <DropdownMenuTrigger asChild>
-        <Button variant="outline">{session.user.name}</Button>
+      <DropdownMenuTrigger render={<Button variant="outline" />}>
+        {session.user.name}
       </DropdownMenuTrigger>
       <DropdownMenuContent className="bg-card">
-        <DropdownMenuLabel>My Account</DropdownMenuLabel>
-        <DropdownMenuSeparator />
-        <DropdownMenuItem>{session.user.email}</DropdownMenuItem>
-        <DropdownMenuItem asChild>
-          <Button
+        <DropdownMenuGroup>
+          <DropdownMenuLabel>My Account</DropdownMenuLabel>
+          <DropdownMenuSeparator />
+          <DropdownMenuItem>{session.user.email}</DropdownMenuItem>
+          <DropdownMenuItem
             variant="destructive"
-            className="w-full"
             onClick={() => {
               authClient.signOut({
                 fetchOptions: {
@@ -54,8 +55,8 @@ export default function UserMenu() {
             }}
           >
             Sign Out
-          </Button>
-        </DropdownMenuItem>
+          </DropdownMenuItem>
+        </DropdownMenuGroup>
       </DropdownMenuContent>
     </DropdownMenu>
   );

package/templates/backend/convex/packages/backend/convex/README.md

@@ -6,7 +6,7 @@ See https://docs.convex.dev/functions for more.
 A query function that takes two arguments looks like:
 
 ```ts
-// functions.js
+// convex/myFunctions.ts
 import { query } from "./_generated/server";
 import { v } from "convex/values";
 
@@ -36,7 +36,7 @@ export const myQueryFunction = query({
 Using this query function in a React component looks like:
 
 ```ts
-const data = useQuery(api.functions.myQueryFunction, {
+const data = useQuery(api.myFunctions.myQueryFunction, {
   first: 10,
   second: "hello",
 });
@@ -45,7 +45,7 @@ const data = useQuery(api.functions.myQueryFunction, {
 A mutation function looks like:
 
 ```ts
-// functions.js
+// convex/myFunctions.ts
 import { mutation } from "./_generated/server";
 import { v } from "convex/values";
 
@@ -73,7 +73,7 @@ export const myMutationFunction = mutation({
 Using this mutation function in a React component looks like:
 
 ```ts
-const mutation = useMutation(api.functions.myMutationFunction);
+const mutation = useMutation(api.myFunctions.myMutationFunction);
 function handleButtonPress() {
   // fire and forget, the most common way to use mutations
   mutation({ first: "Hello!", second: "me" });

package/templates/backend/convex/packages/backend/convex/convex.config.ts.hbs

@@ -0,0 +1,17 @@
+import { defineApp } from "convex/server";
+{{#if (eq auth "better-auth")}}
+import betterAuth from "@convex-dev/better-auth/convex.config";
+{{/if}}
+{{#if (includes examples "ai")}}
+import agent from "@convex-dev/agent/convex.config";
+{{/if}}
+
+const app = defineApp();
+{{#if (eq auth "better-auth")}}
+app.use(betterAuth);
+{{/if}}
+{{#if (includes examples "ai")}}
+app.use(agent);
+{{/if}}
+
+export default app;

package/templates/backend/convex/packages/backend/convex/tsconfig.json.hbs

@@ -1,7 +1,7 @@
 {
   /* This TypeScript project config describes the environment that
    * Convex functions run in and is used to typecheck them.
-   * You can modify it, but some settings required to use Convex.
+   * You can modify it, but some settings are required to use Convex.
    */
   "compilerOptions": {
     /* These settings are not required by Convex and can be modified. */

package/templates/examples/ai/convex/packages/backend/convex/agent.ts.hbs

@@ -0,0 +1,9 @@
+import { Agent } from "@convex-dev/agent";
+import { google } from "@ai-sdk/google";
+import { components } from "./_generated/api";
+
+export const chatAgent = new Agent(components.agent, {
+  name: "Chat Agent",
+  languageModel: google("gemini-2.5-flash"),
+  instructions: "You are a helpful AI assistant. Be concise and friendly in your responses.",
+});

package/templates/examples/ai/convex/packages/backend/convex/chat.ts.hbs

@@ -0,0 +1,67 @@
+import {
+  createThread,
+  listUIMessages,
+  saveMessage,
+  syncStreams,
+  vStreamArgs,
+} from "@convex-dev/agent";
+import { paginationOptsValidator } from "convex/server";
+import { v } from "convex/values";
+
+import { components, internal } from "./_generated/api";
+import { internalAction, mutation, query } from "./_generated/server";
+import { chatAgent } from "./agent";
+
+export const createNewThread = mutation({
+  args: {},
+  handler: async (ctx) => {
+    const threadId = await createThread(ctx, components.agent, {});
+    return threadId;
+  },
+});
+
+export const listMessages = query({
+  args: {
+    threadId: v.string(),
+    paginationOpts: paginationOptsValidator,
+    streamArgs: vStreamArgs,
+  },
+  handler: async (ctx, args) => {
+    const paginated = await listUIMessages(ctx, components.agent, args);
+    const streams = await syncStreams(ctx, components.agent, args);
+    return { ...paginated, streams };
+  },
+});
+
+export const sendMessage = mutation({
+  args: {
+    threadId: v.string(),
+    prompt: v.string(),
+  },
+  handler: async (ctx, { threadId, prompt }) => {
+    const { messageId } = await saveMessage(ctx, components.agent, {
+      threadId,
+      prompt,
+    });
+    await ctx.scheduler.runAfter(0, internal.chat.generateResponseAsync, {
+      threadId,
+      promptMessageId: messageId,
+    });
+    return messageId;
+  },
+});
+
+export const generateResponseAsync = internalAction({
+  args: {
+    threadId: v.string(),
+    promptMessageId: v.string(),
+  },
+  handler: async (ctx, { threadId, promptMessageId }) => {
+    await chatAgent.streamText(
+      ctx,
+      { threadId },
+      { promptMessageId },
+      { saveStreamDeltas: true },
+    );
+  },
+});