refactor: remove features in recycled page

graasp · Oct 16, 2024 · 42cd116 · 42cd116
1 parent d8b0d2e
commit 42cd116
Show file tree

Hide file tree

Showing 9 changed files with 41 additions and 134 deletions.
diff --git a/cypress/e2e/item/trash/delete.cy.ts b/cypress/e2e/item/trash/delete.cy.ts
@@ -40,7 +40,6 @@ describe('Delete Items', () => {
     cy.wait('@deleteItems').then(({ request: { url } }) => {
       expect(url).to.contain(id);
     });
-    cy.wait('@getRecycledItems');
   });
 
   it('delete many items', () => {

diff --git a/cypress/e2e/item/trash/restore.cy.ts b/cypress/e2e/item/trash/restore.cy.ts
@@ -36,7 +36,6 @@ describe('Restore Items', () => {
     cy.wait('@restoreItems').then(({ request: { url } }) => {
       expect(url).to.contain(id);
     });
-    cy.wait('@getRecycledItems');
   });
 
   it('restore many items', () => {

diff --git a/cypress/e2e/item/trash/viewTrash.cy.ts b/cypress/e2e/item/trash/viewTrash.cy.ts
@@ -5,19 +5,14 @@ import {
   PackedRecycledItemDataFactory,
 } from '@graasp/sdk';
 
-import { SortingOptions } from '@/components/table/types';
 import { BUILDER } from '@/langs/constants';
 
 import i18n, { BUILDER_NAMESPACE } from '../../../../src/config/i18n';
 import { RECYCLE_BIN_PATH } from '../../../../src/config/paths';
 import {
-  ITEM_SEARCH_INPUT_ID,
   PREVENT_GUEST_MESSAGE_ID,
   RECYCLED_ITEMS_ERROR_ALERT_ID,
   RECYCLED_ITEMS_ROOT_CONTAINER,
-  SORTING_ORDERING_SELECTOR_ASC,
-  SORTING_ORDERING_SELECTOR_DESC,
-  SORTING_SELECT_SELECTOR,
   buildItemCard,
 } from '../../../../src/config/selectors';
 import { CURRENT_USER } from '../../../fixtures/members';
@@ -61,46 +56,11 @@ describe('View trash', () => {
       cy.visit(RECYCLE_BIN_PATH);
     });
 
-    it('Empty search', () => {
-      i18n.changeLanguage(CURRENT_USER.extra.lang as string);
-      const searchText = 'mysearch';
-      cy.get(`#${ITEM_SEARCH_INPUT_ID}`).type(searchText);
-      const text = i18n.t(BUILDER.ITEM_SEARCH_NOTHING_FOUND, {
-        search: searchText,
-        ns: BUILDER_NAMESPACE,
-      });
-      cy.get(`#${RECYCLED_ITEMS_ROOT_CONTAINER}`).should('contain', text);
-    });
-
     it('check recycled item layout', () => {
       for (const { item } of recycledItemData) {
         cy.get(`#${buildItemCard(item.id)}`).should('be.visible');
       }
     });
-
-    it('Sorting & Ordering', () => {
-      cy.wait('@getOwnRecycledItemData');
-
-      cy.get(`${SORTING_SELECT_SELECTOR} input`).should(
-        'have.value',
-        SortingOptions.ItemUpdatedAt,
-      );
-      cy.get(SORTING_ORDERING_SELECTOR_DESC).should('be.visible');
-
-      cy.get(SORTING_SELECT_SELECTOR).click();
-      cy.get('li[data-value="item.name"]').click();
-      cy.wait('@getOwnRecycledItemData').then(({ request: { url } }) => {
-        expect(url).to.contain('item.name');
-        expect(url).to.contain('desc');
-      });
-
-      // change ordering
-      cy.get(SORTING_ORDERING_SELECTOR_DESC).click();
-      cy.get(SORTING_ORDERING_SELECTOR_ASC).should('be.visible');
-      cy.wait('@getOwnRecycledItemData').then(({ request: { url } }) => {
-        expect(url).to.contain('asc');
-      });
-    });
   });
 
   describe('Error Handling', () => {

diff --git a/cypress/support/server.ts b/cypress/support/server.ts
@@ -69,7 +69,7 @@ const {
   buildGetItemMembershipsForItemsRoute,
   buildGetItemTagsRoute,
   buildPostItemTagRoute,
-  buildPatchMemberRoute,
+  buildPatchCurrentMemberRoute,
   buildEditItemMembershipRoute,
   buildDeleteItemMembershipRoute,
   buildPostItemFlagRoute,
@@ -207,12 +207,11 @@ export const mockGetOwnRecycledItemData = (
 
       const page = parseInt(params.get('page') ?? '1', 10);
       const pageSize = parseInt(params.get('pageSize') ?? '10', 10);
-      const rawKeywords = params.get('keywords');
-      const keywords = Array.isArray(rawKeywords) ? rawKeywords : [rawKeywords];
 
-      const result = recycledItemData
-        .filter(({ item }) => keywords.some((k) => item.name.includes(k)))
-        .slice((page - 1) * pageSize, page * pageSize);
+      const result = recycledItemData.slice(
+        (page - 1) * pageSize,
+        page * pageSize,
+      );
 
       reply({
         data: result,
@@ -757,7 +756,7 @@ export const mockEditMember = (
   cy.intercept(
     {
       method: HttpMethod.Patch,
-      url: new RegExp(`${API_HOST}/${buildPatchMemberRoute(ID_FORMAT)}`),
+      url: new RegExp(`${API_HOST}/${buildPatchCurrentMemberRoute()}`),
     },
     ({ reply }) => {
       if (shouldThrowError) {

diff --git a/src/components/pages/RecycledItemsScreen.tsx b/src/components/pages/RecycledItemsScreen.tsx
@@ -1,9 +1,8 @@
-import { Stack } from '@mui/material';
+import { Stack, Typography } from '@mui/material';
 
 import { Button } from '@graasp/ui';
 
 import { ITEM_PAGE_SIZE } from '@/config/constants';
-import { Ordering } from '@/enums';
 
 import { useBuilderTranslation } from '../../config/i18n';
 import { hooks } from '../../config/queryClient';
@@ -15,10 +14,6 @@ import { BUILDER } from '../../langs/constants';
 import DeleteButton from '../common/DeleteButton';
 import ErrorAlert from '../common/ErrorAlert';
 import RestoreButton from '../common/RestoreButton';
-import SelectTypes from '../common/SelectTypes';
-import { useFilterItemsContext } from '../context/FilterItemsContext';
-import { useItemSearch } from '../item/ItemSearch';
-import ModeButton from '../item/header/ModeButton';
 import LoadingScreen from '../layout/LoadingScreen';
 import {
   SelectionContextProvider,
@@ -29,41 +24,20 @@ import {
   useDragSelection,
 } from '../main/list/useDragSelection';
 import ItemCard from '../table/ItemCard';
-import SortingSelect from '../table/SortingSelect';
-import { SortingOptions } from '../table/types';
-import { useSorting, useTranslatedSortingOptions } from '../table/useSorting';
-import NoItemFilters from './NoItemFilters';
 import PageWrapper from './PageWrapper';
 import RecycleBinToolbar from './recycleBin/RecycleBinSelectionToolbar';
 
 const CONTAINER_ID = 'recycle-items-container';
 
-const RecycledItemsScreenContent = ({
-  searchText,
-}: {
-  searchText: string;
-}): JSX.Element => {
+const RecycledItemsScreenContent = (): JSX.Element => {
   const { t: translateBuilder } = useBuilderTranslation();
-  const { itemTypes } = useFilterItemsContext();
-  const { sortBy, setSortBy, ordering, setOrdering } =
-    useSorting<SortingOptions>({
-      sortBy: SortingOptions.ItemUpdatedAt,
-      ordering: Ordering.DESC,
-    });
 
   const { data, fetchNextPage, isLoading, isFetching } =
     hooks.useInfiniteOwnRecycledItemData(
-      {
-        sortBy,
-        ordering,
-        types: itemTypes,
-        keywords: searchText,
-      },
       // todo: adapt page size given the user window height
       { pageSize: ITEM_PAGE_SIZE },
     );
 
-  const options = useTranslatedSortingOptions();
   const { selectedIds, toggleSelection } = useSelectionContext();
 
   const DragSelection = useDragSelection({ containerId: CONTAINER_ID });
@@ -80,7 +54,7 @@ const RecycledItemsScreenContent = ({
         ? data.pages.map(({ data: d }) => d.length).reduce((a, b) => a + b, 0)
         : 0;
 
-      const hasSelection = selectedIds.length && filteredData?.length;
+      const hasSelection = Boolean(selectedIds.length && filteredData?.length);
       return (
         <>
           <Stack gap={1} height="100%">
@@ -93,26 +67,11 @@ const RecycledItemsScreenContent = ({
               {hasSelection ? (
                 <RecycleBinToolbar items={filteredData} />
               ) : (
-                <Stack
-                  spacing={1}
-                  direction="row"
-                  justifyContent="space-between"
-                  alignItems="center"
-                >
-                  <SelectTypes />
-                  <Stack direction="row" gap={1}>
-                    {sortBy && setSortBy && (
-                      <SortingSelect
-                        sortBy={sortBy}
-                        options={options}
-                        setSortBy={setSortBy}
-                        ordering={ordering}
-                        setOrdering={setOrdering}
-                      />
-                    )}
-                    <ModeButton />
-                  </Stack>
-                </Stack>
+                <Typography variant="body1">
+                  {translateBuilder(BUILDER.TRASH_COUNT, {
+                    count: data.pages[0].totalCount,
+                  })}
+                </Typography>
               )}
             </Stack>
             <DragContainerStack id={CONTAINER_ID}>
@@ -149,9 +108,6 @@ const RecycledItemsScreenContent = ({
         </>
       );
     }
-    if (itemTypes.length || searchText) {
-      return <NoItemFilters searchText={searchText} />;
-    }
   }
 
   if (isLoading) {
@@ -163,25 +119,14 @@ const RecycledItemsScreenContent = ({
 
 const RecycledItemsScreen = (): JSX.Element | null => {
   const { t: translateBuilder } = useBuilderTranslation();
-  const itemSearch = useItemSearch();
 
   return (
     <PageWrapper
       title={translateBuilder(BUILDER.RECYCLE_BIN_TITLE)}
       id={RECYCLED_ITEMS_ROOT_CONTAINER}
-      options={
-        <Stack
-          direction="row"
-          alignItems="center"
-          justifyContent="flex-end"
-          spacing={1}
-        >
-          {itemSearch.input}
-        </Stack>
-      }
     >
       <SelectionContextProvider>
-        <RecycledItemsScreenContent searchText={itemSearch.text} />
+        <RecycledItemsScreenContent />
       </SelectionContextProvider>
     </PageWrapper>
   );

diff --git a/src/langs/constants.ts b/src/langs/constants.ts
@@ -603,4 +603,5 @@ export const BUILDER = {
   ACCESS_MANAGEMENT_TITLE: 'ACCESS_MANAGEMENT_TITLE',
   ITEM_LOGIN_SCHEMA_DISABLED_GUEST_ACCESS_MESSAGE:
     'ITEM_LOGIN_SCHEMA_DISABLED_GUEST_ACCESS_MESSAGE',
+  TRASH_COUNT: 'TRASH_COUNT',
 };
diff --git a/src/langs/en.json b/src/langs/en.json
@@ -496,5 +496,7 @@
   "REQUEST_ACCESS_BUTTON": "Request access",
   "REQUEST_ACCESS_SENT_BUTTON": "Request sent",
   "ACCESS_MANAGEMENT_TITLE": "Access Management",
-  "ITEM_LOGIN_SCHEMA_DISABLED_GUEST_ACCESS_MESSAGE": "This guest cannot login because pseudonymized access is disabled."
+  "ITEM_LOGIN_SCHEMA_DISABLED_GUEST_ACCESS_MESSAGE": "This guest cannot login because pseudonymized access is disabled.",
+  "TRASH_COUNT_one": "You have one item in your trash.",
+  "TRASH_COUNT_other": "You have {{count}} items in your trash."
 }
diff --git a/src/langs/fr.json b/src/langs/fr.json
@@ -495,5 +495,7 @@
   "REQUEST_ACCESS_TITLE": "Demander l'accès à cet élément",
   "REQUEST_ACCESS_BUTTON": "Demander l'accès",
   "REQUEST_ACCESS_SENT_BUTTON": "Demande envoyée",
-  "ACCESS_MANAGEMENT_TITLE": "Gestion des accès"
+  "ACCESS_MANAGEMENT_TITLE": "Gestion des accès",
+  "TRASH_COUNT_one": "Il y a un élément dans la poubelle.",
+  "TRASH_COUNT_other": "Il y a {{count}} éléments dans la poubelle."
 }
diff --git a/yarn.lock b/yarn.lock
@@ -1638,18 +1638,18 @@ __metadata:
   linkType: hard
 
 "@graasp/query-client@github:graasp/graasp-query-client#942-recycled-pagination":
-  version: 3.26.0
-  resolution: "@graasp/query-client@https://github.com/graasp/graasp-query-client.git#commit=06a7a368457c7a990ea1a2d53a0a8f0e1ea01a28"
+  version: 4.1.0
+  resolution: "@graasp/query-client@https://github.com/graasp/graasp-query-client.git#commit=2209d08e1151ebc2daa32de49a17a3ecf3ed57b9"
   dependencies:
-    "@tanstack/react-query": "npm:5.59.0"
-    "@tanstack/react-query-devtools": "npm:5.59.0"
+    "@tanstack/react-query": "npm:5.59.8"
+    "@tanstack/react-query-devtools": "npm:5.59.8"
     axios: "npm:1.7.7"
     http-status-codes: "npm:2.3.0"
   peerDependencies:
     "@graasp/sdk": ^4.0.0
     "@graasp/translations": "*"
     react: ^18.0.0
-  checksum: 10/050db33a3da837ea81f88a7dc477288acb1ef0fa4bee8c25f29674aec7315a1c1128a4cf8866542e26053aae89818a20170c794501f930f00204850437a4ad65
+  checksum: 10/e6edc1bdc6eb2bcbd6c5a3b337efb34e1d9f25d1fd640b8100cafc8ebfd8a1e38be57e485d14546572a9afb0a81de8b4cdd09d592759867f7adda9bbb4c882c9
   languageName: node
   linkType: hard
 
@@ -2560,10 +2560,10 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@tanstack/query-core@npm:5.59.0":
-  version: 5.59.0
-  resolution: "@tanstack/query-core@npm:5.59.0"
-  checksum: 10/2e8fd7d9bdd62cabc1a2b20b2cf0c9275174ee5550170f224bd4e30fe2d01cc8d39a0dd03caae55ddb8aea259d991966bb54b581b4046fd67c621c081f4b0ba7
+"@tanstack/query-core@npm:5.59.6":
+  version: 5.59.6
+  resolution: "@tanstack/query-core@npm:5.59.6"
+  checksum: 10/4cd634f957175dde80ed8f2b47eb14803d959073b6dccb7868f5dd6ddce26e41820b2dfc879dfc799de0726ae640201440c7d1d95113813bbcb25b03ec05949e
   languageName: node
   linkType: hard
 
@@ -2574,26 +2574,26 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@tanstack/react-query-devtools@npm:5.59.0":
-  version: 5.59.0
-  resolution: "@tanstack/react-query-devtools@npm:5.59.0"
+"@tanstack/react-query-devtools@npm:5.59.8":
+  version: 5.59.8
+  resolution: "@tanstack/react-query-devtools@npm:5.59.8"
   dependencies:
     "@tanstack/query-devtools": "npm:5.58.0"
   peerDependencies:
-    "@tanstack/react-query": ^5.59.0
+    "@tanstack/react-query": ^5.59.8
     react: ^18 || ^19
-  checksum: 10/a4deb3fe97355fcb98febd3b9cd5e871f3756771eb9eb15a2a226a0a9fb0314502522f70d12f54c25aec7985eae77b82b39bce37f86ee0312da046f4f1822bcf
+  checksum: 10/1e84af45cd6c722b296aef39ac2e7c98ef0db8c963bc43ebd802adc7077d514d06189862b02351e85878616542877af64266965147d75470cf834a23a9ee07ea
   languageName: node
   linkType: hard
 
-"@tanstack/react-query@npm:5.59.0":
-  version: 5.59.0
-  resolution: "@tanstack/react-query@npm:5.59.0"
+"@tanstack/react-query@npm:5.59.8":
+  version: 5.59.8
+  resolution: "@tanstack/react-query@npm:5.59.8"
   dependencies:
-    "@tanstack/query-core": "npm:5.59.0"
+    "@tanstack/query-core": "npm:5.59.6"
   peerDependencies:
     react: ^18 || ^19
-  checksum: 10/48963e7d0603958390db0087c018b71e87187ad84dea03279716b4869de83509027c37f65f3c6c4a1cd7b6f9f14250afffc2aeee5d481528e2308d937422ae41
+  checksum: 10/246cfa18e991782c97631ab30fc95987be81c7a25b057b65c3530a06f9e8acc98475ce8def29486be8d4c8f9ad391b9cfa2195b89e11dcd82f43a4ca172154f6
   languageName: node
   linkType: hard