feat: hide none-folder in the move modal (#984)

* feat: hide none-folder in the move modal

* chore: update query-client dependency to main branch

* chore: udpate query-client to 2.5.0

package.json

@@ -19,7 +19,7 @@
     "@emotion/react": "11.11.3",
     "@emotion/styled": "11.11.0",
     "@graasp/chatbox": "3.0.1",
-    "@graasp/query-client": "2.4.1",
+    "@graasp/query-client": "2.5.0",
     "@graasp/sdk": "3.4.1",
     "@graasp/translations": "1.22.1",
     "@graasp/ui": "4.5.1",

src/components/main/itemSelectionModal/AccessibleNavigationTree.tsx

@@ -2,7 +2,7 @@ import { useState } from 'react';
 
 import { Pagination, Stack } from '@mui/material';
 
-import { PermissionLevel } from '@graasp/sdk';
+import { ItemType, PermissionLevel } from '@graasp/sdk';
 
 import { hooks } from '@/config/queryClient';
 
@@ -27,7 +27,10 @@ const AccessibleNavigationTree = ({
   const [page, setPage] = useState(1);
   // todo: show only items with admin rights
   const { data: accessibleItems } = hooks.useAccessibleItems(
-    { permissions: [PermissionLevel.Write, PermissionLevel.Admin] },
+    {
+      permissions: [PermissionLevel.Write, PermissionLevel.Admin],
+      types: [ItemType.FOLDER],
+    },
     { page },
   );
 

src/components/main/itemSelectionModal/ChildrenNavigationTree.tsx

@@ -1,5 +1,7 @@
 import { Box } from '@mui/material';
 
+import { ItemType } from '@graasp/sdk';
+
 import { useBuilderTranslation } from '@/config/i18n';
 import { hooks } from '@/config/queryClient';
 import { BUILDER } from '@/langs/constants';
@@ -23,10 +25,14 @@ const ChildrenNavigationTree = ({
   isDisabled,
 }: ChildrenNavigationTreeProps): JSX.Element => {
   const { t: translateBuilder } = useBuilderTranslation();
+  // TODO: use filter in useChildren directly in another PR
   const { data: children } = hooks.useChildren(selectedNavigationItem.id);
+
+  const folders = children?.filter((item) => item.type === ItemType.FOLDER);
+
   return (
     <>
-      {children?.map((ele) => (
+      {folders?.map((ele) => (
         <RowMenu
           key={ele.id}
           item={ele}
@@ -36,7 +42,7 @@ const ChildrenNavigationTree = ({
           isDisabled={isDisabled}
         />
       ))}
-      {!children?.length && (
+      {!folders?.length && (
         <Box sx={{ color: 'darkgrey', pt: 1 }}>
           {translateBuilder(BUILDER.EMPTY_FOLDER_CHILDREN_FOR_THIS_ITEM)}
         </Box>

src/components/main/itemSelectionModal/RootNavigationTree.tsx

@@ -31,7 +31,10 @@ const RootNavigationTree = ({
   // todo: to change with real recent items (most used)
   const { data: recentItems } = hooks.useAccessibleItems(
     // you can move into an item you have at least write permission
-    { permissions: [PermissionLevel.Admin, PermissionLevel.Write] },
+    {
+      permissions: [PermissionLevel.Admin, PermissionLevel.Write],
+      types: [ItemType.FOLDER],
+    },
     { pageSize: 5 },
   );
   const recentFolders = recentItems?.data?.filter(

yarn.lock

@@ -1219,9 +1219,9 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@graasp/query-client@npm:2.4.1":
-  version: 2.4.1
-  resolution: "@graasp/query-client@npm:2.4.1"
+"@graasp/query-client@npm:2.5.0":
+  version: 2.5.0
+  resolution: "@graasp/query-client@npm:2.5.0"
   dependencies:
     "@graasp/sdk": "npm:3.6.0"
     "@graasp/translations": "npm:1.23.0"
@@ -1234,7 +1234,7 @@ __metadata:
     uuid: "npm:9.0.1"
   peerDependencies:
     react: ^17.0.0 || ^18.0.0
-  checksum: 22becf7d980a618ed091b5e09de6cfd50b70af441934403fadf93afcf1cf562c983a7dd664cfbdff5f4c985d0a18f9cba285850c1909dce60ed9a2fdaa471c2d
+  checksum: 3f609bc338770a04ae1764a5a9663ee9bd788261d09983e89e7dc8d2299ce75eeee267106903158b06da46e0698ef9f04f20f937eab52785a3b10ef273fda934
   languageName: node
   linkType: hard
 
@@ -6338,7 +6338,7 @@ __metadata:
     "@emotion/react": "npm:11.11.3"
     "@emotion/styled": "npm:11.11.0"
     "@graasp/chatbox": "npm:3.0.1"
-    "@graasp/query-client": "npm:2.4.1"
+    "@graasp/query-client": "npm:2.5.0"
     "@graasp/sdk": "npm:3.4.1"
     "@graasp/translations": "npm:1.22.1"
     "@graasp/ui": "npm:4.5.1"