fix: return all children for navigation (#480)

* fix: return all children for navigation * test: add tests
graasp · Jan 19, 2024 · 78e38ad · 78e38ad
1 parent 4b1b40b
commit 78e38ad
Show file tree

Hide file tree

Showing 5 changed files with 83 additions and 10 deletions.
diff --git a/cypress/e2e/navigation.cy.ts b/cypress/e2e/navigation.cy.ts
@@ -5,6 +5,7 @@ import { SHOW_MORE_ITEMS_ID, buildTreeItemClass } from '@/config/selectors';
 
 import {
   FOLDER_WITH_SUBFOLDER_ITEM,
+  FOLDER_WITH_SUBFOLDER_ITEM_AND_PARTIAL_ORDER,
   generateLotsOfFoldersOnHome,
 } from '../fixtures/items';
 import { MEMBERS } from '../fixtures/members';
@@ -38,6 +39,17 @@ describe('Navigation', () => {
     const child = FOLDER_WITH_SUBFOLDER_ITEM.items[1];
     const childOfChild = FOLDER_WITH_SUBFOLDER_ITEM.items[3];
     cy.get(`.${buildTreeItemClass(child.id)}`).click();
-    cy.get(`.${buildTreeItemClass(childOfChild.id)}`);
+    cy.get(`.${buildTreeItemClass(childOfChild.id)}`).should('be.visible');
+  });
+
+  it('show all folders for partial order', () => {
+    cy.setUpApi({ items: FOLDER_WITH_SUBFOLDER_ITEM_AND_PARTIAL_ORDER.items });
+    const parent = FOLDER_WITH_SUBFOLDER_ITEM_AND_PARTIAL_ORDER.items[0];
+    cy.visit(buildMainPath({ rootId: parent.id }));
+
+    const child = FOLDER_WITH_SUBFOLDER_ITEM_AND_PARTIAL_ORDER.items[1];
+    const child1 = FOLDER_WITH_SUBFOLDER_ITEM_AND_PARTIAL_ORDER.items[2];
+    cy.get(`.${buildTreeItemClass(child.id)}`).should('be.visible');
+    cy.get(`.${buildTreeItemClass(child1.id)}`).should('be.visible');
   });
 });
diff --git a/cypress/fixtures/items.ts b/cypress/fixtures/items.ts
@@ -113,6 +113,57 @@ export const FOLDER_WITH_SUBFOLDER_ITEM: { items: MockItem[] } = {
     },
   ],
 };
