refactor: apply PR requested changes

graasp · Jul 24, 2024 · e7fdcbe · e7fdcbe
1 parent 59ecff0
commit e7fdcbe
Show file tree

Hide file tree

Showing 9 changed files with 184 additions and 52 deletions.
diff --git a/cypress/e2e/item/copy/copy.cy.ts b/cypress/e2e/item/copy/copy.cy.ts
@@ -5,6 +5,7 @@ import {
 
 import { HOME_PATH, buildItemPath } from '../../../../src/config/paths';
 import {
+  COPY_MANY_ITEMS_BUTTON_SELECTOR,
   ITEM_MENU_COPY_BUTTON_CLASS,
   MY_GRAASP_ITEM_PATH,
   buildItemCard,
@@ -18,7 +19,7 @@ const copyItems = ({
   toItemPath: string;
   rootId?: string;
 }) => {
-  cy.get(`[data-testid="FilterNoneIcon"]`).click();
+  cy.get(COPY_MANY_ITEMS_BUTTON_SELECTOR).click();
   cy.handleTreeMenu(toItemPath, rootId);
 };
 

diff --git a/cypress/e2e/item/move/move.cy.ts b/cypress/e2e/item/move/move.cy.ts
@@ -6,6 +6,7 @@ import {
 import { HOME_PATH, buildItemPath } from '../../../../src/config/paths';
 import {
   ITEM_MENU_MOVE_BUTTON_CLASS,
+  MOVE_MANY_ITEMS_BUTTON_SELECTOR,
   MY_GRAASP_ITEM_PATH,
   buildItemsGridMoreButtonSelector,
   buildNavigationModalItemId,
@@ -31,7 +32,7 @@ const moveItems = ({
   toItemPath: string;
   rootId?: string;
 }) => {
-  cy.get(`[data-testid="OpenWithIcon"]`).click();
+  cy.get(MOVE_MANY_ITEMS_BUTTON_SELECTOR).click();
   cy.handleTreeMenu(toItemPath, rootId);
 };
 

diff --git a/package.json b/package.json
@@ -25,7 +25,7 @@
     "@graasp/query-client": "3.16.0",
     "@graasp/sdk": "4.20.0",
     "@graasp/translations": "1.32.0",
-    "@graasp/ui": "github:graasp/graasp-ui#card-selection",
+    "@graasp/ui": "4.22.0",
     "@mui/icons-material": "5.16.4",
     "@mui/lab": "5.0.0-alpha.172",
     "@mui/material": "5.16.4",

diff --git a/src/components/item/FolderContent.tsx b/src/components/item/FolderContent.tsx
@@ -144,6 +144,10 @@ const FolderContent = ({ item }: { item: PackedItem }): JSX.Element => {
     )
     .sort(sortFn);
 
+  const sortingOptions = Object.values(SortingOptionsForFolder).sort((t1, t2) =>
+    translateEnums(t1).localeCompare(translateEnums(t2)),
+  );
+
   if (children) {
     return (
       <>
@@ -195,10 +199,7 @@ const FolderContent = ({ item }: { item: PackedItem }): JSX.Element => {
                     ordering={ordering}
                     sortBy={sortBy}
                     setSortBy={setSortBy}
-                    options={Object.values(SortingOptionsForFolder).sort(
-                      (t1, t2) =>
-                        translateEnums(t1).localeCompare(translateEnums(t2)),
-                    )}
+                    options={sortingOptions}
                     setOrdering={setOrdering}
                   />
                 )}

diff --git a/src/components/main/DeleteItemDialog.tsx b/src/components/main/DeleteItemDialog.tsx
@@ -43,6 +43,10 @@ const DeleteItemDialog = ({
     handleClose();
   };
 
+  const names = items
+    .sort((a, b) => (a.name.toLowerCase() > b.name.toLowerCase() ? 1 : -1))
+    .map(({ name }) => <li>{name}</li>);
+
   return (
     <Dialog
       open={open}
@@ -58,15 +62,7 @@ const DeleteItemDialog = ({
           {translateBuilder(BUILDER.DELETE_ITEM_MODAL_CONTENT, {
             count: itemIds.length,
           })}
-          <ul>
-            {items
-              .sort((a, b) =>
-                a.name.toLowerCase() > b.name.toLowerCase() ? 1 : -1,
-              )
-              .map(({ name }) => (
-                <li>{name}</li>
-              ))}
-          </ul>
+          <ul>{names}</ul>
         </DialogContentText>
       </DialogContent>
       <DialogActions>

diff --git a/src/components/main/list/ItemsTable.tsx b/src/components/main/list/ItemsTable.tsx
@@ -43,7 +43,7 @@ const ItemsTable = ({
   showThumbnails = true,
   canMove = true,
   enableMoveInBetween = true,
-  selectedIds,
+  selectedIds = [],
   onCardClick,
   onMove,
 }: ItemsTableProps): JSX.Element => {
@@ -108,16 +108,16 @@ const ItemsTable = ({
     // cannot move item into itself, or target cannot be part of selection if moving selection
     if (
       movedItem.id === targetItem.id ||
-      (selectedIds?.includes(movedItem?.id) &&
-        selectedIds?.includes(targetItem.id))
+      (selectedIds.includes(movedItem?.id) &&
+        selectedIds.includes(targetItem.id))
     ) {
       toast.error(translateMessage(FAILURE_MESSAGES.INVALID_MOVE_TARGET));
       return;
     }
 
     let movedItems: PackedItem[] = [];
     // use selected ids on drag move if moved item is part of selected ids
-    if (selectedIds?.includes(movedItem?.id)) {
+    if (selectedIds.includes(movedItem?.id)) {
       movedItems = rows.filter(({ id }) => selectedIds.includes(id));
     } else if (movedItem) {
       movedItems = [movedItem];
@@ -170,6 +170,9 @@ const ItemsTable = ({
     }
   };
 
+  const isSelected = (droppedEl: PackedItem | { files: File[] }): boolean =>
+    'id' in droppedEl ? selectedIds.includes(droppedEl.id) : false;
+
   return (
     <>
       <DraggingWrapper
@@ -185,9 +188,7 @@ const ItemsTable = ({
             enableMoveInBetween={enableMoveInBetween}
             itemsStatuses={itemsStatuses}
             showThumbnails={showThumbnails}
-            isSelected={
-              'id' in droppedEl ? selectedIds?.includes(droppedEl.id) : false
-            }
+            isSelected={isSelected(droppedEl)}
             onThumbnailClick={() => {
               if ('id' in droppedEl) {
                 onCardClick?.(droppedEl.id);

diff --git a/src/components/pages/home/HomeScreen.tsx b/src/components/pages/home/HomeScreen.tsx
@@ -88,6 +88,7 @@ const HomeScreenContent = ({ searchText }: { searchText: string }) => {
         <FileUploader buttons={<NewItemButton />} />
       </Box>
     );
+
     if (data.pages[0].data.length) {
       const totalFetchedItems = data
         ? data.pages.map(({ data: d }) => d.length).reduce((a, b) => a + b, 0)
@@ -122,6 +123,10 @@ const HomeScreenContent = ({ searchText }: { searchText: string }) => {
       content = <NoItemFilters searchText={searchText} />;
     }
 
+    const sortingOptions = Object.values(SortingOptions).sort((t1, t2) =>
+      translateEnums(t1).localeCompare(translateEnums(t2)),
+    );
+
     return (
       <>
         <Stack
@@ -157,9 +162,7 @@ const HomeScreenContent = ({ searchText }: { searchText: string }) => {
                     setSortBy={setSortBy}
                     ordering={ordering}
                     setOrdering={setOrdering}
-                    options={Object.values(SortingOptions).sort((t1, t2) =>
-                      translateEnums(t1).localeCompare(translateEnums(t2)),
-                    )}
+                    options={sortingOptions}
                   />
                 )}
                 <ModeButton />

diff --git a/src/config/selectors.ts b/src/config/selectors.ts
@@ -432,3 +432,5 @@ export const RECYCLE_BIN_DELETE_MANY_ITEMS_BUTTON_ID =
 
 export const RECYCLE_BIN_RESTORE_MANY_ITEMS_BUTTON_ID =
   'recycleBinRestoreManyButton';
+export const COPY_MANY_ITEMS_BUTTON_SELECTOR = `[data-testid="FilterNoneIcon"]`;
+export const MOVE_MANY_ITEMS_BUTTON_SELECTOR = `[data-testid="OpenWithIcon"]`;