added sign in page for next auth and updated callbackurls

kirentanna · Feb 7, 2024 · bfead30 · bfead30
1 parent 5e21799
commit bfead30
Show file tree

Hide file tree

Showing 6 changed files with 47 additions and 7 deletions.
diff --git a/src/commands/add/auth/lucia/generators.ts b/src/commands/add/auth/lucia/generators.ts
@@ -65,7 +65,7 @@ import { Label } from "${alias}/components/ui/label";
 
 const Page = async () => {
   return (
-    <main className="max-w-lg mx-auto my-4 bg-secondary p-10">
+    <main className="max-w-lg mx-auto my-4 bg-popover p-10">
       <h1 className="text-2xl font-bold text-center">Create an account</h1>
       <AuthForm action="/api/sign-up">
         <Label htmlFor="username" className="text-muted-foreground">
@@ -100,7 +100,7 @@ import Link from "next/link";
 
 const Page = async () => {
   return (
-    <main className="max-w-lg mx-auto my-4 bg-neutral-100 p-10">
+    <main className="max-w-lg mx-auto my-4 bg-white p-10">
       <h1 className="text-2xl font-bold text-center">Create an account</h1>
       <AuthForm action="/api/sign-up">
         <label
@@ -158,7 +158,7 @@ import Link from "next/link";
 
 const Page = async () => {
   return (
-    <main className="max-w-lg mx-auto my-4 bg-secondary p-10">
+    <main className="max-w-lg mx-auto my-4 bg-popover p-10">
       <h1 className="text-2xl font-bold text-center">
         Sign in to your account
       </h1>
@@ -198,7 +198,7 @@ import Link from "next/link";
 
 const Page = async () => {
   return (
-    <main className="max-w-lg mx-auto my-4 bg-neutral-100 p-10">
+    <main className="max-w-lg mx-auto my-4 bg-white p-10">
       <h1 className="text-2xl font-bold text-center">
         Sign in to your account
       </h1>

diff --git a/src/commands/add/auth/next-auth/generators.ts b/src/commands/add/auth/next-auth/generators.ts
@@ -453,7 +453,7 @@ export default function SignIn() {
           Signed in as{" "}
           <span className="font-medium">{session.user?.email}</span>
         </p>
-        <Button variant={"destructive"} onClick={() => signOut()}>
+        <Button variant={"destructive"} onClick={() => signOut({ callbackUrl: "/" })}>
           Sign out
         </Button>
       </div>
@@ -485,7 +485,7 @@ export default function SignIn() {
           <span className="font-medium">{session.user?.email}</span>
         </p>
         <button
-          onClick={() => signOut()}
+          onClick={() => signOut({ callbackUrl: "/" })}
           className="py-2.5 px-3.5 rounded-md bg-red-500 text-white hover:opacity-80 text-sm"
         >
           Sign out
@@ -667,3 +667,30 @@ export default async function Home() {
 }
 `;
 };
+
+export const generateSignInPage = () => {
+  return `"use client";
+
+import { signIn } from "next-auth/react";
+
+const Page = () => {
+  return (
+    <main className="bg-popover max-w-lg mx-auto my-4 rounded-lg p-10">
+      <h1 className="text-2xl font-bold text-center">
+        Sign in to your account
+      </h1>
+      <div className="mt-4">
+        <button
+          onClick={() => signIn(undefined, { callbackUrl: "/dashboard" })}
+          className="w-full bg-primary text-primary-foreground text-center hover:opacity-90 font-medium px-4 py-2 rounded-lg block"
+        >
+          Sign In
+        </button>
+      </div>
+    </main>
+  );
+};
+
+export default Page;
+`;
+};
diff --git a/src/commands/add/auth/next-auth/index.ts b/src/commands/add/auth/next-auth/index.ts
@@ -12,6 +12,7 @@ import {
   createDrizzleAuthSchema,
   createPrismaAuthSchema,
   createSignInComponent,
+  generateSignInPage,
   generateUpdatedRootRoute,
   libAuthProviderTsx,
   libAuthUtilsTs,
@@ -120,6 +121,15 @@ export const addNextAuth = async (
     generateUpdatedRootRoute()
   );
 
+  // generate sign in page
+  createFile(
+    formatFilePath(nextAuth.signInPage, {
+      removeExtension: false,
+      prefix: "rootPath",
+    }),
+    generateSignInPage()
+  );
+
   // add to env
   addToDotEnv(
     [

diff --git a/src/commands/add/componentLib/shadcn-ui/index.ts b/src/commands/add/componentLib/shadcn-ui/index.ts
@@ -160,7 +160,7 @@ export default function SignIn() {
     return (
       <>
         Signed in as {session.user?.email} <br />
-        <Button variant={"destructive"} onClick={() => signOut()}>Sign out</Button>
+        <Button variant={"destructive"} onClick={() => signOut({ callbackUrl: "/" })}>Sign out</Button>
       </>
     );
   }

diff --git a/src/commands/filePaths/index.ts b/src/commands/filePaths/index.ts
@@ -95,6 +95,7 @@ export const paths: { t3: Paths; normal: Paths } = {
       signOutButtonComponent: "components/auth/SignOutBtn.tsx",
       nextAuthApiRoute: "app/api/auth/[...nextauth]/route.ts",
       authProviderComponent: "lib/auth/Provider.tsx",
+      signInPage: "app/(auth)/sign-in/page.tsx",
     },
   },
   t3: {
@@ -191,6 +192,7 @@ export const paths: { t3: Paths; normal: Paths } = {
       signOutButtonComponent: "components/auth/SignOutBtn.tsx",
       nextAuthApiRoute: "app/api/auth/[...nextauth]/route.ts",
       authProviderComponent: "lib/auth/Provider.tsx",
+      signInPage: "app/(auth)/sign-in/page.tsx",
     },
   },
 };

diff --git a/src/commands/filePaths/types.d.ts b/src/commands/filePaths/types.d.ts
@@ -39,6 +39,7 @@ export type Paths = {
     nextAuthApiRoute: string;
     authProviderComponent: string;
     signOutButtonComponent: string;
+    signInPage: string;
   };
   clerk: {
     middleware: string;