fix: polish

apps/web/src/app/(signing)/sign/[token]/document-auth-provider.tsx

@@ -1,6 +1,6 @@
 'use client';
 
-import { createContext, useCallback, useContext, useMemo, useState } from 'react';
+import { createContext, useContext, useEffect, useMemo, useState } from 'react';
 
 import { match } from 'ts-pattern';
 
@@ -113,15 +113,6 @@ export const DocumentAuthProvider = ({
     isError: passkeyQuery.isError,
   };
 
-  const refetchPasskeys = useCallback(async () => {
-    const { data } = await passkeyQuery.refetch();
-
-    if (!preferredPasskeyId && data && data.data.length > 0) {
-      setPreferredPasskeyId(data.data[0].id);
-    }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [preferredPasskeyId]);
-
   const [documentAuthDialogPayload, setDocumentAuthDialogPayload] =
     useState<ExecuteActionAuthProcedureOptions | null>(null);
 
@@ -168,11 +159,25 @@ export const DocumentAuthProvider = ({
     });
   };
 
+  useEffect(() => {
+    const { passkeys } = passkeyData;
+
+    if (!preferredPasskeyId && passkeys.length > 0) {
+      setPreferredPasskeyId(passkeys[0].id);
+    }
+
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [passkeyData.passkeys]);
+
   const isAuthRedirectRequired = Boolean(
     DOCUMENT_AUTH_TYPES[derivedRecipientActionAuth || '']?.isAuthRedirectRequired &&
       !preCalculatedActionAuthOptions,
   );
 
+  const refetchPasskeys = async () => {
+    await passkeyQuery.refetch();
+  };
+
   return (
     <DocumentAuthContext.Provider
       value={{

apps/web/src/app/(signing)/sign/[token]/sign-dialog.tsx

@@ -31,7 +31,8 @@ export const SignDialog = ({
   onSignatureComplete,
   role,
 }: SignDialogProps) => {
-  const { executeActionAuthProcedure, isAuthRedirectRequired } = useRequiredDocumentAuthContext();
+  const { executeActionAuthProcedure, isAuthRedirectRequired, isCurrentlyAuthenticating } =
+    useRequiredDocumentAuthContext();
 
   const [showDialog, setShowDialog] = useState(false);
   const truncatedTitle = truncateTitle(document.title);
@@ -103,7 +104,7 @@ export const SignDialog = ({
               type="button"
               className="flex-1"
               disabled={!isComplete}
-              loading={isSubmitting}
+              loading={isSubmitting || isCurrentlyAuthenticating}
               onClick={onSignatureComplete}
             >
               {role === RecipientRole.VIEWER && 'Mark as Viewed'}