Ryan/documenso
1
0
Fork 1
mirror of https://github.com/documenso/documenso.git synced 2025-11-14 08:42:12 +10:00
Code Issues Packages Projects Releases Wiki Activity

feat: add loading to button

Browse Source
This commit is contained in:
Ephraim Atta-Duncan
2024-01-21 09:47:50 +00:00
parent a3e560899a
commit 7762b1db65
1 changed files with 29 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files

63
apps/web/src/components/forms/profile.tsx
View File

@ -12,19 +12,17 @@ import { TRPCClientError } from '@documenso/trpc/client';
import { trpc } from '@documenso/trpc/react'; import { trpc } from '@documenso/trpc/react';
import { cn } from '@documenso/ui/lib/utils'; import { cn } from '@documenso/ui/lib/utils';
import { Alert, AlertDescription } from '@documenso/ui/primitives/alert'; import { Alert, AlertDescription } from '@documenso/ui/primitives/alert';
import {
AlertDialog,
AlertDialogAction,
AlertDialogCancel,
AlertDialogContent,
AlertDialogDescription,
AlertDialogFooter,
AlertDialogHeader,
AlertDialogTitle,
AlertDialogTrigger,
} from '@documenso/ui/primitives/alert-dialog';
import { Button } from '@documenso/ui/primitives/button'; import { Button } from '@documenso/ui/primitives/button';
import { Card, CardContent, CardFooter } from '@documenso/ui/primitives/card'; import { Card, CardContent, CardFooter } from '@documenso/ui/primitives/card';
import {
Dialog,
DialogContent,
DialogDescription,
DialogFooter,
DialogHeader,
DialogTitle,
DialogTrigger,
} from '@documenso/ui/primitives/dialog';
import { import {
Form, Form,
FormControl, FormControl,
@ -66,7 +64,8 @@ export const ProfileForm = ({ className, user }: ProfileFormProps) => {
const isSubmitting = form.formState.isSubmitting; const isSubmitting = form.formState.isSubmitting;
const { mutateAsync: updateProfile } = trpc.profile.updateProfile.useMutation(); const { mutateAsync: updateProfile } = trpc.profile.updateProfile.useMutation();
const { mutateAsync: deleteAccount } = trpc.profile.deleteAccount.useMutation(); const { mutateAsync: deleteAccount, isLoading: isDeletingAccount } =
trpc.profile.deleteAccount.useMutation();
const onFormSubmit = async ({ name, signature }: TProfileFormSchema) => { const onFormSubmit = async ({ name, signature }: TProfileFormSchema) => {
try { try {
@ -194,14 +193,14 @@ export const ProfileForm = ({ className, user }: ProfileFormProps) => {
irreversible and will cancel your subscription, so proceed with caution. irreversible and will cancel your subscription, so proceed with caution.
</CardContent> </CardContent>
<CardFooter className="justify-end pb-4 pr-4"> <CardFooter className="justify-end pb-4 pr-4">
<AlertDialog> <Dialog>
<AlertDialogTrigger asChild> <DialogTrigger asChild>
<Button variant="destructive">Delete Account</Button> <Button variant="destructive">Delete Account</Button>
</AlertDialogTrigger> </DialogTrigger>
<AlertDialogContent> <DialogContent>
<AlertDialogHeader> <DialogHeader>
<AlertDialogTitle>Delete Account</AlertDialogTitle> <DialogTitle>Delete Account</DialogTitle>
<AlertDialogDescription> <DialogDescription>
Documenso will delete{' '} Documenso will delete{' '}
<span className="font-semibold">all of your documents</span>, along with all of <span className="font-semibold">all of your documents</span>, along with all of
your completed documents, signatures, and all other resources belonging to your your completed documents, signatures, and all other resources belonging to your
@ -211,26 +210,22 @@ export const ProfileForm = ({ className, user }: ProfileFormProps) => {
This action is not reversible. Please be certain. This action is not reversible. Please be certain.
</AlertDescription> </AlertDescription>
</Alert> </Alert>
</AlertDialogDescription> </DialogDescription>
</AlertDialogHeader> </DialogHeader>
<AlertDialogFooter> <DialogFooter>
<AlertDialogCancel>Cancel</AlertDialogCancel> <Button
<AlertDialogAction
onClick={onDeleteAccount} onClick={onDeleteAccount}
className="bg-destructive text-destructive-foreground hover:bg-destructive/90" loading={isDeletingAccount}
variant="destructive"
> >
Delete Account {isDeletingAccount ? 'Deleting account...' : 'Delete Account'}
</AlertDialogAction> </Button>
</AlertDialogFooter> </DialogFooter>
</AlertDialogContent> </DialogContent>
</AlertDialog> </Dialog>
</CardFooter> </CardFooter>
</Card> </Card>
</div> </div>
</Form> </Form>
); );
}; };
// Cal.com Delete User TRPC = https://github.com/calcom/cal.com/blob/main/packages/trpc/server/routers/loggedInViewer/deleteMe.handler.ts#L11
// https://github.com/calcom/cal.com/blob/main/packages/features/users/lib/userDeletionService.ts#L7
// delete stripe: https://github.com/calcom/cal.com/blob/main/packages/app-store/stripepayment/lib/customer.ts#L72