#891 add option to select all files in workspace from repo

Author: filippomc

applications/nwb-explorer/dependencies/nwb-explorer

@@ -1 +1 @@
-Subproject commit ff44c209b71b119a1d9ede41550d555e362c76e8
+Subproject commit b0839b2e1d902a42955a32a3981823aab36017c7

applications/osb-portal/src/components/repository/RepositoryPageDetails.tsx

@@ -438,6 +438,7 @@ const RepositoryPageDetails = ({
                     >
                       <TableRow>
                         <TableCell padding="checkbox" sx={{ width: "1.8em" }}>
+                          <Tooltip title="Select all files">
                           <Checkbox
                             color="primary"
                             checked={
@@ -446,9 +447,10 @@ const RepositoryPageDetails = ({
                             }
                             onChange={(e) => onSelectAllFiles(e.target.checked)}
                             inputProps={{
-                              "aria-label": "select all desserts",
+                              "aria-label": "select all files",
                             }}
                           />
+                          </Tooltip>
                         </TableCell>
                         <TableCell component="th">
                           <Typography component="p">Name</Typography>

applications/osb-portal/src/components/repository/RepositoryResourceBrowser.tsx

@@ -36,6 +36,7 @@ import {
   bgLightestShade,
   bgInputs,
 } from "../../theme";
+import { Tooltip } from "@mui/material";
 
 const useStyles = makeStyles((theme) => ({
   textField: {
@@ -178,6 +179,22 @@ export default ({
     setChecked({});
   }, [refresh]);
 
+  const resourcesList = React.useMemo(() => currentPath
+    ?.slice(-1)[0]
+    ?.children?.filter(
+      (e) => !filter || e.resource.name.toLowerCase().includes(filter)
+    ), [currentPath, filter]);
+
+  let resourcesListObject: {
+    [id: string]: RepositoryResourceNode;
+  } = React.useMemo(() => resourcesList?.reduce(
+      (resourcesListObject, item) => {
+        resourcesListObject[item.resource.path] = item.children;
+        return resourcesListObject;
+      },
+      {}
+    ), [resourcesList]);
+
   const onCheck = (isChecked: boolean, value: RepositoryResourceNode) => {
     if (isChecked) {
       checked[value.resource.path] = value;
@@ -192,6 +209,17 @@ export default ({
     setCurrentPath([...currentPath, n]);
   };
 
+  const onSelectAllFiles = (value) => {
+    if (value) {
+      setChecked(resourcesListObject);
+      checkedChanged(resourcesList);
+    } else {
+      setChecked({});
+      checkedChanged([])
+    }
+  };
+
+
   return <>
     <Box display="flex" flex-direction="row" alignItems="center">
       {backAction && (
@@ -233,7 +261,40 @@ export default ({
     <Box mt={1} className="scrollbar">
       <TableContainer component="div">
         <Table className={classes.list} aria-label="repository resources">
+        <TableHead
+                                  sx={{
+                                    "& .MuiTableCell-root": {
+                                      padding: "8px 8px 8px 0",
+            
+                                      "& .MuiButtonBase-root": {
+                                        padding: 0,
+                                      },
+                                    },
+                                  }}
+                                >
+                                  <TableRow>
+                                    <TableCell padding="checkbox" sx={{ width: "1.8em" }}>
+                                      <Tooltip title="Select all files">
+                                      <Checkbox
+                                        color="primary"
+                                        checked={
+                                          Object.keys(checked)?.length ===
+                                          currentPath.slice(-1)[0].children?.length
+                                        }
+                                        onChange={(e) => onSelectAllFiles(e.target.checked)}
+                                        inputProps={{
+                                          "aria-label": "select all files",
+                                        }}
+                                      />
+                                      </Tooltip>
+                                    </TableCell>
+                                    <TableCell component="th">
+                                      <Typography component="p">Name</Typography>
+                                    </TableCell>
+                                  </TableRow>
+                                </TableHead>
           <TableBody>
+            
             {currentPath
               .slice(-1)[0]
               .children.filter(

applications/osb-portal/src/pages/Repositories/RepositoriesPage.tsx

@@ -137,6 +137,7 @@ export const RepositoriesPage = ({
 
   const handleSearchFilter = React.useCallback((newTextFilter: string) => {
     setSearchFilterValues({ ...searchFilterValues, text: newTextFilter });
+    setPage(1);
   }, []);
 
   const setReposValues = React.useCallback((reposDetails) => {
@@ -281,7 +282,7 @@ export const RepositoriesPage = ({
               </Grid>
             </Box>
           </Box>
-
+          {!repositories?.length && !loading && <Typography sx={{p: 3}}>No repositories found</Typography>}
           {listView === "list" ? (
             <RepositoriesTable
               handleRepositoryClick={(repository: OSBRepository) =>
@@ -330,6 +331,7 @@ export const RepositoriesPage = ({
             />
           )}
         </Box>
+        
         {repositories && totalPages > 1 && (
           <OSBPagination
             count={totalPages}

applications/osb-portal/src/pages/WorkspacesPage.tsx

@@ -91,6 +91,8 @@ export const WorkspacesPage = (props: WorkspacesPageProps) => {
       ...searchFilterValues,
       text: newTextFilter,
     });
+    setPage(1);
+
 
     debounce(() => {
       getWorkspacesList({ searchFilterValues: { ...searchFilterValues, text: newTextFilter } });