feat: request usee to disable 2fa before deleting account

apps/web/src/components/forms/profile.tsx

@@ -7,7 +7,6 @@ import { signOut } from 'next-auth/react';
 import { useForm } from 'react-hook-form';
 import { z } from 'zod';
 
-import { validateTwoFactorAuthentication } from '@documenso/lib/server-only/2fa/validate-2fa';
 import type { User } from '@documenso/prisma/client';
 import { TRPCClientError } from '@documenso/trpc/client';
 import { trpc } from '@documenso/trpc/react';
@@ -67,13 +66,6 @@ export const ProfileForm = ({ className, user }: ProfileFormProps) => {
     resolver: zodResolver(ZProfileFormSchema),
   });
 
-  const deleteAccountTwoFactorTokenForm = useForm<TTwoFactorAuthTokenSchema>({
-    defaultValues: {
-      token: '',
-    },
-    resolver: zodResolver(ZTwoFactorAuthTokenSchema),
-  });
-
   const isSubmitting = form.formState.isSubmitting;
   const hasTwoFactorAuthentication = user.twoFactorEnabled;
 
@@ -113,7 +105,8 @@ export const ProfileForm = ({ className, user }: ProfileFormProps) => {
     }
   };
 
-  const deleteAccoutAndSignOut = async () => {
+  const onDeleteAccount = async () => {
+    try {
       await deleteAccount();
 
       toast({
@@ -123,28 +116,6 @@ export const ProfileForm = ({ className, user }: ProfileFormProps) => {
       });
 
       return await signOut({ callbackUrl: '/' });
-  };
-
-  const onDeleteAccount = async (hasTwoFactorAuthentication: boolean) => {
-    try {
-      if (!hasTwoFactorAuthentication) {
-        return await deleteAccoutAndSignOut();
-      }
-
-      const { token } = deleteAccountTwoFactorTokenForm.getValues();
-
-      if (!token) {
-        throw new Error('Please enter your Two Factor Authentication token.');
-      }
-
-      await validateTwoFactorAuthentication({
-        totpCode: token,
-        user,
-      }).catch(() => {
-        throw new Error('We were unable to validate your Two Factor Authentication token.');
-      });
-
-      await deleteAccoutAndSignOut();
     } catch (err) {
       if (err instanceof TRPCClientError && err.data?.code === 'BAD_REQUEST') {
         toast({
@@ -225,12 +196,6 @@ export const ProfileForm = ({ className, user }: ProfileFormProps) => {
             irreversible and will cancel your subscription, so proceed with caution.
           </CardContent>
           <CardFooter className="justify-end pb-4 pr-4">
-            <Form {...deleteAccountTwoFactorTokenForm}>
-              <form
-                onSubmit={deleteAccountTwoFactorTokenForm.handleSubmit(() => {
-                  console.log('delete account');
-                })}
-              >
             <Dialog>
               <DialogTrigger asChild>
                 <Button variant="destructive">Delete Account</Button>
@@ -240,9 +205,9 @@ export const ProfileForm = ({ className, user }: ProfileFormProps) => {
                   <DialogTitle>Delete Account</DialogTitle>
                   <DialogDescription>
                     Documenso will delete{' '}
-                        <span className="font-semibold">all of your documents</span>, along with all
-                        of your completed documents, signatures, and all other resources belonging
-                        to your Account.
+                    <span className="font-semibold">all of your documents</span>, along with all of
+                    your completed documents, signatures, and all other resources belonging to your
+                    Account.
                   </DialogDescription>
                 </DialogHeader>
 
@@ -253,38 +218,25 @@ export const ProfileForm = ({ className, user }: ProfileFormProps) => {
                 </Alert>
 
                 {hasTwoFactorAuthentication && (
-                      <div className="flex flex-col gap-y-4">
-                        <FormField
-                          name="token"
-                          control={deleteAccountTwoFactorTokenForm.control}
-                          render={({ field }) => (
-                            <FormItem>
-                              <FormLabel className="text-muted-foreground">
-                                Two Factor Authentication Token
-                              </FormLabel>
-                              <FormControl>
-                                <Input {...field} value={field.value ?? ''} />
-                              </FormControl>
-                              <FormMessage />
-                            </FormItem>
-                          )}
-                        />
-                      </div>
+                  <Alert variant="destructive">
+                    <AlertDescription className="selection:bg-red-100">
+                      Disable Two Factor Authentication before deleting your account.
+                    </AlertDescription>
+                  </Alert>
                 )}
 
                 <DialogFooter>
                   <Button
-                        onClick={async () => onDeleteAccount(hasTwoFactorAuthentication)}
+                    onClick={onDeleteAccount}
                     loading={isDeletingAccount}
                     variant="destructive"
+                    disabled={hasTwoFactorAuthentication}
                   >
                     {isDeletingAccount ? 'Deleting account...' : 'Delete Account'}
                   </Button>
                 </DialogFooter>
               </DialogContent>
             </Dialog>
-              </form>
-            </Form>
           </CardFooter>
         </Card>
       </div>

packages/lib/server-only/2fa/verify-2fa-token.ts

@@ -17,7 +17,6 @@ export const verifyTwoFactorAuthenticationToken = async ({
   user,
   totpCode,
 }: VerifyTwoFactorAuthenticationTokenOptions) => {
-  // TODO: This is undefined and I can't figure out why.
   const key = DOCUMENSO_ENCRYPTION_KEY;
 
   if (!user.twoFactorSecret) {