refactor(web): refactor delete account component

web/app/(app)/dashboard/(components)/delete-account-form.tsx

@@ -19,7 +19,7 @@ import {
   DialogTitle,
 } from '@/components/ui/dialog'
 
-export default function DangerZoneForm() {
+export default function DeleteAccountForm() {
   const [isDeleteDialogOpen, setIsDeleteDialogOpen] = useState(false)
   const [deleteConfirmEmail, setDeleteConfirmEmail] = useState('')
   const [deleteReason, setDeleteReason] = useState('')
@@ -39,6 +39,11 @@ export default function DangerZoneForm() {
         title: 'Please enter your correct email address',
       })
       return
+    } else if (deleteReason.length < 4) {
+      toast({
+        title: 'Please enter a reason for deletion',
+      })
+      return
     }
     requestAccountDeletion()
   }

web/app/(app)/dashboard/account/delete-account/page.tsx

@@ -1,6 +1,6 @@
 import { AlertTriangleIcon } from 'lucide-react'
 import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card'
-import DangerZoneForm from '../../(components)/danger-zone-form'
+import DeleteAccountForm from '../../(components)/delete-account-form'
 
 export default function DangerZonePage() {
   return (
@@ -25,7 +25,7 @@ export default function DangerZonePage() {
             </CardDescription>
           </CardHeader>
           <CardContent>
-            <DangerZoneForm />
+            <DeleteAccountForm />
           </CardContent>
         </Card>
       </div>