Better handling of document versions

Signed-off-by: Sacha Al Himdani <sacha@getprobo.com>

apps/console/src/pages/organizations/documents/DocumentDetailPage.tsx

@@ -1,6 +1,5 @@
 import type { PreloadedQuery } from "react-relay";
 import {
-  ConnectionHandler,
   graphql,
   loadQuery,
   useFragment,
@@ -9,8 +8,8 @@ import {
 import type { DocumentGraphNodeQuery } from "/hooks/graph/__generated__/DocumentGraphNodeQuery.graphql";
 import {
   documentNodeQuery,
-  DocumentsConnectionKey,
   useDeleteDocumentMutation,
+  useDeleteDraftDocumentVersionMutation,
 } from "/hooks/graph/DocumentGraph";
 import { usePageTitle } from "@probo/hooks";
 import type {
@@ -187,6 +186,7 @@ export default function DocumentDetailPage(props: Props) {
     }
   );
   const [deleteDocument, isDeleting] = useDeleteDocumentMutation();
+  const [deleteDraftDocumentVersion, isDeletingDraft] = useDeleteDraftDocumentVersionMutation();
   const [exportDocumentVersionPDF, isExporting] =
     useMutationWithToasts<DocumentDetailPageExportPDFMutation>(
       exportDocumentVersionPDFMutation,
@@ -285,17 +285,13 @@ export default function DocumentDetailPage(props: Props) {
     confirm(
       () =>
         new Promise<void>((resolve) => {
-          const connectionId = ConnectionHandler.getConnectionID(
-            organizationId,
-            DocumentsConnectionKey
-          );
           deleteDocument({
             variables: {
               input: { documentId: document.id },
-              connections: [connectionId],
             },
             onSuccess() {
               navigate(`/organizations/${organizationId}/documents`);
+              resolve();
             },
             onError: () => resolve(),
           });
@@ -311,6 +307,40 @@ export default function DocumentDetailPage(props: Props) {
     );
   };
 
+  const handleDeleteDraft = () => {
+    confirm(
+      () =>
+        new Promise<void>((resolve) => {
+          deleteDraftDocumentVersion({
+            variables: {
+              input: { documentVersionId: currentVersion.id },
+              connections: [versionConnectionId],
+            },
+            onSuccess() {
+              loadQuery(
+                props.queryRef.environment,
+                documentNodeQuery,
+                props.queryRef.variables,
+                { fetchPolicy: "network-only" }
+              );
+
+              resolve();
+            },
+            onError: () => resolve(),
+          });
+        }),
+      {
+        message: sprintf(
+          __(
+            'This will permanently delete the draft version %s of "%s". This action cannot be undone.'
+          ),
+          currentVersion.version,
+          document.title
+        ),
+      }
+    );
+  };
+
   const handleDownloadPdf = () => {
     exportDocumentVersionPDF({
       variables: {
@@ -392,6 +422,15 @@ export default function DocumentDetailPage(props: Props) {
               >
                 {isDraft ? __("Edit draft document") : __("Create new draft")}
               </DropdownItem>
+              {isDraft && versions.length > 1 && (
+                <DropdownItem
+                  onClick={handleDeleteDraft}
+                  icon={IconTrashCan}
+                  disabled={isDeletingDraft}
+                >
+                  {__("Delete draft document")}
+                </DropdownItem>
+              )}
               <DropdownItem
                 onClick={handleDownloadPdf}
                 icon={IconArrowDown}
@@ -405,7 +444,7 @@ export default function DocumentDetailPage(props: Props) {
                 disabled={isDeleting}
                 onClick={handleDelete}
               >
-                {__("Delete")}
+                {__("Delete document")}
               </DropdownItem>
             </ActionDropdown>
           </div>

apps/console/src/pages/organizations/documents/DocumentsPage.tsx

@@ -227,7 +227,6 @@ const rowFragment = graphql`
 function DocumentRow({
   document: documentKey,
   organizationId,
-  connectionId,
   checked,
   onCheck,
 }: {
@@ -257,7 +256,6 @@ function DocumentRow({
         deleteDocument({
           variables: {
             input: { documentId: document.id },
-            connections: [connectionId],
           },
         }),
       {

apps/console/src/pages/organizations/documents/dialogs/UpdateVersionDialog.tsx

@@ -101,28 +101,6 @@ export default function UpdateVersionDialog({
   ref.current = {
     open: () => {
       dialogRef.current?.open();
-      if (!isDraft) {
-        createDraftDocumentVersion({
-          variables: {
-            input: {
-              documentID: document.id,
-            },
-            connections: [connectionId],
-          },
-          onCompleted: (_, errors) => {
-            if (errors) {
-              toast({
-                variant: "error",
-                title: __("Error creating draft"),
-                description:
-                  errors[0]?.message || __("An unknown error occurred"),
-              });
-              dialogRef.current?.close();
-              return;
-            }
-          },
-        });
-      }
     },
   };
 
@@ -131,25 +109,65 @@ export default function UpdateVersionDialog({
   }
 
   const onSubmit = handleSubmit((data) => {
-    updateDocumentVersion({
-      variables: {
-        input: {
-          documentVersionId: version.id,
-          content: data.content,
+    if (isDraft) {
+      updateDocumentVersion({
+        variables: {
+          input: {
+            documentVersionId: version.id,
+            content: data.content,
+          },
         },
-      },
-      onSuccess: () => {
-        dialogRef.current?.close();
-      },
-    });
+        onSuccess: () => {
+          dialogRef.current?.close();
+        },
+      });
+    } else {
+      createDraftDocumentVersion({
+        variables: {
+          input: {
+            documentID: document.id,
+          },
+          connections: [connectionId],
+        },
+        onCompleted: (createResponse, errors) => {
+          if (errors) {
+            toast({
+              variant: "error",
+              title: __("Error creating draft"),
+              description:
+                errors[0]?.message || __("An unknown error occurred"),
+            });
+            return;
+          }
+
+          const newVersionId = createResponse?.createDraftDocumentVersion?.documentVersionEdge?.node?.id;
+          if (newVersionId && data.content !== version.content) {
+            updateDocumentVersion({
+              variables: {
+                input: {
+                  documentVersionId: newVersionId,
+                  content: data.content,
+                },
+              },
+              onSuccess: () => {
+                dialogRef.current?.close();
+              },
+            });
+          } else {
+            dialogRef.current?.close();
+          }
+        },
+      });
+    }
   });
 
+  const isLoading = isCreatingDraft || isUpdating;
+
   return (
     <Dialog
       ref={dialogRef}
       title={<Breadcrumb items={[__("Documents"), __("Edit document")]} />}
     >
-      {isCreatingDraft && <Spinner centered />}
       <form onSubmit={onSubmit}>
         <DialogContent>
           <Textarea
@@ -164,7 +182,8 @@ export default function UpdateVersionDialog({
           />
         </DialogContent>
         <DialogFooter>
-          <Button disabled={isUpdating} type="submit">
+          <Button disabled={isLoading} type="submit">
+            {isLoading && <Spinner />}
             {__("Update document")}
           </Button>
         </DialogFooter>