+export const FOLDER_WITH_SUBFOLDER_ITEM_AND_PARTIAL_ORDER: {
+  items: MockItem[];
+} = {
+  items: [
+    {
+      ...DEFAULT_FOLDER_ITEM,
+      id: 'ecafbd2a-5688-11eb-ae93-0242ac130002',
+      name: 'parent folder',
+      path: 'ecafbd2a_5688_11eb_ae93_0242ac130002',
+      extra: {
+        [ItemType.FOLDER]: {
+          childrenOrder: ['fdf09f5a-5688-11eb-ae93-0242ac130003'],
+        },
+      },
+      settings: {
+        isPinned: false,
+        showChatbox: false,
+      },
+    },
+    {
+      ...DEFAULT_FOLDER_ITEM,
+      id: 'fdf09f5a-5688-11eb-ae93-0242ac130003',
+      name: 'child folder 1',
+      path: 'ecafbd2a_5688_11eb_ae93_0242ac130002.fdf09f5a_5688_11eb_ae93_0242ac130003',
+      settings: {
+        isPinned: true,
+        showChatbox: false,
+      },
+    },
+    {
+      ...DEFAULT_FOLDER_ITEM,
+      id: 'fdf09f5a-5688-11eb-ae93-0242ac130004',
+      name: 'child folder 2',
+      path: 'ecafbd2a_5688_11eb_ae93_0242ac130002.fdf09f5a_5688_11eb_ae93_0242ac130004',
+      settings: {
+        isPinned: false,
+        showChatbox: false,
+      },
+    },
+    {
+      ...DEFAULT_FOLDER_ITEM,
+      id: 'fdf09f5a-5688-11eb-ae93-0242ac130005',
+      name: 'child of child folder 1',
+      path: 'ecafbd2a_5688_11eb_ae93_0242ac130002.fdf09f5a_5688_11eb_ae93_0242ac130003.fdf09f5a_5688_11eb_ae93_0242ac130005',
+      settings: {
+        isPinned: true,
+        showChatbox: false,
+      },
+    },
+  ],
+};
 
 export const FOLDER_WITH_PINNED_ITEMS: { items: MockItem[] } = {
   items: [

diff --git a/package.json b/package.json
@@ -37,7 +37,7 @@
     "@emotion/styled": "11.11.0",
     "@graasp/chatbox": "3.0.3",
     "@graasp/query-client": "2.2.3",
-    "@graasp/sdk": "3.4.1",
+    "@graasp/sdk": "github:graasp/graasp-sdk#377-sort-children",
     "@graasp/translations": "1.21.1",
     "@graasp/ui": "4.3.0",
     "@mui/icons-material": "5.14.19",

diff --git a/src/utils/tree.ts b/src/utils/tree.ts
@@ -3,6 +3,7 @@ import {
   ItemType,
   UnionOfConst,
   getMimetype,
+  sortChildrenWith,
 } from '@graasp/sdk';
 
 import { getParentsIdsFromPath } from './item';
@@ -65,13 +66,10 @@ const buildItemsTree = (
   const buildTree = (node: DiscriminatedItem) => {
     if (node.type === ItemType.FOLDER && mapTree[node.id]) {
       // sort by children order or default to all if not defined
-      const children = node.extra.folder?.childrenOrder?.length
-        ? (node.extra.folder.childrenOrder
-            .map((id) =>
-              mapTree[node.id].find(({ id: childId }) => childId === id),
-            )
-            .filter(Boolean) as DiscriminatedItem[])
-        : mapTree[node.id];
+      const children = sortChildrenWith(
+        mapTree[node.id] ?? [],
+        node.extra.folder?.childrenOrder,
+      );
 
       const entry: PartialItemWithChildren = {
         id: node.id,

diff --git a/yarn.lock b/yarn.lock
@@ -1314,6 +1314,18 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@graasp/sdk@github:graasp/graasp-sdk#377-sort-children":
+  version: 3.4.1
+  resolution: "@graasp/sdk@https://github.com/graasp/graasp-sdk.git#commit=5323db685c9240c8d7e75f318254bcc8ab59ccf2"
+  dependencies:
+    date-fns: "npm:3.2.0"
+    js-cookie: "npm:3.0.5"
+    uuid: "npm:9.0.1"
+    validator: "npm:13.11.0"
+  checksum: 3c750d0727f0aa13be9b7ad2cf01d65c3afd460df74f86a3a6ac55f8603b212843c4bb4cee825d4ce83f8db915691561a49df8b740ddac01a90ab4e8d2b2eefd
+  languageName: node
+  linkType: hard
+
 "@graasp/sdk@npm:3.3.0, @graasp/sdk@npm:^3.3.0":
   version: 3.3.0
   resolution: "@graasp/sdk@npm:3.3.0"
@@ -5776,7 +5788,7 @@ __metadata:
     "@emotion/styled": "npm:11.11.0"
     "@graasp/chatbox": "npm:3.0.3"
     "@graasp/query-client": "npm:2.2.3"
-    "@graasp/sdk": "npm:3.4.1"
+    "@graasp/sdk": "github:graasp/graasp-sdk#377-sort-children"
     "@graasp/translations": "npm:1.21.1"
     "@graasp/ui": "npm:4.3.0"
     "@mui/icons-material": "npm:5.14.19"