EC-002: CSRF Isomorphism

lib/auth/constants.ts

@@ -39,9 +39,13 @@ export const authOptions: AuthOptions = {
     },
   },
   callbacks: {
-    // async signIn() {
-
-    // },
+    async signIn() {
+      // extra sign-in checks
+      return true;
+    },
+    async redirect({ url, baseUrl }) {
+      return url.startsWith(baseUrl) ? Promise.resolve(url) : Promise.resolve(baseUrl);
+    },
     async jwt({ user, token }) {
       if (user) {
         // Note that this if condition is needed
@@ -60,8 +64,8 @@ export const authOptions: AuthOptions = {
   pages: {
     signIn: '/signin',
     signOut: '/',
-    // error: '/api/rm/v0/auth/error', // Error code passed in query string as ?error=
-    // verifyRequest: '/api/rm/v0/auth/verify-request', // (used for check email message)
+    error: '/error', // Error code passed in query string as ?error=
+    verifyRequest: '/verify', // (used for check email message)
     // newUser: '/' // New users will be directed here on first sign in (leave the property out if not of interest)
   },
 };

src/app/api/auth/[...nextauth]/route.ts

@@ -1,5 +1,4 @@
 // api/auth/route.ts simple poc
-
 // [...nextauth].ts// auth.ts TS-Doc?
 import NextAuth from 'next-auth';
 import { finalAuth } from '@auth/adapter';

src/app/components/client/signup-view.tsx

@@ -91,6 +91,7 @@ export const VSignUp = ({ providers, user, csrf }: VSignUpProps) => {
 			<div> 
         <form action={defaultP.signinUrl} method="post">
           <input type="hidden" name="csrfToken" defaultValue={csrf} />
+          <input type="hidden" name="callbackUrl" value="/verify" />
           <Input
             id={`input-email-for-${defaultP.id}-provider`}
             autoFocus

src/app/error/page.tsx

@@ -0,0 +1,15 @@
+// signin/page.tsx TS-Doc?
+'use server';
+import styles from '@styles/page.module.css';
+
+export default async function SignUp() {
+  return (
+    <main className={styles.main}>
+      <article>
+        <img className={styles.logo} src="/logo.svg" />
+        <p>There was an error logging you in.</p>
+        <p>Please be patient, this is still an Alpha release and not official.</p>
+      </article>
+    </main>
+  );
+}

src/app/signin/page.tsx

@@ -38,8 +38,16 @@ async function getProvidersData(): Promise<ISignInData> {
 export default async function SignUp() {
   const props: ISignInData = await getProvidersData();
   const providers: IAuthProviders[] = props?.providers || [];
-  cookies();
-  const csrf: string | undefined = await getCsrfToken();
+  const cook = cookies();
+  const cookieCsrf: string | undefined = await getCsrfToken({
+    req: {
+      headers: {
+        cookie: cook.toString(),
+      },
+    },
+  });
+  const newCsrf: string | undefined = await getCsrfToken();
+  const csrf = cookieCsrf || newCsrf;
   return (
     <main className={styles.main}>
       <article>

src/app/verify/page.tsx

@@ -0,0 +1,15 @@
+// signin/page.tsx TS-Doc?
+'use server';
+import styles from '@styles/page.module.css';
+
+export default async function SignUp() {
+  return (
+    <main className={styles.main}>
+      <article>
+        <img className={styles.logo} src="/logo.svg" />
+        <p>Please check your email.</p>
+        <p>There should be a login link there.</p>
+      </article>
+    </main>
+  );
+}