creds

src/App.tsx

@@ -1,4 +1,4 @@
-import { useEffect, useState } from 'react'
+import { useState } from 'react'
 import reactLogo from './assets/react.svg'
 import twaLogo from './assets/tapps.png'
 import viteLogo from '/vite.svg'
@@ -25,6 +25,8 @@ function App() {
 
   const cartridgeConnector = connectors[0]
 
+  const [credentials, setCredentials] = useState<Credential | null>(null)
+
   return (
     <>
       <div>
@@ -79,6 +81,34 @@ function App() {
       }}>
         ok
       </button>
+      <button onClick={async () => {
+        const publicKeyCredentialCreationOptions = {
+          challenge: new Uint8Array(32), // You should generate this on your server
+          rp: {
+            name: "Your App Name",
+            id: "your-domain.com",
+          },
+          user: {
+            id: new Uint8Array(16), // You should generate a unique user ID
+            name: "[email protected]",
+            displayName: "User Name",
+          },
+          pubKeyCredParams: [{ alg: -7, type: "public-key" }],
+          authenticatorSelection: {
+            authenticatorAttachment: "platform",
+          },
+          timeout: 60000,
+        } as PublicKeyCredentialCreationOptions;
+
+        // Create credentials
+        const credentials = await navigator.credentials.create({
+          publicKey: publicKeyCredentialCreationOptions
+        })
+
+        setCredentials(credentials)
+      }}>
+        {JSON.stringify(credentials) ?? 'create'}
+      </button>
       <div className="card">
         <button onClick={() => WebApp.BiometricManager.openSettings()}>
             Bio settings