From e36dadf97ff55e1dea761c1536b87548a2b17688 Mon Sep 17 00:00:00 2001
From: httpjamesm <github@httpjames.space>
Date: Sun, 24 Dec 2023 15:51:31 -0500
Subject: [PATCH] feat: create new passkeys

---
 apps/accounts/src/pages/passkeys/index.tsx | 43 +++++++++++++++++++++-
 1 file changed, 42 insertions(+), 1 deletion(-)

diff --git a/apps/accounts/src/pages/passkeys/index.tsx b/apps/accounts/src/pages/passkeys/index.tsx
index 4967ab3f1..01d08013d 100644
--- a/apps/accounts/src/pages/passkeys/index.tsx
+++ b/apps/accounts/src/pages/passkeys/index.tsx
@@ -1,10 +1,51 @@
 import { CenteredFlex } from '@ente/shared/components/Container';
 import SingleInputForm from '@ente/shared/components/SingleInputForm';
 import { Box } from '@mui/material';
+import {
+    finishPasskeyRegistration,
+    getPasskeyRegistrationOptions,
+} from '../../services/passkeysService';
+import { logError } from '@ente/shared/sentry';
+import _sodium from 'libsodium-wrappers';
 
 const Passkeys = () => {
     const handleSubmit = async (inputValue: string) => {
-        console.log('inputValue', inputValue);
+        const response: {
+            options: {
+                publicKey: PublicKeyCredentialCreationOptions;
+            };
+            sessionID: string;
+        } = await getPasskeyRegistrationOptions();
+
+        const options = response.options;
+
+        options.publicKey.challenge = _sodium.from_base64(
+            // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+            // @ts-ignore
+            options.publicKey.challenge
+        );
+        options.publicKey.user.id = _sodium.from_base64(
+            // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+            // @ts-ignore
+            options.publicKey.user.id
+        );
+
+        // create new credential
+        let newCredential: Credential;
+
+        try {
+            newCredential = await navigator.credentials.create(options);
+        } catch (e) {
+            return logError(e, 'Error creating credential');
+        }
+
+        const finishResponse = await finishPasskeyRegistration(
+            inputValue,
+            newCredential,
+            response.sessionID
+        );
+
+        console.log(finishResponse);
     };
 
     return (