Mintplex-Labs · timothycarambat · Mar 20, 2024 · Mar 12, 2024 · Mar 12, 2024 · Mar 12, 2024
diff --git a/frontend/src/components/Modals/MangeWorkspace/Documents/Directory/FileRow/index.jsx b/frontend/src/components/Modals/MangeWorkspace/Documents/Directory/FileRow/index.jsx
@@ -4,44 +4,12 @@ import {
   getFileExtension,
   middleTruncate,
 } from "@/utils/directories";
-import { File, Trash } from "@phosphor-icons/react";
-import System from "@/models/system";
+import { File } from "@phosphor-icons/react";
 import debounce from "lodash.debounce";
 
-export default function FileRow({
-  item,
-  folderName,
-  selected,
-  toggleSelection,
-  fetchKeys,
-  setLoading,
-  setLoadingMessage,
-}) {
+export default function FileRow({ item, selected, toggleSelection }) {
   const [showTooltip, setShowTooltip] = useState(false);
 
-  const onTrashClick = async (event) => {
-    event.stopPropagation();
-    if (
-      !window.confirm(
-        "Are you sure you want to delete this document?\nThis will require you to re-upload and re-embed it.\nThis document will be removed from any workspace that is currently referencing it.\nThis action is not reversible."
-      )
-    ) {
-      return false;
-    }
-
-    try {
-      setLoading(true);
-      setLoadingMessage("This may take a while for large documents");
-      await System.deleteDocument(`${folderName}/${item.name}`);
-      await fetchKeys(true);
-    } catch (error) {
-      console.error("Failed to delete the document:", error);
-    }
-
-    if (selected) toggleSelection(item);
-    setLoading(false);
-  };
-
   const handleShowTooltip = () => {
     setShowTooltip(true);
   };
@@ -60,7 +28,7 @@ export default function FileRow({
         selected ? "selected" : ""
       }`}
     >
-      <div className="pl-2 col-span-5 flex gap-x-[4px] items-center">
+      <div className="pl-2 col-span-6 flex gap-x-[4px] items-center">
         <div
           className="shrink-0 w-3 h-3 rounded border-[1px] border-white flex justify-center items-center cursor-pointer"
           role="checkbox"
@@ -94,16 +62,12 @@ export default function FileRow({
       <p className="col-span-2 pl-2 uppercase overflow-x-hidden">
         {getFileExtension(item.url)}
       </p>
-      <div className="col-span-2 flex justify-end items-center">
+      <div className="-col-span-2 flex justify-end items-center">
         {item?.cached && (
           <div className="bg-white/10 rounded-3xl">
             <p className="text-xs px-2 py-0.5">Cached</p>
           </div>
         )}
-        <Trash
-          onClick={onTrashClick}
-          className="text-base font-bold w-4 h-4 ml-2 flex-shrink-0 cursor-pointer"
-        />
       </div>
     </tr>
   );

diff --git a/frontend/src/components/Modals/MangeWorkspace/Documents/Directory/FolderRow/index.jsx b/frontend/src/components/Modals/MangeWorkspace/Documents/Directory/FolderRow/index.jsx
@@ -1,45 +1,18 @@
 import { useState } from "react";
 import FileRow from "../FileRow";
-import { CaretDown, FolderNotch, Trash } from "@phosphor-icons/react";
+import { CaretDown, FolderNotch } from "@phosphor-icons/react";
 import { middleTruncate } from "@/utils/directories";
-import System from "@/models/system";
 
 export default function FolderRow({
   item,
   selected,
   onRowClick,
   toggleSelection,
   isSelected,
-  fetchKeys,
-  setLoading,
-  setLoadingMessage,
   autoExpanded = false,
 }) {
   const [expanded, setExpanded] = useState(autoExpanded);
 
-  const onTrashClick = async (event) => {
-    event.stopPropagation();
-    if (
-      !window.confirm(
-        "Are you sure you want to delete this folder?\nThis will require you to re-upload and re-embed it.\nAny documents in this folder will be removed from any workspace that is currently referencing it.\nThis action is not reversible."
-      )
-    ) {
-      return false;
-    }
-
-    try {
-      setLoading(true);
-      setLoadingMessage("This may take a while for large folders");
-      await System.deleteFolder(item.name);
-      await fetchKeys(true);
-    } catch (error) {
-      console.error("Failed to delete the document:", error);
-    }
-
-    if (selected) toggleSelection(item);
-    setLoading(false);
-  };
-
   const handleExpandClick = (event) => {
     event.stopPropagation();
     setExpanded(!expanded);
@@ -49,7 +22,7 @@ export default function FolderRow({
     <>
       <tr
         onClick={onRowClick}
-        className={`transition-all duration-200 text-white/80 text-xs grid grid-cols-12 py-2 pl-3.5 pr-8 bg-[#2C2C2C] hover:bg-sky-500/20 cursor-pointer w-full file-row:0 ${
+        className={`transition-all duration-200 text-white/80 text-xs grid grid-cols-12 py-2 pl-3.5 pr-8 bg-[#1C1E21] hover:bg-sky-500/20 cursor-pointer w-full ${
           selected ? "selected" : ""
         }`}
       >
@@ -59,6 +32,10 @@ export default function FolderRow({
             role="checkbox"
             aria-checked={selected}
             tabIndex={0}
+            onClick={(event) => {
+              event.stopPropagation();
+              toggleSelection(item);
+            }}
           >
             {selected && <div className="w-2 h-2 bg-white rounded-[2px]" />}
           </div>
@@ -75,32 +52,20 @@ export default function FolderRow({
             weight="fill"
           />
           <p className="whitespace-nowrap overflow-show">
-            {middleTruncate(item.name, 40)}
+            {middleTruncate(item.name, 35)}
           </p>
         </div>
         <p className="col-span-2 pl-3.5" />
         <p className="col-span-2 pl-2" />
-        <div className="col-span-2 flex justify-end items-center">
-          {item.name !== "custom-documents" && (
-            <Trash
-              onClick={onTrashClick}
-              className="text-base font-bold w-4 h-4 ml-2 flex-shrink-0 cursor-pointer"
-            />
-          )}
-        </div>
       </tr>
       {expanded && (
         <div className="col-span-full">
           {item.items.map((fileItem) => (
             <FileRow
               key={fileItem.id}
               item={fileItem}
-              folderName={item.name}
               selected={isSelected(fileItem.id)}
               toggleSelection={toggleSelection}
-              fetchKeys={fetchKeys}
-              setLoading={setLoading}
-              setLoadingMessage={setLoadingMessage}
             />
           ))}
         </div>

diff --git a/...d/src/components/Modals/MangeWorkspace/Documents/Directory/FolderSelectionPopup/index.jsx b/...d/src/components/Modals/MangeWorkspace/Documents/Directory/FolderSelectionPopup/index.jsx
@@ -0,0 +1,24 @@
+import { middleTruncate } from "@/utils/directories";
+
+export default function FolderSelectionPopup({ folders, onSelect, onClose }) {
+  const handleFolderSelect = (folder) => {
+    onSelect(folder);
+    onClose();
+  };
+
+  return (
+    <div className="absolute bottom-full left-0 mb-2 bg-white rounded-lg shadow-lg">
+      <ul>
+        {folders.map((folder) => (
+          <li
+            key={folder.name}
+            onClick={() => handleFolderSelect(folder)}
+            className="px-4 py-2 text-xs text-gray-700 hover:bg-gray-200 rounded-lg cursor-pointer whitespace-nowrap"
+          >
+            {middleTruncate(folder.name, 25)}
+          </li>
+        ))}
+      </ul>
+    </div>
+  );
+}
diff --git a/frontend/src/components/Modals/MangeWorkspace/Documents/Directory/MoveToFolderIcon.jsx b/frontend/src/components/Modals/MangeWorkspace/Documents/Directory/MoveToFolderIcon.jsx
@@ -0,0 +1,44 @@
+export default function MoveToFolderIcon({
+  className,
+  width = 18,
+  height = 18,
+}) {
+  return (
+    <svg
+      width={width}
+      height={height}
+      viewBox="0 0 17 19"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+    >
+      <path
+        d="M1.46092 17.9754L3.5703 12.7019C3.61238 12.5979 3.68461 12.5088 3.7777 12.4462C3.8708 12.3836 3.98051 12.3502 4.09272 12.3504H7.47897C7.59001 12.3502 7.69855 12.3174 7.79116 12.2562L9.19741 11.3196C9.29001 11.2583 9.39855 11.2256 9.50959 11.2254H15.5234C15.6126 11.2254 15.7004 11.2465 15.7798 11.2872C15.8591 11.3278 15.9277 11.3867 15.9798 11.459C16.0319 11.5313 16.0661 11.6149 16.0795 11.703C16.093 11.7912 16.0853 11.8812 16.0571 11.9658L14.0532 17.9754H1.46092Z"
+        stroke="currentColor"
+        strokeWidth="1.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M2.25331 6.53891H2.02342C1.67533 6.53891 1.34149 6.67719 1.09534 6.92333C0.849204 7.16947 0.710922 7.50331 0.710922 7.85141V17.9764C0.710922 18.3906 1.04671 18.7264 1.46092 18.7264C1.87514 18.7264 2.21092 18.3906 2.21092 17.9764V8.03891H2.25331V6.53891ZM13.0859 9.98714V11.2264C13.0859 11.6406 13.4217 11.9764 13.8359 11.9764C14.2501 11.9764 14.5859 11.6406 14.5859 11.2264V9.53891C14.5859 9.19081 14.4476 8.85698 14.2015 8.61083C13.9554 8.36469 13.6215 8.22641 13.2734 8.22641H13.0863V9.98714H13.0859Z"
+        fill="currentColor"
+      />
+      <path
+        d="M7.53416 1.62906L7.53416 7.70406"
+        stroke="currentColor"
+        strokeWidth="1.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+      <path
+        d="M10.6411 5.21854L7.53456 7.70376L4.42803 5.21854"
+        stroke="currentColor"
+        strokeWidth="1.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+      />
+    </svg>
+  );
+}