feat: apply small fixes (#386)

rename recycle bin to trash
fix breadcrumb navigation
show shared items in tree modal
show member in shared items table
change username to pseudo
clear email input on invite

cypress/fixtures/sharedItems.js

@@ -0,0 +1,48 @@
+import { PERMISSION_LEVELS } from '../../src/enums';
+import { DEFAULT_FOLDER_ITEM } from './items';
+import { MEMBERS } from './members';
+
+// eslint-disable-next-line import/prefer-default-export
+export const SHARED_ITEMS = {
+  items: [
+    {
+      ...DEFAULT_FOLDER_ITEM,
+      creator: MEMBERS.BOB.id,
+      id: 'ecdfbd2a-5688-11eb-ae93-0242ac130002',
+      name: 'shared_item_name1',
+      path: 'ecdfbd2a_5688_11eb_ae93_0242ac130002',
+      extra: {
+        image: 'someimageurl',
+      },
+      memberships: [
+        {
+          itemPath: 'fdf09f5a_5688_11eb_ae93_0242ac130002',
+          permission: PERMISSION_LEVELS.ADMIN,
+          memberId: MEMBERS.ANNA.id,
+        },
+      ],
+    },
+    {
+      ...DEFAULT_FOLDER_ITEM,
+      creator: MEMBERS.CEDRIC.id,
+      id: 'fdf19f5a-5688-11eb-ae93-0242ac130002',
+      name: 'shared_item_name2',
+      path: 'fdf19f5a_5688_11eb_ae93_0242ac130002',
+      extra: {
+        image: 'someimageurl',
+      },
+      memberships: [
+        {
+          itemPath: 'fdf09f5a-5688-11eb-ae93-0242ac130002',
+          permission: PERMISSION_LEVELS.ADMIN,
+          memberId: MEMBERS.ANNA.id,
+        },
+        {
+          itemPath: 'fdf09f5a_5688_11eb_ae93_0242ac130002',
+          permission: PERMISSION_LEVELS.READ,
+          memberId: MEMBERS.BOB.id,
+        },
+      ],
+    },
+  ],
+};

cypress/integration/item/copy/listCopyItem.spec.js

@@ -1,10 +1,15 @@
 import {
   DEFAULT_ITEM_LAYOUT_MODE,
   ROOT_ID,
+  SHARED_ROOT_ID,
 } from '../../../../src/config/constants';
 import { ITEM_LAYOUT_MODES } from '../../../../src/enums';
 
-import { buildItemPath, HOME_PATH } from '../../../../src/config/paths';
+import {
+  buildItemPath,
+  HOME_PATH,
+  SHARED_ITEMS_PATH,
+} from '../../../../src/config/paths';
 import {
   buildItemsTableRowIdAttribute,
   buildItemMenu,
@@ -15,13 +20,14 @@ import {
 } from '../../../../src/config/selectors';
 import { SAMPLE_ITEMS } from '../../../fixtures/items';
 import { TABLE_ITEM_RENDER_TIME } from '../../../support/constants';
+import { SHARED_ITEMS } from '../../../fixtures/sharedItems';
 
-const copyItem = ({ id, toItemPath }) => {
+const copyItem = ({ id, toItemPath, rootId }) => {
   const menuSelector = `#${buildItemMenuButtonId(id)}`;
   cy.wait(TABLE_ITEM_RENDER_TIME);
   cy.get(menuSelector).click();
   cy.get(`#${buildItemMenu(id)} .${ITEM_MENU_COPY_BUTTON_CLASS}`).click();
-  cy.fillTreeModal(toItemPath);
+  cy.fillTreeModal(toItemPath, rootId);
 };
 
 describe('Copy Item in List', () => {
@@ -93,6 +99,25 @@ describe('Copy Item in List', () => {
     });
   });
 
+  it('copy item in a shared item', () => {
+    cy.setUpApi(SHARED_ITEMS);
+    const { path } = SHARED_ITEMS.items[0];
+
+    // go to children item
+    cy.visit(SHARED_ITEMS_PATH);
+    if (DEFAULT_ITEM_LAYOUT_MODE !== ITEM_LAYOUT_MODES.LIST) {
+      cy.switchMode(ITEM_LAYOUT_MODES.LIST);
+    }
+
+    // copy
+    const { id: copyItemId } = SHARED_ITEMS.items[1];
+    copyItem({ id: copyItemId, toItemPath: path, rootId: SHARED_ROOT_ID });
+
+    cy.wait('@copyItems').then(() => {
+      cy.get(buildItemsTableRowIdAttribute(copyItemId)).should('exist');
+    });
+  });
+
   describe('Error handling', () => {
     it('error while copying item does not create in interface', () => {
       cy.setUpApi({ ...SAMPLE_ITEMS, copyItemsError: true });

cypress/integration/item/favorite/favoriteItem.spec.js

@@ -6,9 +6,14 @@ import {
   CREATE_ITEM_BUTTON_ID,
   buildItemMenuButtonId,
   buildItemMenu,
+  NAVIGATION_ROOT_ID,
 } from '../../../../src/config/selectors';
-import { buildMemberWithFavorites } from '../../../fixtures/members';
+import {
+  buildMemberWithFavorites,
+  CURRENT_USER,
+} from '../../../fixtures/members';
 import { TABLE_ITEM_RENDER_TIME } from '../../../support/constants';
+import i18n from '../../../../src/config/i18n';
 
 const toggleFavoriteButton = (itemId) => {
   cy.wait(TABLE_ITEM_RENDER_TIME);
@@ -26,11 +31,16 @@ describe('Favorite Item', () => {
         ...SAMPLE_ITEMS,
         currentMember: buildMemberWithFavorites(favoriteItems),
       });
+      i18n.changeLanguage(CURRENT_USER.extra.lang);
       cy.visit(HOME_PATH);
     });
 
     it("New button doesn't exists", () => {
       cy.visit(FAVORITE_ITEMS_PATH);
+      cy.get(`#${NAVIGATION_ROOT_ID}`).should(
+        'have.text',
+        i18n.t('Favorite Items'),
+      );
       cy.get(`#${CREATE_ITEM_BUTTON_ID}`).should('not.exist');
     });
 

cypress/integration/item/move/listMoveItem.spec.js

@@ -1,9 +1,14 @@
 import {
   ROOT_ID,
   DEFAULT_ITEM_LAYOUT_MODE,
+  SHARED_ROOT_ID,
 } from '../../../../src/config/constants';
 import { ITEM_LAYOUT_MODES } from '../../../../src/enums';
-import { buildItemPath, HOME_PATH } from '../../../../src/config/paths';
+import {
+  buildItemPath,
+  HOME_PATH,
+  SHARED_ITEMS_PATH,
+} from '../../../../src/config/paths';
 import {
   buildItemsTableRowIdAttribute,
   buildItemMenu,
@@ -12,16 +17,17 @@ import {
 } from '../../../../src/config/selectors';
 import { SAMPLE_ITEMS } from '../../../fixtures/items';
 import { TABLE_ITEM_RENDER_TIME } from '../../../support/constants';
+import { SHARED_ITEMS } from '../../../fixtures/sharedItems';
 
-const moveItem = ({ id: movedItemId, toItemPath }) => {
+const moveItem = ({ id: movedItemId, toItemPath, rootId = ROOT_ID }) => {
   const menuSelector = `#${buildItemMenuButtonId(movedItemId)}`;
   cy.wait(TABLE_ITEM_RENDER_TIME);
   cy.get(menuSelector).click();
   cy.get(
     `#${buildItemMenu(movedItemId)} .${ITEM_MENU_MOVE_BUTTON_CLASS}`,
   ).click();
 
-  cy.fillTreeModal(toItemPath);
+  cy.fillTreeModal(toItemPath, rootId);
 };
 
 describe('Move Item in List', () => {
@@ -88,6 +94,27 @@ describe('Move Item in List', () => {
     });
   });
 
+  it('move item in shared item', () => {
+    cy.setUpApi(SHARED_ITEMS);
+
+    // go to children item
+    cy.visit(SHARED_ITEMS_PATH);
+
+    if (DEFAULT_ITEM_LAYOUT_MODE !== ITEM_LAYOUT_MODES.LIST) {
+      cy.switchMode(ITEM_LAYOUT_MODES.LIST);
+    }
+
+    // move
+    const { path: toItemPath, id: toItemId } = SHARED_ITEMS.items[0];
+    const { id: movedItem } = SHARED_ITEMS.items[1];
+    moveItem({ id: movedItem, toItemPath, rootId: SHARED_ROOT_ID });
+
+    cy.wait('@moveItems').then(({ request: { body, url } }) => {
+      expect(body.parentId).to.equal(toItemId);
+      expect(url).to.contain(movedItem);
+    });
+  });
+
   describe('Error handling', () => {
     it('error while moving item does not create in interface', () => {
       cy.setUpApi({ ...SAMPLE_ITEMS, moveItemsError: true });

cypress/integration/item/view/viewFolder.spec.js

@@ -2,7 +2,12 @@ import {
   DEFAULT_ITEM_LAYOUT_MODE,
   GRID_ITEMS_PER_PAGE_CHOICES,
 } from '../../../../src/config/constants';
-import { buildItemPath, HOME_PATH } from '../../../../src/config/paths';
+import i18n from '../../../../src/config/i18n';
+import {
+  buildItemPath,
+  HOME_PATH,
+  SHARED_ITEMS_PATH,
+} from '../../../../src/config/paths';
 import {
   buildItemCard,
   buildItemsTableRowIdAttribute,
@@ -12,11 +17,14 @@ import {
   ITEMS_GRID_PAGINATION_ID,
   NAVIGATION_HOME_LINK_ID,
   ITEMS_TABLE_ROW,
+  NAVIGATION_ROOT_ID,
 } from '../../../../src/config/selectors';
 import { ITEM_LAYOUT_MODES } from '../../../../src/enums';
 import { IMAGE_ITEM_DEFAULT, VIDEO_ITEM_S3 } from '../../../fixtures/files';
 import { generateOwnItems, SAMPLE_ITEMS } from '../../../fixtures/items';
 import { GRAASP_LINK_ITEM } from '../../../fixtures/links';
+import { CURRENT_USER } from '../../../fixtures/members';
+import { SHARED_ITEMS } from '../../../fixtures/sharedItems';
 import { NAVIGATION_LOAD_PAUSE } from '../../../support/constants';
 import { expectFolderViewScreenLayout } from './utils';
 
@@ -26,11 +34,13 @@ describe('View Folder', () => {
       cy.setUpApi({
         items: [
           ...SAMPLE_ITEMS.items,
+          ...SHARED_ITEMS.items,
           GRAASP_LINK_ITEM,
           IMAGE_ITEM_DEFAULT,
           VIDEO_ITEM_S3,
         ],
       });
+      i18n.changeLanguage(CURRENT_USER.extra.lang);
     });
 
     it('visit Home', () => {
@@ -45,6 +55,9 @@ describe('View Folder', () => {
         }
       });
 
+      // breadcrumb navigation
+      cy.get(`#${NAVIGATION_ROOT_ID}`).should('have.text', i18n.t('My Items'));
+
       // visit child
       const { id: childId } = SAMPLE_ITEMS.items[0];
       cy.goToItemInGrid(childId);
@@ -57,13 +70,19 @@ describe('View Folder', () => {
         }
       });
 
+      // breadcrumb navigation
+      cy.get(`#${NAVIGATION_ROOT_ID}`).should('have.text', i18n.t('My Items'));
+
       // visit child
       const { id: childChildId } = SAMPLE_ITEMS.items[2];
       cy.goToItemInGrid(childChildId);
 
       // expect no children
       cy.get(`#${ITEMS_GRID_NO_ITEM_ID}`).should('exist');
 
+      // breadcrumb navigation
+      cy.get(`#${NAVIGATION_ROOT_ID}`).should('have.text', i18n.t('My Items'));
+
       // return parent with navigation and should display children
       cy.wait(NAVIGATION_LOAD_PAUSE);
       cy.goToItemWithNavigation(childId);
@@ -74,6 +93,45 @@ describe('View Folder', () => {
           cy.get(`#${buildItemCard(item.id)}`).should('exist');
         }
       });
+      // breadcrumb navigation
+      cy.get(`#${NAVIGATION_ROOT_ID}`).should('have.text', i18n.t('My Items'));
+    });
+
+    it('visit Shared Items', () => {
+      cy.visit(SHARED_ITEMS_PATH);
+      cy.switchMode(ITEM_LAYOUT_MODES.GRID);
+
+      // should get own items
+      cy.wait('@getSharedItems').then(({ response: { body } }) => {
+        // check item is created and displayed
+        for (const item of body) {
+          cy.get(`#${buildItemCard(item.id)}`).should('exist');
+        }
+      });
+
+      // breadcrumb navigation
+      cy.get(`#${NAVIGATION_ROOT_ID}`).should(
+        'have.text',
+        i18n.t('Shared Items'),
+      );
+
+      // visit child
+      const { id: childId } = SHARED_ITEMS.items[0];
+      cy.goToItemInGrid(childId);
+
+      // should get children
+      cy.wait('@getChildren').then(({ response: { body } }) => {
+        // check item is created and displayed
+        for (const item of body) {
+          cy.get(`#${buildItemCard(item.id)}`).should('exist');
+        }
+      });
+
+      // breadcrumb navigation
+      cy.get(`#${NAVIGATION_ROOT_ID}`).should(
+        'have.text',
+        i18n.t('Shared Items'),
+      );
     });
 
     it('visit item by id', () => {

cypress/support/commands/item.js

@@ -43,12 +43,12 @@ Cypress.Commands.add(
   },
 );
 
-Cypress.Commands.add('fillTreeModal', (toItemPath) => {
+Cypress.Commands.add('fillTreeModal', (toItemPath, treeRootId = ROOT_ID) => {
   const ids = getParentsIdsFromPath(toItemPath);
 
   cy.wait(TREE_VIEW_PAUSE);
 
-  [ROOT_ID, ...ids].forEach((value, idx, array) => {
+  [treeRootId, ...ids].forEach((value, idx, array) => {
     cy.get(`#${TREE_MODAL_TREE_ID}`).then(($tree) => {
       // click on the element
       if (idx === array.length - 1) {

cypress/support/server.js

@@ -1,6 +1,7 @@
 import { v4 as uuidv4, v4 } from 'uuid';
 import { StatusCodes } from 'http-status-codes';
 import qs from 'querystring';
+import { FAILURE_MESSAGES } from '@graasp/translations';
 import { API_ROUTES } from '@graasp/query-client';
 import {
   getItemById,
@@ -642,7 +643,13 @@ export const mockGetMembers = (members) => {
       if (typeof memberIds === 'string') {
         memberIds = [memberIds];
       }
-      const allMembers = memberIds?.map((id) => getMemberById(members, id));
+      const allMembers = memberIds?.map(
+        (id) =>
+          getMemberById(members, id) ?? {
+            statusCode: StatusCodes.NOT_FOUND,
+            name: FAILURE_MESSAGES.MEMBER_NOT_FOUND,
+          },
+      );
       // member does not exist in db
       if (!allMembers) {
         return reply({

src/components/SharedItems.js

@@ -32,6 +32,7 @@ const SharedItems = () => {
         id={SHARED_ITEMS_ID}
         title={t('Items Shared With Me')}
         items={List(sharedItems)}
+        showCreator
       />
     </Main>
   );