refactor: apply PR requested changes

cypress/e2e/item/bookmarks/bookmarks.cy.ts

@@ -11,11 +11,13 @@ import { BOOKMARKED_ITEMS_PATH, HOME_PATH } from '../../../../src/config/paths';
 import {
   BOOKMARKED_ITEMS_ERROR_ALERT_ID,
   BOOKMARKED_ITEMS_ID,
+  BOOKMARK_ICON_SELECTOR,
   CREATE_ITEM_BUTTON_ID,
   ITEM_SEARCH_INPUT_ID,
   SORTING_ORDERING_SELECTOR_ASC,
   SORTING_ORDERING_SELECTOR_DESC,
   SORTING_SELECT_SELECTOR,
+  UNBOOKMARK_ICON_SELECTOR,
   buildItemCard,
 } from '../../../../src/config/selectors';
 import { CURRENT_USER } from '../../../fixtures/members';
@@ -28,13 +30,11 @@ const ITEMS = BOOKMARKED_ITEMS.map(({ item }) => item);
 const NON_BOOKMARKED_ITEM = PackedFolderItemFactory();
 
 const removefromBookmark = (itemId: string) => {
-  cy.get(`#${buildItemCard(itemId)} [data-testid="BookmarkIcon"]`).click();
+  cy.get(`#${buildItemCard(itemId)} ${UNBOOKMARK_ICON_SELECTOR}`).click();
 };
 
 const addToBookmark = (itemId: string) => {
-  cy.get(
-    `#${buildItemCard(itemId)} [data-testid="BookmarkBorderOutlinedIcon"]`,
-  ).click();
+  cy.get(`#${buildItemCard(itemId)} ${BOOKMARK_ICON_SELECTOR}`).click();
 };
 
 describe('Bookmarked Item', () => {
@@ -64,7 +64,6 @@ describe('Bookmarked Item', () => {
     });
 
     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.BOOKMARKS_NO_ITEM_SEARCH, {
@@ -78,13 +77,13 @@ describe('Bookmarked Item', () => {
       cy.get(`#${CREATE_ITEM_BUTTON_ID}`).should('not.exist');
     });
 
-    it('check bookmarked items view', () => {
+    it('Check bookmarked items view', () => {
       for (const { item } of BOOKMARKED_ITEMS) {
         cy.get(`#${buildItemCard(item.id)}`).should('be.visible');
       }
     });
 
-    it('add item to bookmarks', () => {
+    it('Add item to bookmarks', () => {
       cy.visit(HOME_PATH);
 
       const item = NON_BOOKMARKED_ITEM;

cypress/e2e/item/home/home.cy.ts

@@ -88,7 +88,9 @@ describe('Home', () => {
       });
     });
 
-    it.only('Sorting & ordering', () => {
+    it('Sorting & ordering', () => {
+      cy.wait('@getAccessibleItems');
+
       cy.get(`${SORTING_SELECT_SELECTOR} input`).should(
         'have.value',
         SortingOptions.ItemUpdatedAt,
@@ -98,17 +100,10 @@ describe('Home', () => {
       // change sorting
       cy.get(SORTING_SELECT_SELECTOR).click();
       cy.get('li[data-value="item.name"]').click();
-      cy.wait(['@getAccessibleItems', '@getAccessibleItems']).then(
-        ([
-          _first,
-          {
-            request: { url },
-          },
-        ]) => {
-          expect(url).to.contain('item.name');
-          expect(url).to.contain('desc');
-        },
-      );
+      cy.wait('@getAccessibleItems').then(({ request: { url } }) => {
+        expect(url).to.contain('item.name');
+        expect(url).to.contain('desc');
+      });
 
       // change ordering
       cy.get(SORTING_ORDERING_SELECTOR_DESC).click();
@@ -120,19 +115,14 @@ describe('Home', () => {
 
     describe('Search', () => {
       it('Search should trigger refetch', () => {
+        cy.wait('@getAccessibleItems');
+
         const searchText = 'mysearch';
         cy.get(`#${ITEM_SEARCH_INPUT_ID}`).type(searchText);
 
-        cy.wait(['@getAccessibleItems', '@getAccessibleItems']).then(
-          ([
-            _first,
-            {
-              request: { url },
-            },
-          ]) => {
-            expect(url).to.contain(searchText);
-          },
-        );
+        cy.wait('@getAccessibleItems').then(({ request: { url } }) => {
+          expect(url).to.contain(searchText);
+        });
       });
 
       it('Search on second page should reset page number', () => {

cypress/e2e/item/home/layoutMode.cy.ts

@@ -6,34 +6,48 @@ import { generateOwnItems } from '../../../fixtures/items';
 
 const ITEMS = generateOwnItems(30);
 
-it('Home screen layout mode', () => {
-  cy.setUpApi({
-    items: ITEMS,
+describe('Home screen', () => {
+  beforeEach(() => {
+    cy.setUpApi({
+      items: ITEMS,
+    });
   });
-  cy.visit(HOME_PATH);
 
-  // default mode is list
-  cy.get(`#${buildItemCard(ITEMS[0].id)}`);
+  it('Home screen list layout mode', () => {
+    cy.visit(HOME_PATH);
 
-  // go to grid
-  cy.switchMode(ItemLayoutMode.Grid);
-  cy.get(`#${buildItemCard(ITEMS[0].id)}`);
+    // default mode is list
+    cy.get(`#${buildItemCard(ITEMS[0].id)}`);
 
-  // go to map
-  cy.switchMode(ItemLayoutMode.Map);
-  cy.get(`#${buildMapViewId()}`, { timeout: 10000 }).should('be.visible');
+    // go to map
+    cy.switchMode(ItemLayoutMode.Map);
+    cy.get(`#${buildMapViewId()}`, { timeout: 10000 }).should('be.visible');
 
-  // go to list
-  cy.switchMode(ItemLayoutMode.List);
-  cy.get(`#${buildItemCard(ITEMS[0].id)}`);
-});
+    // go to list
+    cy.switchMode(ItemLayoutMode.List);
+    cy.get(`#${buildItemCard(ITEMS[0].id)}`);
+  });
+
+  it('Home screen grid layout mode', () => {
+    cy.visit(HOME_PATH);
+
+    // go to grid
+    cy.switchMode(ItemLayoutMode.Grid);
+    cy.get(`#${buildItemCard(ITEMS[0].id)}`);
+  });
+
+  it('Home screen map layout mode', () => {
+    cy.visit(HOME_PATH);
 
-it('visit Home on map by default', () => {
-  cy.setUpApi({
-    items: generateOwnItems(30),
+    // go to map
+    cy.switchMode(ItemLayoutMode.Map);
+    cy.get(`#${buildMapViewId()}`, { timeout: 10000 }).should('be.visible');
   });
-  // access map directly
-  cy.visit(`${HOME_PATH}?mode=map`);
 
-  cy.get(`#${buildMapViewId()}`, { timeout: 10000 }).should('be.visible');
+  it('visit Home on map by default', () => {
+    // access map directly
+    cy.visit(`${HOME_PATH}?mode=map`);
+
+    cy.get(`#${buildMapViewId()}`, { timeout: 10000 }).should('be.visible');
+  });
 });

cypress/e2e/item/order/reorderItems.cy.ts

@@ -38,7 +38,6 @@ describe('Order Items', () => {
         .find(`h5`)
         .then(($elements) => {
           for (let i = 0; i < $elements.length; i += 1) {
-            Cypress.log($elements[i]);
             expect($elements[i].innerText).to.equal(orderedItems[i].name);
           }
         });

cypress/e2e/item/publish/viewPublished.cy.ts

@@ -71,7 +71,7 @@ describe('Published Items', () => {
       }
     });
 
-    it.only('Sorting & Ordering', () => {
+    it('Sorting & Ordering', () => {
       cy.get(`${SORTING_SELECT_SELECTOR} input`).should(
         'have.value',
         SortingOptions.ItemUpdatedAt,

cypress/e2e/item/settings/itemSettings.cy.ts

@@ -63,6 +63,7 @@ describe('Item Settings', () => {
     it('settings page redirects to item', () => {
       // manual click to verify settings button works correctly
       cy.visit(buildItemSettingsPath(item.id));
+      // name could have ellipsis
       cy.get(`.${ITEM_MAIN_CLASS}`).should('contain', item.name.slice(0, 10));
     });
   });

cypress/e2e/item/trash/viewTrash.cy.ts

@@ -67,7 +67,7 @@ describe('View trash', () => {
       }
     });
 
-    it.only('Sorting & Ordering', () => {
+    it('Sorting & Ordering', () => {
       cy.get(`${SORTING_SELECT_SELECTOR} input`).should(
         'have.value',
         SortingOptions.ItemUpdatedAt,

cypress/e2e/item/view/viewFolder.cy.ts

@@ -97,7 +97,7 @@ describe('View Folder', () => {
     cy.get(`#${buildItemCard(child1.id)}`).should('be.visible');
   });
 
-  it.only('Sorting & Ordering', () => {
+  it('Sorting & Ordering', () => {
     const { id } = parentItem;
     cy.visit(buildItemPath(id));
 
@@ -130,28 +130,37 @@ describe('View Folder', () => {
   });
 });
 
-it('Folder Layout mode', () => {
-  cy.setUpApi({
-    items: [parentItem, child1],
+describe('Folder Layout mode', () => {
+  beforeEach(() => {
+    cy.setUpApi({
+      items: [parentItem, child1],
+    });
+    cy.visit(buildItemPath(parentItem.id));
   });
-  cy.visit(buildItemPath(parentItem.id));
 
-  // default mode is list
-  cy.get(`#${buildItemCard(child1.id)}`);
+  it('list', () => {
+    // default mode is list
+    cy.get(`#${buildItemCard(child1.id)}`);
 
-  // go to grid
-  cy.switchMode(ItemLayoutMode.Grid);
-  cy.get(`#${buildItemCard(child1.id)}`);
+    // go to map
+    cy.switchMode(ItemLayoutMode.Map);
 
-  // go to map
-  cy.switchMode(ItemLayoutMode.Map);
-  cy.get(`#${buildMapViewId(parentItem.id)}`, { timeout: 10000 }).should(
-    'be.visible',
-  );
+    // go to list
+    cy.switchMode(ItemLayoutMode.List);
+    cy.get(`#${buildItemCard(child1.id)}`);
+  });
+
+  it('grid', () => {
+    cy.switchMode(ItemLayoutMode.Grid);
+    cy.get(`#${buildItemCard(child1.id)}`);
+  });
 
-  // go to list
-  cy.switchMode(ItemLayoutMode.List);
-  cy.get(`#${buildItemCard(child1.id)}`);
+  it('map', () => {
+    cy.switchMode(ItemLayoutMode.Map);
+    cy.get(`#${buildMapViewId(parentItem.id)}`, { timeout: 10000 }).should(
+      'be.visible',
+    );
+  });
 });
 
 it('visit Home on map by default', () => {

cypress/support/commands.ts

@@ -372,8 +372,7 @@ Cypress.Commands.add('switchMode', (mode) => {
       cy.get(`li[value="${ItemLayoutMode.Map}"]`).click({ force: true });
       break;
     default:
-      console.error(`invalid mode ${mode} provided`);
-      break;
+      throw new Error(`invalid mode ${mode} provided`);
   }
 });
 

cypress/support/index.ts

@@ -46,7 +46,6 @@ declare global {
       handleTreeMenu(path: string, rootId?: string): void;
       switchMode(mode: string): void;
       goToItemInCard(path: string): void;
-      goToItemInCard(path: string): void;
       goToItemWithNavigation(id: string): void;
 
       goToHome(): void;

src/components/App.tsx

@@ -23,10 +23,10 @@ import { useCurrentUserContext } from './context/CurrentUserContext';
 import Main from './main/Main';
 import Redirect from './main/Redirect';
 import BookmarkedItemsScreen from './pages/BookmarkedItemsScreen';
-import HomeScreen from './pages/HomeScreen';
 import MapItemsScreen from './pages/MapItemsScreen';
 import PublishedItemsScreen from './pages/PublishedItemsScreen';
 import RecycledItemsScreen from './pages/RecycledItemsScreen';
+import HomeScreen from './pages/home/HomeScreen';
 import ItemPageLayout from './pages/item/ItemPageLayout';
 import ItemScreen from './pages/item/ItemScreen';
 import ItemScreenLayout from './pages/item/ItemScreenLayout';

src/components/Root.tsx

@@ -48,7 +48,7 @@ const Root = (): JSX.Element => (
       </ThemeProvider>
     </I18nextProvider>
     {import.meta.env.DEV && import.meta.env.MODE !== 'test' && (
-      <ReactQueryDevtools position="bottom-right" />
+      <ReactQueryDevtools position="bottom-left" />
     )}
   </QueryClientProvider>
 );

src/components/common/DuplicateButton.tsx

@@ -20,10 +20,11 @@ const DuplicateButton = ({
   const { t: translateBuilder } = useBuilderTranslation();
 
   const handleDuplicate = () => {
-    const parentsIds = getParentsIdsFromPath(item.path);
+    const parentsIds = getParentsIdsFromPath(item.path, { ignoreSelf: true });
     // get the close parent if not then undefined
-    const to =
-      parentsIds.length > 1 ? parentsIds[parentsIds.length - 2] : undefined;
+    const to = parentsIds.length
+      ? parentsIds[parentsIds.length - 1]
+      : undefined;
 
     copyItems({
       ids: [item.id],

src/components/hooks/uploadWithProgress.ts

@@ -6,11 +6,9 @@ import { AxiosProgressEvent } from 'axios';
 import { useBuilderTranslation } from '@/config/i18n';
 import { BUILDER } from '@/langs/constants';
 
-// eslint-disable-next-line import/prefer-default-export
 export const useUploadWithProgress = (): {
   update: (p: AxiosProgressEvent) => void;
-  close: () => void;
-  closeAndShowError: (e: Error) => void;
+  close: (e?: Error) => void;
   show: (p?: number) => void;
 } => {
   const { t: translateBuilder } = useBuilderTranslation();
@@ -35,18 +33,18 @@ export const useUploadWithProgress = (): {
     }
   };
 
-  const close = () => {
-    if (toastId.current) {
+  const close = (error?: Error) => {
+    // show correct feedback message
+    if (error) {
+      toast.error(error.message);
+    } else if (toastId.current) {
       toast.done(toastId.current);
-      toastId.current = null;
     }
-  };
-  const closeAndShowError = (e: Error) => {
-    toast.error(e.message);
+    // delete reference
     if (toastId.current) {
       toastId.current = null;
     }
   };
 
-  return { show, update, close, closeAndShowError };
+  return { show, update, close };
 };