fix(clerk): upgrade to @clerk/tanstack-react-start and correct exports

Changes:
- Replaced @clerk/clerk-react with @clerk/tanstack-react-start in package.json & info.json
- Updated provider.tsx, header-user.tsx, and demo/clerk.tsx imports to new package
- Replaced non-existent SignedIn/SignedOut components with <Show when='...'> in header-user.tsx
- Added src/start.ts integrating clerkMiddleware() into createStart()
- Registered CLERK_SECRET_KEY as required/secret in info.json and scaffolded .env.local

Author: Meet-08

packages/create/src/frameworks/react/add-ons/clerk/assets/_dot_env.local.append

@@ -1,2 +1,3 @@
 # Clerk configuration, get this key from your [Dashboard](dashboard.clerk.com)
 VITE_CLERK_PUBLISHABLE_KEY=
+CLERK_SECRET_KEY=

packages/create/src/frameworks/react/add-ons/clerk/assets/src/integrations/clerk/header-user.tsx

@@ -1,19 +1,14 @@
-import {
-  SignedIn,
-  SignInButton,
-  SignedOut,
-  UserButton,
-} from '@clerk/clerk-react'
+import { Show, SignInButton, UserButton } from '@clerk/tanstack-react-start'
 
 export default function HeaderUser() {
   return (
     <>
-      <SignedIn>
+      <Show when="signed-in">
         <UserButton />
-      </SignedIn>
-      <SignedOut>
+      </Show>
+      <Show when="signed-out">
         <SignInButton />
-      </SignedOut>
+      </Show>
     </>
   )
 }

packages/create/src/frameworks/react/add-ons/clerk/assets/src/integrations/clerk/provider.tsx

@@ -1,4 +1,4 @@
-import { ClerkProvider } from '@clerk/clerk-react'
+import { ClerkProvider } from '@clerk/tanstack-react-start'
 
 const PUBLISHABLE_KEY = import.meta.env.VITE_CLERK_PUBLISHABLE_KEY
 if (!PUBLISHABLE_KEY) {

packages/create/src/frameworks/react/add-ons/clerk/assets/src/routes/demo/clerk.tsx

@@ -1,5 +1,5 @@
+import { useUser } from '@clerk/tanstack-react-start'
 import { createFileRoute } from '@tanstack/react-router'
-import { useUser } from '@clerk/clerk-react'
 
 export const Route = createFileRoute('/demo/clerk')({
   component: App,

packages/create/src/frameworks/react/add-ons/clerk/assets/src/start.ts

@@ -0,0 +1,8 @@
+import { clerkMiddleware } from '@clerk/tanstack-react-start/server'
+import { createStart } from '@tanstack/react-start'
+
+export const startInstance = createStart(() => {
+  return {
+    requestMiddleware: [clerkMiddleware()],
+  }
+})

packages/create/src/frameworks/react/add-ons/clerk/info.json

@@ -36,6 +36,18 @@
       "required": true,
       "secret": false,
       "file": ".env.local"
+    },
+    {
+      "name": "CLERK_SECRET_KEY",
+      "description": "Clerk secret key",
+      "required": true,
+      "secret": true,
+      "file": ".env.local"
+    }
+  ],
+  "packageAdditions": {
+    "dependencies": {
+      "@clerk/tanstack-react-start": "^1.0.4"
     }
-  ]
+  }
 }

packages/create/src/frameworks/react/add-ons/clerk/package.json

@@ -1,5 +1,5 @@
 {
   "dependencies": {
-    "@clerk/clerk-react": "^5.61.3"
+    "@clerk/tanstack-react-start": "^1.0.4"
   }
 }