create-vexcms 0.0.20 → 0.1.0-alpha.2

package/templates/base-nextjs/src/auth/serverUtils.ts

@@ -4,15 +4,17 @@ import { cookies } from "next/headers"
 
 export async function getSessionToken() {
   const cookieStore = await cookies()
-  // In production (HTTPS), Better Auth prefixes cookies with __Secure-
-  const sessionToken =
-    cookieStore.get("__Secure-better-auth.session_token")?.value.split(".")[0] ??
-    cookieStore.get("better-auth.session_token")?.value.split(".")[0]
-  if (!sessionToken) {
-    console.error("Error getting session token")
-    return null
+  const sessionTokenCookie = cookieStore.get("better-auth.session_token")?.value
+
+  if (!sessionTokenCookie) return null
+
+  // better-auth stores tokens as "<raw_token>.<hmac_signature>" (2 parts, not a JWT)
+  // The raw token (first part) is what's indexed in the DB by_token
+  if (sessionTokenCookie.includes(".")) {
+    return sessionTokenCookie.split(".")[0]
   }
-  return sessionToken
+
+  return sessionTokenCookie
 }
 
 /**
@@ -22,17 +24,12 @@ export async function getSessionToken() {
 export const getCurrentUser = async () => {
   try {
     const sessionToken = await getSessionToken()
-
-    if (!sessionToken) {
-      return null
-    }
+    if (!sessionToken) return null
 
     const session = await fetchQuery(api.auth.sessions.getSessionWithUser, {
       sessionToken,
     })
-    if (!session?.user) {
-      return null
-    }
+    if (!session?.user) return null
     return session.user
   } catch (error) {
     console.error("Error getting current user:", error)
@@ -46,22 +43,15 @@ export const getCurrentUser = async () => {
 export async function getSession() {
   try {
     const sessionToken = await getSessionToken()
-
-    if (!sessionToken) {
-      console.log("no session token")
-      return null
-    }
+    if (!sessionToken) return null
 
     const session = await fetchQuery(api.auth.sessions.getSessionWithUser, {
       sessionToken,
     })
-    if (!session?.user) {
-      console.log("no session")
-      return null
-    }
+    if (!session?.user) return null
     return session
   } catch (error) {
-    console.error("Error getting session:", error)
+    console.error("[getSession] Error:", error)
     return null
   }
 }

package/templates/base-nextjs/src/components/WelcomePage.tsx

@@ -0,0 +1,116 @@
+"use client"
+
+import { useMutation, useQuery } from "convex/react"
+import { usePathname, useRouter } from "next/navigation"
+import { useEffect, useState } from "react"
+
+import { api } from "@convex/_generated/api"
+import { useSession } from "~/auth/client"
+
+function LoadingSpinner() {
+  return (
+    <svg className="animate-spin h-4 w-4" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24">
+      <circle className="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" strokeWidth="4" />
+      <path
+        className="opacity-75"
+        fill="currentColor"
+        d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
+      />
+    </svg>
+  )
+}
+
+/**
+ * Landing UI for a project that has not been bootstrapped yet (no admin user),
+ * and the "Go to Admin" / "Sign in" entry point once it has.
+ *
+ * Renders directly on `templates/base-nextjs`'s home route (no `pages`
+ * collection exists there). The marketing overlay's `PageContent` renders it
+ * as a fallback instead, when `pages.getBySlug("home")` returns no document.
+ *
+ * Promotes the first signed-in user to admin exactly once: `promoteFirstAdmin`
+ * is a Convex mutation, so concurrent signups cannot both win — Convex
+ * serializes mutations, and the loser observes `isBootstrapped` already true.
+ */
+export function WelcomePage() {
+  const isBootstrapped = useQuery(api.vex.firstUser.isBootstrapped)
+  const promoteFirstAdmin = useMutation(api.vex.firstUser.promoteFirstAdmin)
+  const { data: session } = useSession()
+  const router = useRouter()
+  const pathname = usePathname()
+  const [promoting, setPromoting] = useState(false)
+  const [navigating, setNavigating] = useState(false)
+
+  // Reset navigating state when the user comes back to the home page
+  // (e.g. closing the intercepting auth dialog)
+  useEffect(() => {
+    if (pathname === "/") {
+      setNavigating(false)
+    }
+  }, [pathname])
+
+  // If the user is signed in and this is a fresh project, try to promote them
+  useEffect(() => {
+    if (session?.user && isBootstrapped === false && !promoting) {
+      setPromoting(true)
+      setNavigating(true)
+      promoteFirstAdmin()
+        .then((result) => {
+          if (result.promoted) {
+            router.push("/admin")
+          } else {
+            setNavigating(false)
+          }
+        })
+        .catch(() => {
+          setPromoting(false)
+          setNavigating(false)
+        })
+    }
+  }, [session, isBootstrapped, promoting, promoteFirstAdmin, router])
+
+  // Treat undefined (query still loading) as not bootstrapped — show the welcome page immediately
+  const bootstrapped = isBootstrapped === true
+
+  const buttonClass =
+    "inline-flex items-center justify-center gap-2 rounded-md bg-primary px-6 py-3 text-sm font-medium text-primary-foreground shadow hover:bg-primary/90 disabled:opacity-50 disabled:cursor-not-allowed transition-opacity"
+
+  const handleNavigate = (path: string) => {
+    setNavigating(true)
+    router.push(path)
+  }
+
+  return (
+    <div className="flex min-h-screen flex-col items-center justify-center gap-8 p-8">
+      <div className="text-center">
+        <h1 className="text-4xl font-bold tracking-tight">VexCMS</h1>
+        <p className="mt-3 text-lg text-muted-foreground">
+          {bootstrapped
+            ? "Your content management system is ready."
+            : "Welcome! Create your admin account to get started."}
+        </p>
+      </div>
+
+      <div className="flex gap-4">
+        {session?.user ? (
+          <button onClick={() => handleNavigate("/admin")} disabled={navigating} className={buttonClass}>
+            {navigating && <LoadingSpinner />}
+            {navigating ? "Loading..." : "Go to Admin Panel"}
+          </button>
+        ) : bootstrapped ? (
+          <button onClick={() => handleNavigate("/auth/sign-in")} disabled={navigating} className={buttonClass}>
+            {navigating && <LoadingSpinner />}
+            {navigating ? "Loading..." : "Sign In"}
+          </button>
+        ) : (
+          <button onClick={() => handleNavigate("/auth/sign-up")} disabled={navigating} className={buttonClass}>
+            {navigating && <LoadingSpinner />}
+            {navigating ? "Loading..." : "Create Admin Account"}
+          </button>
+        )}
+      </div>
+
+      {promoting && <p className="text-sm text-muted-foreground animate-pulse">Setting up your admin account...</p>}
+    </div>
+  )
+}