Bulk operations for Bin

packages/files-ui/src/Components/Modules/FileBrowsers/BinFileBrowser.tsx

@@ -1,6 +1,6 @@
 import React, { useCallback, useEffect, useMemo, useState } from "react"
 import { BucketType, FileSystemItem, useDrive } from "../../../Contexts/DriveContext"
-import { IFilesBrowserModuleProps } from "./types"
+import { IBulkOperations, IFilesBrowserModuleProps } from "./types"
 import FilesTableView from "./views/FilesTable.view"
 import DragAndDrop from "../../../Contexts/DnDContext"
 import { t } from "@lingui/macro"
@@ -118,7 +118,7 @@ const BinFileBrowser: React.FC<IFilesBrowserModuleProps> = ({ controls = false }
   }, [deleteFile, refreshContents])
 
 
-  const recoverFile = async (cid: string) => {
+  const recoverFile = useCallback(async (cid: string) => {
     const itemToRestore = pathContents.find((i) => i.cid === cid)
     if (!itemToRestore) throw new Error("Not found")
     try {
@@ -153,7 +153,19 @@ const BinFileBrowser: React.FC<IFilesBrowserModuleProps> = ({ controls = false }
       })
       return Promise.reject()
     }
-  }
+  }, [addToastMessage, moveCSFObject, pathContents, refreshContents])
+
+  const recoverFiles = useCallback(async (cids: string[]) => {
+    return Promise.all(
+      cids.map((cid: string) =>
+        recoverFile(cid)
+      ))
+  }, [recoverFile])
+
+  const bulkOperations: IBulkOperations = useMemo(() => ({
+    [CONTENT_TYPES.Directory]: [],
+    [CONTENT_TYPES.File]: ["recover", "delete"]
+  }), [])
 
   const itemOperations: IFilesTableBrowserProps["itemOperations"] = useMemo(() => ({
     [CONTENT_TYPES.File]: ["recover", "delete"],
@@ -166,6 +178,7 @@ const BinFileBrowser: React.FC<IFilesBrowserModuleProps> = ({ controls = false }
         crumbs={undefined}
         recoverFile={recoverFile}
         deleteFiles={deleteFiles}
+        recoverFiles={recoverFiles}
         currentPath={currentPath}
         moduleRootPath={ROUTE_LINKS.Bin("/")}
         refreshContents={refreshContents}
@@ -176,6 +189,7 @@ const BinFileBrowser: React.FC<IFilesBrowserModuleProps> = ({ controls = false }
         controls={controls}
         bucketType={bucketType}
         itemOperations={itemOperations}
+        bulkOperations={bulkOperations}
       />
     </DragAndDrop>
   )

packages/files-ui/src/Components/Modules/FileBrowsers/types.ts

@@ -34,6 +34,7 @@ export interface IFilesTableBrowserProps
   downloadFile?: (cid: string) => Promise<void>
   deleteFiles?: (cid: string[]) => Promise<void>
   recoverFile?: (cid: string) => Promise<void>
+  recoverFiles?: (cid: string[]) => Promise<void[]>
   viewFolder?: (cid: string) => void
   allowDropUpload?: boolean
 

packages/files-ui/src/Components/Modules/FileBrowsers/views/FilesTable.view.tsx

@@ -286,6 +286,7 @@ const FilesTableView = ({
   downloadFile,
   deleteFiles,
   recoverFile,
+  recoverFiles,
   viewFolder,
   currentPath,
   refreshContents,
@@ -444,6 +445,7 @@ const FilesTableView = ({
   const [isMoveFileModalOpen, setIsMoveFileModalOpen] = useState(false)
   const [isDeleteModalOpen, setIsDeleteModalOpen] = useState(false)
   const [isDeletingFiles, setIsDeletingFiles] = useState(false)
+  const [isRecoveringFiles, setIsRecoveringFiles] = useState(false)
   const [fileInfoPath, setFileInfoPath] = useState<string | undefined>(
     undefined
   )
@@ -461,7 +463,8 @@ const FilesTableView = ({
         "move",
         "preview",
         "rename",
-        "share"
+        "share",
+        "recover"
       ]
       for (let i = 0; i < selectedCids.length; i++) {
         const contentType = items.find((item) => item.cid === selectedCids[i])
@@ -520,6 +523,18 @@ const FilesTableView = ({
       })
   }, [deleteFiles, selectedCids])
 
+  const handleRecoverFiles = useCallback(() => {
+    if (!recoverFiles) return
+
+    setIsRecoveringFiles(true)
+    recoverFiles(selectedCids)
+      .catch(console.error)
+      .finally(() => {
+        setIsRecoveringFiles(false)
+        setSelectedCids([])
+      })
+  }, [recoverFiles, selectedCids])
+
   const getItemOperations = useCallback(
     (contentType: string) => {
       const result = Object.keys(itemOperations).reduce(
@@ -695,6 +710,15 @@ const FilesTableView = ({
               <Trans>Move selected</Trans>
             </Button>
           )}
+          {validBulkOps.indexOf("recover") >= 0 && (
+            <Button
+              onClick={handleRecoverFiles}
+              variant="outline"
+              loading={isRecoveringFiles}
+            >
+              <Trans>Recover selected</Trans>
+            </Button>
+          )}
           {validBulkOps.indexOf("delete") >= 0 && (
             <Button
               onClick={() => {

packages/files-ui/src/locales/en/messages.po

@@ -397,6 +397,9 @@ msgstr "Profile updated"
 msgid "Recover"
 msgstr "Recover"
 
+msgid "Recover selected"
+msgstr "Recover selected"
+
 msgid "Recover with passphrase"
 msgstr "Recover with passphrase"
 

packages/files-ui/src/locales/fr/messages.po

@@ -398,6 +398,9 @@ msgstr "Profile mis à jour"
 msgid "Recover"
 msgstr "Récupérer"
 
+msgid "Recover selected"
+msgstr "Récupérer sélection"
+
 msgid "Recover with passphrase"
 msgstr "Récupérer avec un mot de passe"