Fix feedback from previous design impl PR (#3079)

Fix feedback

Author: sea-snake

src/frontend/src/lib/components/layout/Footer.svelte

@@ -2,7 +2,7 @@
   import type { HTMLAttributes } from "svelte/elements";
   import { SOURCE_CODE_URL, SUPPORT_URL } from "$lib/config";
 
-  type Props = HTMLAttributes<HTMLHeadElement>;
+  type Props = HTMLAttributes<HTMLElement>;
 
   const { children, class: className, ...props }: Props = $props();
 </script>

src/frontend/src/lib/components/views/CreateAccount.svelte

@@ -49,6 +49,7 @@
       autocorrect="off"
       spellcheck="false"
       disabled={loading}
+      error={name.length > 32 ? "Maximum length is 32 characters." : undefined}
     />
   </div>
   <div class="mt-auto flex flex-col items-stretch gap-3">
@@ -57,7 +58,7 @@
       variant="primary"
       size="lg"
       type="submit"
-      disabled={name.length === 0 || loading}
+      disabled={name.length === 0 || name.length > 32 || loading}
     >
       {#if loading}
         <ProgressRing />

src/frontend/src/lib/components/views/CreatePasskey.svelte

@@ -50,6 +50,7 @@
       autocorrect="off"
       spellcheck="false"
       disabled={loading}
+      error={name.length > 64 ? "Maximum length is 64 characters." : undefined}
     />
   </div>
   <div class="mt-auto flex flex-col items-stretch gap-3">
@@ -58,7 +59,7 @@
       variant="primary"
       size="lg"
       type="submit"
-      disabled={name.length === 0 || loading}
+      disabled={name.length === 0 || name.length > 64 || loading}
     >
       {#if loading}
         <ProgressRing />

src/frontend/src/lib/utils/authentication/passkey.ts

@@ -42,14 +42,12 @@ export const authenticateWithPasskey = async ({
   const passkeyIdentity = DiscoverablePasskeyIdentity.useExisting({
     credentialId,
     getPublicKey: async (result) => {
-      console.log("lookup_device_key", result.rawId);
       const lookupResult = (
         await actor.lookup_device_key(new Uint8Array(result.rawId))
       )[0];
       if (isNullish(lookupResult)) {
         throw new IdentityNotMigratedError();
       }
-      console.log("lookupResult", lookupResult);
       identityNumber = lookupResult.anchor_number;
       return CosePublicKey.fromDer(new Uint8Array(lookupResult.pubkey));
     },

src/frontend/src/lib/utils/discoverablePasskeyIdentity.ts

@@ -73,13 +73,9 @@ export class CosePublicKey implements PublicKey {
  * @param credential The credential created previously
  */
 function parseCredential(
-  credential: Credential | null,
-): PublicKeyCredentialWithAttachment | null {
-  const creds = credential as PublicKeyCredentialWithAttachment | null;
-
-  if (creds === null) {
-    return null;
-  }
+  credential: Credential,
+): PublicKeyCredentialWithAttachment {
+  const creds = credential as PublicKeyCredentialWithAttachment;
 
   // eslint-disable-next-line @typescript-eslint/ban-ts-comment
   // @ts-ignore This type error is probably also in agent-js
@@ -229,24 +225,26 @@ export class DiscoverablePasskeyIdentity extends SignIdentity {
       ? navigator.credentials.create({
           ...this.#credentialCreationOptions,
           publicKey: {
-            ...this.#credentialCreationOptions!.publicKey,
+            ...this.#credentialCreationOptions.publicKey,
             challenge: blob,
           },
         })
-      : navigator.credentials.get({
-          ...this.#credentialRequestOptions,
-          publicKey: {
-            ...this.#credentialRequestOptions!.publicKey,
-            challenge: blob,
-          },
-        }));
+      : nonNullish(this.#credentialRequestOptions)
+        ? navigator.credentials.get({
+            ...this.#credentialRequestOptions,
+            publicKey: {
+              ...this.#credentialRequestOptions.publicKey,
+              challenge: blob,
+            },
+          })
+        : Promise.reject(new Error("Missing credential options")));
+
+    if (credential === null) {
+      throw Error("WebAuthn credential is missing");
+    }
 
     const result = parseCredential(credential);
 
-    if (result === null) {
-      throw Error("WebAuthn result is missing");
-    }
-
     if (result.authenticatorAttachment !== null) {
       this.#authenticatorAttachment = result.authenticatorAttachment;
     }