fix: added the missing code from the merge conflict.

danny-avila · Feb 12, 2025 · 091d4f3 · 091d4f3
1 parent 1cb1c91
commit 091d4f3
Show file tree

Hide file tree

Showing 4 changed files with 303 additions and 30 deletions.
diff --git a/api/package.json b/api/package.json
@@ -96,6 +96,7 @@
     "passport-jwt": "^4.0.1",
     "passport-ldapauth": "^3.0.1",
     "passport-local": "^1.0.0",
+    "passport-simple-webauthn2": "^3.0.5",
     "sharp": "^0.32.6",
     "tiktoken": "^1.0.15",
     "traverse": "^0.6.7",

diff --git a/client/src/components/Auth/AuthLayout.tsx b/client/src/components/Auth/AuthLayout.tsx
@@ -5,6 +5,8 @@ import SocialLoginRender from './SocialLoginRender';
 import { ThemeSelector } from '~/components/ui';
 import { Banner } from '../Banners';
 import Footer from './Footer';
+import { useState } from 'react';
+import PasskeyAuth from '~/components/Auth/PasskeyAuth';
 
 const ErrorRender = ({ children }: { children: React.ReactNode }) => (
   <div className="mt-16 flex justify-center">
@@ -57,6 +59,12 @@ function AuthLayout({
     return null;
   };
 
+  // Determine the mode from the URL: if the pathname contains "register" then mode is "register", else "login"
+  const mode = pathname.includes('register') ? 'register' : 'login';
+
+  // Local state to toggle between the default form (children) and the passkey view.
+  const [showPasskey, setShowPasskey] = useState(false);
+
   return (
     <div className="relative flex min-h-screen flex-col bg-white dark:bg-gray-900">
       <Banner />
@@ -84,9 +92,20 @@ function AuthLayout({
               {header}
             </h1>
           )}
-          {children}
-          {(pathname.includes('login') || pathname.includes('register')) && (
-            <SocialLoginRender startupConfig={startupConfig} />
+          {/* Conditionally render the default content or the PasskeyAuth component */}
+          {showPasskey ? (
+            <PasskeyAuth mode={mode} onBack={() => setShowPasskey(false)} />
+          ) : (
+            <>
+              {children}
+              {(pathname.includes('login') || pathname.includes('register')) && (
+                <SocialLoginRender
+                  startupConfig={startupConfig}
+                  mode={mode}
+                  onPasskeyClick={() => setShowPasskey(true)}
+                />
+              )}
+            </>
           )}
         </div>
       </div>

diff --git a/client/src/locales/en/translation.json b/client/src/locales/en/translation.json
@@ -861,5 +861,11 @@
   "com_ui_yes": "Yes",
   "com_ui_zoom": "Zoom",
   "com_user_message": "You",
-  "com_warning_resubmit_unsupported": "Resubmitting the AI message is not supported for this endpoint."
+  "com_warning_resubmit_unsupported": "Resubmitting the AI message is not supported for this endpoint.",
+  "com_auth_passkey_login": "Login with Passkey",
+  "com_auth_passkey_register": "Register with Passkey",
+  "com_auth_loading": "Loading...",
+  "com_auth_back_to_register": "Back to registration",
+  "com_nav_passkeys": "Passkeys",
+  "com_nav_view_passkeys": "View Passkeys"
 }