feat: add restore deleted document dialog

apps/remix/app/components/dialogs/document-restore-dialog.tsx

@@ -0,0 +1,119 @@
+import { msg } from '@lingui/core/macro';
+import { useLingui } from '@lingui/react';
+import { Trans } from '@lingui/react/macro';
+
+import { useLimits } from '@documenso/ee/server-only/limits/provider/client';
+import { trpc as trpcReact } from '@documenso/trpc/react';
+import { Alert, AlertDescription } from '@documenso/ui/primitives/alert';
+import { Button } from '@documenso/ui/primitives/button';
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+} from '@documenso/ui/primitives/dialog';
+import { useToast } from '@documenso/ui/primitives/use-toast';
+
+type DocumentRestoreDialogProps = {
+  id: number;
+  open: boolean;
+  onOpenChange: (_open: boolean) => void;
+  onRestore?: () => Promise<void> | void;
+  documentTitle: string;
+  teamId?: number;
+  canManageDocument: boolean;
+};
+
+export const DocumentRestoreDialog = ({
+  id,
+  open,
+  onOpenChange,
+  onRestore,
+  documentTitle,
+  canManageDocument,
+}: DocumentRestoreDialogProps) => {
+  const { toast } = useToast();
+  const { refreshLimits } = useLimits();
+  const { _ } = useLingui();
+
+  const { mutateAsync: restoreDocument, isPending } =
+    trpcReact.document.restoreDocument.useMutation({
+      onSuccess: async () => {
+        void refreshLimits();
+
+        toast({
+          title: _(msg`Document restored`),
+          description: _(msg`"${documentTitle}" has been successfully restored`),
+          duration: 5000,
+        });
+
+        await onRestore?.();
+
+        onOpenChange(false);
+      },
+      onError: () => {
+        toast({
+          title: _(msg`Something went wrong`),
+          description: _(msg`This document could not be restored at this time. Please try again.`),
+          variant: 'destructive',
+          duration: 7500,
+        });
+      },
+    });
+
+  return (
+    <Dialog open={open} onOpenChange={(value) => !isPending && onOpenChange(value)}>
+      <DialogContent>
+        <DialogHeader>
+          <DialogTitle>
+            <Trans>Restore Document</Trans>
+          </DialogTitle>
+
+          <DialogDescription>
+            {canManageDocument ? (
+              <Trans>
+                You are about to restore <strong>"{documentTitle}"</strong>
+              </Trans>
+            ) : (
+              <Trans>
+                You are about to unhide <strong>"{documentTitle}"</strong>
+              </Trans>
+            )}
+          </DialogDescription>
+        </DialogHeader>
+
+        <Alert variant="neutral" className="-mt-1">
+          <AlertDescription>
+            {canManageDocument ? (
+              <Trans>
+                The document will be restored to your account and will be available in your
+                documents list.
+              </Trans>
+            ) : (
+              <Trans>
+                The document will be unhidden from your account and will be available in your
+                documents list.
+              </Trans>
+            )}
+          </AlertDescription>
+        </Alert>
+
+        <DialogFooter>
+          <Button type="button" variant="secondary" onClick={() => onOpenChange(false)}>
+            <Trans>Cancel</Trans>
+          </Button>
+
+          <Button
+            type="button"
+            loading={isPending}
+            onClick={() => void restoreDocument({ documentId: id })}
+          >
+            <Trans>Restore</Trans>
+          </Button>
+        </DialogFooter>
+      </DialogContent>
+    </Dialog>
+  );
+};