Move doc and folder to the other dataroom

components/datarooms/dataroom-document-card.tsx

@@ -10,6 +10,7 @@ import {
   BetweenHorizontalStartIcon,
   FolderInputIcon,
   MoreVertical,
+  Move,
 } from "lucide-react";
 import { useTheme } from "next-themes";
 import { toast } from "sonner";
@@ -60,6 +61,7 @@ export default function DataroomDocumentCard({
   const [moveFolderOpen, setMoveFolderOpen] = useState<boolean>(false);
   const dropdownRef = useRef<HTMLDivElement | null>(null);
   const [addDataRoomOpen, setAddDataRoomOpen] = useState<boolean>(false);
+  const [isMoving, setIsMoving] = useState<boolean>(false);
 
   /** current folder name */
   const currentFolderPath = router.query.name as string[] | undefined;
@@ -91,7 +93,6 @@ export default function DataroomDocumentCard({
     event.stopPropagation();
     event.preventDefault();
 
-    console.log("isFirstClick", isFirstClick);
     if (isFirstClick) {
       handleRemoveDocument(documentId);
       setIsFirstClick(false);
@@ -103,11 +104,19 @@ export default function DataroomDocumentCard({
 
   const handleRemoveDocument = async (documentId: string) => {
     // Prevent the first click from deleting the document
-    if (!isFirstClick) {
+    if (!isMoving && !isFirstClick) {
       setIsFirstClick(true);
       return;
     }
-
+    const toastOptions = isMoving
+      ? {
+          success: "Document moved to dataroom successfully!",
+        }
+      : {
+          loading: "Deleting document...",
+          success: "Document deleted successfully.",
+          error: "Failed to delete document. Try again.",
+        };
     const endpoint = currentFolderPath
       ? `/folders/documents/${currentFolderPath.join("/")}`
       : "/documents";
@@ -133,11 +142,7 @@ export default function DataroomDocumentCard({
           },
         );
       }),
-      {
-        loading: "Removing document...",
-        success: "Document removed successfully.",
-        error: "Failed to remove document. Try again.",
-      },
+      toastOptions,
     );
   };
 
@@ -247,11 +252,25 @@ export default function DataroomDocumentCard({
                 onClick={(e) => {
                   e.stopPropagation();
                   setAddDataRoomOpen(true);
+                  setIsMoving(false);
                 }}
               >
                 <BetweenHorizontalStartIcon className="mr-2 h-4 w-4" />
                 Copy to other dataroom
               </DropdownMenuItem>
+              {!!dataroomId && (
+                <DropdownMenuItem
+                  onClick={(e) => {
+                    e.stopPropagation();
+                    setAddDataRoomOpen(true);
+                    setIsMoving(true);
+                  }}
+                >
+                  <Move className="mr-2 h-4 w-4" />
+                  Move to other dataroom
+                </DropdownMenuItem>
+              )}
+
               <DropdownMenuSeparator />
 
               <DropdownMenuItem
@@ -276,9 +295,12 @@ export default function DataroomDocumentCard({
         <AddToDataroomModal
           open={addDataRoomOpen}
           setOpen={setAddDataRoomOpen}
+          dataroomDocumentId={dataroomDocument.id}
           documentId={dataroomDocument.document.id}
           documentName={dataroomDocument.document.name}
           dataroomId={dataroomId}
+          isMoving={isMoving}
+          handleRemoveDocument={handleRemoveDocument}
         />
       ) : null}
       {moveFolderOpen ? (

components/documents/add-document-to-dataroom-modal.tsx

@@ -33,7 +33,13 @@ export function AddToDataroomModal({
   documentId,
   documentName,
   dataroomId,
+  dataroomDocumentId,
+  isMoving,
+  handleRemoveDocument,
 }: {
+  dataroomDocumentId?: string;
+  isMoving?: boolean;
+  handleRemoveDocument?: (documentId: string) => void;
   open: boolean;
   setOpen: React.Dispatch<React.SetStateAction<boolean>>;
   documentId?: string;
@@ -75,11 +81,20 @@ export function AddToDataroomModal({
         toast.error(message);
         return;
       }
-
-      toast.success("Document added to dataroom successfully!");
+      if (isMoving && dataroomDocumentId && handleRemoveDocument) {
+        handleRemoveDocument(dataroomDocumentId);
+      }
+      if (!isMoving) {
+        toast.success(`Document added to dataroom successfully!`);
+      }
     } catch (error) {
-      console.error("Error adding document to dataroom", error);
-      toast.error("Failed to add document to dataroom. Try again.");
+      console.error(
+        `Error ${isMoving ? "moving" : "adding"} document to dataroom`,
+        error,
+      );
+      toast.error(
+        `Failed to ${isMoving ? "move" : "add"} document to dataroom. Try again.`,
+      );
     } finally {
       setLoading(false);
       setOpen(false);
@@ -94,7 +109,7 @@ export function AddToDataroomModal({
             <span className="font-bold">{documentName}</span>
           </DialogTitle>
           <DialogDescription>
-            Add your document to a dataroom.
+            {isMoving ? "Move" : "Add"} your document to a dataroom.
           </DialogDescription>
         </DialogHeader>
         <Select onValueChange={(value) => setSelectedDataroom(value)}>
@@ -128,7 +143,7 @@ export function AddToDataroomModal({
                 "Select a dataroom"
               ) : (
                 <>
-                  Add to{" "}
+                  {isMoving ? "Move" : "Add"} to{" "}
                   <span className="font-medium">
                     {
                       datarooms?.filter((d) => d.id === selectedDataroom)[0]

components/documents/add-folder-to-dataroom-modal.tsx

@@ -32,8 +32,12 @@ export function AddFolderToDataroomModal({
   folderId,
   folderName,
   dataroomId,
+  isMoving,
+  handleDeleteFolder,
 }: {
   open: boolean;
+  handleDeleteFolder?: (folderId: string) => Promise<void>;
+  isMoving?: boolean;
   setOpen: React.Dispatch<React.SetStateAction<boolean>>;
   folderId?: string;
   folderName?: string;
@@ -76,13 +80,22 @@ export function AddFolderToDataroomModal({
         toast.error(message);
         return;
       }
+      if (isMoving && folderId && handleDeleteFolder) {
+        handleDeleteFolder(folderId);
+      }
       dataroomId &&
         mutate(`/api/teams/${teamId}/datarooms/${dataroomId}/folders`);
-
-      toast.success("Folder added to dataroom successfully!");
+      if (!isMoving) {
+        toast.success(`Folder added to dataroom successfully!`);
+      }
     } catch (error) {
-      console.error("Error adding folder to dataroom", error);
-      toast.error("Failed to add folder to dataroom. Try again.");
+      console.error(
+        `Error ${isMoving ? "moving" : "adding"} folder to dataroom`,
+        error,
+      );
+      toast.error(
+        `Failed to ${isMoving ? "move" : "add"} folder to dataroom. Try again.`,
+      );
     } finally {
       setLoading(false);
       setOpen(false);
@@ -96,7 +109,9 @@ export function AddFolderToDataroomModal({
           <DialogTitle>
             <span className="font-bold">{folderName}</span>
           </DialogTitle>
-          <DialogDescription>Add your folder to a dataroom.</DialogDescription>
+          <DialogDescription>
+            {isMoving ? "Move" : "Add"} your folder to a dataroom.
+          </DialogDescription>
         </DialogHeader>
         <Select onValueChange={(value) => setSelectedDataroom(value)}>
           <SelectTrigger className="min-w-fit">
@@ -129,7 +144,7 @@ export function AddFolderToDataroomModal({
                 "Select a dataroom"
               ) : (
                 <>
-                  Add to{" "}
+                  {isMoving ? "Move" : "Add"} to{" "}
                   <span className="font-medium">
                     {
                       datarooms?.filter((d) => d.id === selectedDataroom)[0]

components/documents/folder-card.tsx

@@ -7,6 +7,7 @@ import {
   BetweenHorizontalStartIcon,
   FolderIcon,
   MoreVertical,
+  Move,
   TrashIcon,
 } from "lucide-react";
 import { toast } from "sonner";
@@ -50,6 +51,7 @@ export default function FolderCard({
   const [isFirstClick, setIsFirstClick] = useState<boolean>(false);
   const [menuOpen, setMenuOpen] = useState<boolean>(false);
   const [addDataroomOpen, setAddDataroomOpen] = useState<boolean>(false);
+  const [isMoving, setIsMoving] = useState<boolean>(false);
 
   const dropdownRef = useRef<HTMLDivElement | null>(null);
 
@@ -61,6 +63,17 @@ export default function FolderCard({
     0,
     folder.path.lastIndexOf("/"),
   );
+  const endpointTargetType =
+    isDataroom && dataroomId ? `datarooms/${dataroomId}/folders` : "folders";
+  const baseUrl = `/api/teams/${teamInfo?.currentTeam?.id}/${endpointTargetType}`;
+  const rootUrl = `${baseUrl}?root=true`;
+  const pathUrl = `${baseUrl}${parentFolderPath}`;
+
+  const commonMutateCalls = () => {
+    mutate(rootUrl);
+    mutate(baseUrl);
+    mutate(pathUrl);
+  };
 
   useEffect(() => {
     function handleClickOutside(event: { target: any }) {
@@ -100,13 +113,30 @@ export default function FolderCard({
 
   const handleDeleteFolder = async (folderId: string) => {
     // Prevent the first click from deleting the document
-    if (!isFirstClick) {
+    if (!isMoving && !isFirstClick) {
       setIsFirstClick(true);
       return;
     }
 
-    const endpointTargetType =
-      isDataroom && dataroomId ? `datarooms/${dataroomId}/folders` : "folders";
+    const toastOptions = isMoving
+      ? {
+          success: () => {
+            commonMutateCalls();
+            return "Folder Moved to dataroom successfully!";
+          },
+        }
+      : {
+          loading: isDataroom ? "Removing folder..." : "Deleting folder...",
+          success: () => {
+            commonMutateCalls();
+            return isDataroom
+              ? "Folder removed successfully."
+              : "Folder deleted successfully.";
+          },
+          error: isDataroom
+            ? "Failed to remove folder."
+            : "Failed to delete folder. Move documents first.",
+        };
 
     toast.promise(
       fetch(
@@ -115,26 +145,7 @@ export default function FolderCard({
           method: "DELETE",
         },
       ),
-      {
-        loading: isDataroom ? "Removing folder..." : "Deleting folder...",
-        success: () => {
-          mutate(
-            `/api/teams/${teamInfo?.currentTeam?.id}/${endpointTargetType}?root=true`,
-          );
-          mutate(
-            `/api/teams/${teamInfo?.currentTeam?.id}/${endpointTargetType}`,
-          );
-          mutate(
-            `/api/teams/${teamInfo?.currentTeam?.id}/${endpointTargetType}${parentFolderPath}`,
-          );
-          return isDataroom
-            ? "Folder removed successfully."
-            : "Folder deleted successfully.";
-        },
-        error: isDataroom
-          ? "Failed to remove folder."
-          : "Failed to delete folder. Move documents first.",
-      },
+      toastOptions,
     );
   };
 
@@ -272,13 +283,27 @@ export default function FolderCard({
                   e.preventDefault();
                   e.stopPropagation();
                   setAddDataroomOpen(true);
+                  setIsMoving(false);
                 }}
               >
                 <BetweenHorizontalStartIcon className="mr-2 h-4 w-4" />
                 {isDataroom
                   ? "Copy folder to other dataroom"
                   : "Add folder to dataroom"}
               </DropdownMenuItem>
+              {isDataroom ? (
+                <DropdownMenuItem
+                  onClick={(e) => {
+                    e.preventDefault();
+                    e.stopPropagation();
+                    setAddDataroomOpen(true);
+                    setIsMoving(true);
+                  }}
+                >
+                  <Move className="mr-2 h-4 w-4" />
+                  Move folder to other dataroom
+                </DropdownMenuItem>
+              ) : null}
               <DropdownMenuSeparator />
 
               <DropdownMenuItem
@@ -324,6 +349,8 @@ export default function FolderCard({
           folderId={folder.id}
           folderName={folder.name}
           dataroomId={dataroomId}
+          isMoving={isMoving}
+          handleDeleteFolder={handleDeleteFolder}
         />
       ) : null}
     </>