few adjustement

vvo · Jun 14, 2024 · a215c9c · a215c9c
1 parent 5406d64
commit a215c9c
Show file tree

Hide file tree

Showing 2 changed files with 21 additions and 6 deletions.
diff --git a/examples/next/src/app/app-router-magic-links/form.tsx b/examples/next/src/app/app-router-magic-links/form.tsx
@@ -58,7 +58,11 @@ function LoginForm() {
         />
       </label>
       <div>
-        <input type="submit" value="Login" className={css.button} />
+        <input
+          type="submit"
+          value="Get magic login link"
+          className={css.button}
+        />
       </div>
     </form>
   );

diff --git a/examples/next/src/app/app-router-magic-links/session/route.ts b/examples/next/src/app/app-router-magic-links/session/route.ts
@@ -18,11 +18,22 @@ export async function POST(request: NextRequest) {
     },
   );
 
-  return Response.json({
-    ok: true,
-    // Ideally this would be an email or text message with a link to the magic link route
-    magic_link: `${process.env.PUBLIC_URL}/app-router-magic-links/magic-login?seal=${seal}`,
-  });
+  // In a real application you would send back this data and use it to send an email
+  // For the example purposes we will just display a webpage
+  // return Response.json({
+  //   ok: true,
+  //   // Ideally this would be an email or text message with a link to the magic link route
+  //   magic_link: `${process.env.PUBLIC_URL}/app-router-magic-links/magic-login?seal=${seal}`,
+  // });
+  const link = `${process.env.NEXT_PUBLIC_VERCEL_URL || process.env.NEXT_PUBLIC_URL}/app-router-magic-links/magic-login?seal=${seal}`;
+  return new Response(
+    `<h1>Here is your magic link:</h1><h3><a href="${link}">${link}</a></h3><h3>You can now open this link in a private browser window and see yourself being logged in immediately.</h3><h3>👈 <a href="/app-router-magic-links">Go back</a></h3>`,
+    {
+      headers: {
+        "content-type": "text/html; charset=utf-8",
+      },
+    },
+  );
 }
 
 // /app-router-magic-links/session