v0.3.20

apps/client/package.json

@@ -10,12 +10,12 @@
     "test:e2e": "playwright test"
   },
   "dependencies": {
-    "@auth/drizzle-adapter": "^0.5.1",
-    "@sentry/nextjs": "^7.99.0",
+    "@auth/drizzle-adapter": "^0.6.3",
+    "@sentry/nextjs": "^7.100.1",
     "@tanstack/react-query": "^5.18.1",
-    "@upstash/ratelimit": "^1.0.0",
+    "@upstash/ratelimit": "^1.0.1",
     "@upstash/redis": "^1.28.3",
-    "@vercel/analytics": "^1.1.2",
+    "@vercel/analytics": "^1.1.3",
     "@xstate/react": "^4.0.3",
     "autoprefixer": "10.4.17",
     "clsx": "^2.1.0",
@@ -24,7 +24,7 @@
     "framer-motion": "^11.0.3",
     "next": "^14.1.0",
     "next-auth": "^4.24.5",
-    "postcss": "8.4.33",
+    "postcss": "8.4.35",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-hot-toast": "^2.4.1",
@@ -36,14 +36,14 @@
     "tailwindcss": "^3.4.1",
     "typescript": "5.3.3",
     "use-sound": "^4.0.1",
-    "xstate": "^5.6.0"
+    "xstate": "^5.6.2"
   },
   "devDependencies": {
     "@playwright/test": "^1.41.2",
     "@tailwindcss/typography": "^0.5.10",
     "@types/node": "^20.11.16",
-    "@types/react": "^18.2.52",
-    "@types/react-dom": "^18.2.18",
+    "@types/react": "^18.2.55",
+    "@types/react-dom": "^18.2.19",
     "eslint-config-custom": "workspace:*",
     "prettier-plugin-tailwindcss": "^0.5.11",
     "tsconfig": "workspace:*"

apps/client/src/app/create-account/[nickname]/page.tsx

@@ -0,0 +1,63 @@
+import Link from "next/link";
+import { getServerSession } from "next-auth/next";
+
+import Footer from "@ai/components/footer";
+import Friend from "@ai/components/game/friend";
+import Header from "@ai/components/header";
+import { authOptions } from "@ai/pages/api/auth/[...nextauth]";
+import { redirect } from "next/navigation";
+import { ContinueWithGoogleButton } from "@ai/components/sign-in-form";
+
+export default async function CreateAccountPage({
+  params,
+  searchParams,
+}: {
+  params: { nickname: string };
+  searchParams: { [key: string]: string | string[] | undefined };
+}) {
+  const session = await getServerSession(authOptions());
+
+  if (session) {
+    redirect("/");
+  }
+
+  const nickname = decodeURI(params.nickname);
+
+  const roomCode = Array.isArray(searchParams?.code)
+    ? searchParams?.code[0]
+    : typeof searchParams?.code === "string"
+      ? decodeURI(searchParams?.code)
+      : undefined;
+
+  return (
+    <>
+      <Header session={session} />
+      <main className="container mx-auto flex items-center justify-center px-4 pb-16 pt-48 lg:min-h-[100dvh] lg:pb-0 lg:pt-0">
+        <section>
+          <div className="mx-auto grid w-full max-w-xl grid-cols-1 gap-x-8 gap-y-4 rounded-2xl p-8 ring ring-slate-600 md:grid-cols-[8rem_1fr]">
+            <Friend className="w-32" type="SMILING" />
+            <h1 className="self-center text-2xl md:text-3xl">
+              Create an account to play for free
+            </h1>
+            <div className="md:col-start-2">
+              <ContinueWithGoogleButton
+                nickname={nickname}
+                roomCode={roomCode}
+              />
+              <p className="mt-4 text-xs">
+                Already played before?{" "}
+                <Link
+                  href={`/sign-in/${encodeURI(nickname)}${roomCode ? `?code=${encodeURI(roomCode)}` : ""}`}
+                  className="underline underline-offset-2"
+                >
+                  Sign in
+                </Link>
+              </p>
+            </div>
+          </div>
+        </section>
+      </main>
+      <Footer />
+    </>
+  );
+}