fix: fix file drop placement depending on mainmenu (#536)

* fix: fix file drop placement depending on mainmenu

cypress/e2e/invitations/createInvitation.cy.js

@@ -5,7 +5,7 @@ import {
   SHARE_ITEM_SHARE_BUTTON_ID,
   buildShareButtonId,
 } from '../../../src/config/selectors';
-import { PERMISSION_LEVELS } from '../../../src/enums';
+import { PERMISSION_LEVELS } from '../../fixtures/enum';
 import { SAMPLE_ITEMS } from '../../fixtures/items';
 import { MEMBERS } from '../../fixtures/members';
 

cypress/e2e/invitations/editInvitation.cy.js

@@ -1,11 +1,11 @@
-import { PERMISSION_LEVELS } from '../../../src/enums';
 import { buildItemPath } from '../../../src/config/paths';
 import {
   buildInvitationTableRowSelector,
   buildPermissionOptionId,
   buildShareButtonId,
   ITEM_MEMBERSHIP_PERMISSION_SELECT_CLASS,
 } from '../../../src/config/selectors';
+import { PERMISSION_LEVELS } from '../../fixtures/enum';
 import { ITEMS_WITH_INVITATIONS } from '../../fixtures/invitations';
 import { TABLE_MEMBERSHIP_RENDER_TIME } from '../../support/constants';
 

cypress/e2e/item/create/createShortcut.cy.js

@@ -7,8 +7,9 @@ import {
   buildItemMenu,
   buildItemMenuButtonId,
 } from '../../../../src/config/selectors';
-import { ITEM_LAYOUT_MODES, ITEM_TYPES } from '../../../../src/enums';
+import { ITEM_LAYOUT_MODES } from '../../../../src/enums';
 import { buildShortcutExtra } from '../../../../src/utils/itemExtra';
+import { ITEM_TYPES } from '../../../fixtures/enum';
 import { IMAGE_ITEM_DEFAULT } from '../../../fixtures/files';
 import { SAMPLE_ITEMS } from '../../../fixtures/items';
 import { TABLE_ITEM_RENDER_TIME } from '../../../support/constants';

cypress/e2e/item/view/viewFile.cy.js

@@ -12,7 +12,7 @@ import {
 } from '../../../fixtures/files';
 import { expectFileViewScreenLayout } from '../../../support/viewUtils';
 
-describe('Files', () => {
+describe('View Files', () => {
   describe('default server', () => {
     beforeEach(() => {
       cy.setUpApi({

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

@@ -47,7 +47,7 @@ describe('View Folder', () => {
       i18n.changeLanguage(CURRENT_USER.extra.lang);
     });
 
-    it('visit Home', () => {
+    it.only('visit Home', () => {
       cy.visit(HOME_PATH);
       cy.switchMode(ITEM_LAYOUT_MODES.GRID);
 

cypress/e2e/memberships/createItemMembership.cy.js

@@ -1,11 +1,11 @@
-import { PERMISSION_LEVELS } from '../../../src/enums';
 import { buildItemPath } from '../../../src/config/paths';
 import {
   buildShareButtonId,
   CREATE_MEMBERSHIP_FORM_ID,
   SHARE_ITEM_EMAIL_INPUT_ID,
   SHARE_ITEM_SHARE_BUTTON_ID,
 } from '../../../src/config/selectors';
+import { PERMISSION_LEVELS } from '../../fixtures/enum';
 import { SAMPLE_ITEMS } from '../../fixtures/items';
 import { MEMBERS } from '../../fixtures/members';
 

cypress/e2e/memberships/editItemMembership.cy.js

@@ -1,11 +1,11 @@
-import { PERMISSION_LEVELS } from '../../../src/enums';
 import { buildItemPath } from '../../../src/config/paths';
 import {
   buildItemMembershipRowSelector,
   buildPermissionOptionId,
   buildShareButtonId,
   ITEM_MEMBERSHIP_PERMISSION_SELECT_CLASS,
 } from '../../../src/config/selectors';
+import { PERMISSION_LEVELS } from '../../fixtures/enum';
 import { ITEMS_WITH_MEMBERSHIPS } from '../../fixtures/memberships';
 import { TABLE_MEMBERSHIP_RENDER_TIME } from '../../support/constants';
 

cypress/fixtures/apps.js

@@ -1,5 +1,5 @@
 import { APP_NAME } from './apps/apps';
-import { ITEM_TYPES } from '../../src/enums';
+import { ITEM_TYPES } from './enum';
 import { DEFAULT_FOLDER_ITEM } from './items';
 import { CURRENT_USER } from './members';
 

cypress/fixtures/documents.js

@@ -1,4 +1,4 @@
-import { ITEM_TYPES } from '../../src/enums';
+import { ITEM_TYPES } from './enum';
 import { buildDocumentExtra } from '../../src/utils/itemExtra';
 import { CURRENT_USER } from './members';
 import { DEFAULT_FOLDER_ITEM } from './items';

src/enums/itemTypes.js → cypress/fixtures/enum.js

@@ -1,7 +1,18 @@
 /**
  * @deprecated use graasp sdk
+ * this object only exists for tests
  */
-const ITEM_TYPES = {
+export const PERMISSION_LEVELS = {
+  READ: 'read',
+  WRITE: 'write',
+  ADMIN: 'admin',
+};
+
+/**
+ * @deprecated use graasp sdk
+ * this object only exists for tests
+ */
+export const ITEM_TYPES = {
   FOLDER: 'folder',
   FILE: 'file',
   S3_FILE: 's3File',
@@ -14,9 +25,3 @@ const ITEM_TYPES = {
   // but is used for the creation modal
   ZIP: 'zip',
 };
-
-Object.freeze(ITEM_TYPES);
-/**
- * @deprecated use graasp sdk
- */
-export default ITEM_TYPES;

cypress/fixtures/files.js

@@ -1,4 +1,5 @@
-import { ITEM_TYPES, MIME_TYPES } from '../../src/enums';
+import {  MIME_TYPES } from '../../src/enums';
+import { ITEM_TYPES } from './enum';
 import { buildFileExtra, buildS3FileExtra } from '../../src/utils/itemExtra';
 import { MOCK_IMAGE_URL, MOCK_PDF_URL, MOCK_VIDEO_URL } from './fileLinks';
 import { CURRENT_USER } from './members';

cypress/fixtures/invitations.js

@@ -1,6 +1,6 @@
 import { v4 } from 'uuid';
 
-import { PERMISSION_LEVELS } from '../../src/enums';
+import { PERMISSION_LEVELS } from './enum';
 import { DEFAULT_FOLDER_ITEM } from './items';
 import { MEMBERS } from './members';
 

cypress/fixtures/items.js

@@ -1,5 +1,5 @@
 import { SETTINGS } from '../../src/config/constants';
-import { ITEM_TYPES, PERMISSION_LEVELS } from '../../src/enums';
+import { ITEM_TYPES, PERMISSION_LEVELS } from './enum';
 import { buildItemLoginSchemaExtra } from '../../src/utils/itemExtra';
 import {
   DEFAULT_TAGS,

cypress/fixtures/links.js

@@ -1,4 +1,4 @@
-import { ITEM_TYPES } from '../../src/enums';
+import { ITEM_TYPES } from './enum';
 import { buildEmbeddedLinkExtra } from '../../src/utils/itemExtra';
 import { CURRENT_USER } from './members';
 

cypress/fixtures/memberships.js

@@ -1,4 +1,4 @@
-import { PERMISSION_LEVELS } from '../../src/enums';
+import { PERMISSION_LEVELS } from './enum';
 import { DEFAULT_FOLDER_ITEM } from './items';
 import { MEMBERS } from './members';
 

cypress/fixtures/navigationItems.js

@@ -1,4 +1,4 @@
-import { ITEM_TYPES } from '../../src/enums';
+import { ITEM_TYPES } from './enum';
 import { buildDocumentExtra } from '../../src/utils/itemExtra';
 import { DEFAULT_FOLDER_ITEM } from './items';
 import { CURRENT_USER } from './members';

cypress/fixtures/recycleBin.js

@@ -1,4 +1,4 @@
-import { PERMISSION_LEVELS } from '../../src/enums';
+import { PERMISSION_LEVELS } from './enum';
 import { DEFAULT_FOLDER_ITEM } from './items';
 import { CURRENT_USER } from './members';
 

cypress/fixtures/sharedItems.js

@@ -1,4 +1,4 @@
-import { PERMISSION_LEVELS } from '../../src/enums';
+import { PERMISSION_LEVELS } from './enum';
 import { DEFAULT_FOLDER_ITEM } from './items';
 import { MEMBERS } from './members';
 

cypress/fixtures/thumbnails.js

@@ -1,5 +1,5 @@
-import { PERMISSION_LEVELS } from '../../src/enums';
 import { FIXTURES_THUMBNAILS_FOLDER } from '../support/constants';
+import { PERMISSION_LEVELS } from './enum';
 import { DEFAULT_FOLDER_ITEM } from './items';
 import { MEMBERS } from './members';
 

cypress/support/createUtils.js

@@ -9,7 +9,7 @@ import {
   DASHBOARD_UPLOADER_ID,
   ZIP_DASHBOARD_UPLOADER_ID,
 } from '../../src/config/selectors';
-import { ITEM_TYPES } from '../../src/enums';
+import { ITEM_TYPES } from '../fixtures/enum';
 
 // eslint-disable-next-line import/prefer-default-export
 export const createItem = (payload, options) => {

cypress/support/editUtils.js

@@ -4,7 +4,8 @@ import {
   buildEditButtonId,
   buildSaveButtonId,
 } from '../../src/config/selectors';
-import { ITEM_LAYOUT_MODES, ITEM_TYPES } from '../../src/enums';
+import { ITEM_LAYOUT_MODES } from '../../src/enums';
+import { ITEM_TYPES } from '../fixtures/enum';
 import { CAPTION_EDIT_PAUSE, TABLE_ITEM_RENDER_TIME } from './constants';
 
 // eslint-disable-next-line import/prefer-default-export

cypress/support/server.js

@@ -17,7 +17,7 @@ import {
   SIGN_IN_PATH,
   THUMBNAIL_EXTENSION,
 } from '../../src/config/constants';
-import { PERMISSION_LEVELS } from '../../src/enums';
+import { PERMISSION_LEVELS } from '../fixtures/enum';
 import {
   getItemById,
   getParentsIdsFromPath,

package.json

@@ -8,9 +8,9 @@
     "@emotion/styled": "11.10.5",
     "@graasp/chatbox": "1.0.1",
     "@graasp/query-client": "0.1.2",
-    "@graasp/sdk": "0.2.0",
+    "@graasp/sdk": "0.3.0",
     "@graasp/translations": "1.3.0",
-    "@graasp/ui": "0.7.1",
+    "@graasp/ui": "0.8.0",
     "@mui/icons-material": "5.11.0",
     "@mui/lab": "5.0.0-alpha.117",
     "@mui/material": "5.11.6",
@@ -150,8 +150,8 @@
     "react-error-overlay": "6.0.9",
     "@mui/icons-material": "5.10.14",
     "@mui/material": "5.10.14",
-    "@graasp/sdk": "0.2.0",
-    "react-query": "3.39.2"
+    "react-query": "3.39.2",
+    "@graasp/sdk": "0.3.0"
   },
   "packageManager": "[email protected]"
 }

src/components/common/Chatbox.js

@@ -5,11 +5,11 @@ import { useContext } from 'react';
 
 import GraaspChatbox from '@graasp/chatbox';
 import { MUTATION_KEYS } from '@graasp/query-client';
+import { PermissionLevel } from '@graasp/sdk';
 import { Loader } from '@graasp/ui';
 
 import { hooks, useMutation } from '../../config/queryClient';
 import { CHATBOX_ID, CHATBOX_INPUT_BOX_ID } from '../../config/selectors';
-import { PERMISSION_LEVELS } from '../../enums';
 import { CurrentUserContext } from '../context/CurrentUserContext';
 
 const { useItemChat, useMembers, useAvatar, useItemMemberships } = hooks;
@@ -46,7 +46,7 @@ const Chatbox = ({ item }) => {
   // only show export chat when user has admin right on the item
   const isAdmin =
     itemPermissions?.find((perms) => perms.memberId === currentMember.id)
-      ?.permission === PERMISSION_LEVELS.ADMIN;
+      ?.permission === PermissionLevel.Admin;
 
   return (
     <GraaspChatbox

src/components/context/CopyItemModalContext.js → src/components/context/CopyItemModalContext.tsx

@@ -1,4 +1,3 @@
-import PropTypes from 'prop-types';
 import { validate } from 'uuid';
 
 import { createContext, useMemo, useState } from 'react';
@@ -10,13 +9,19 @@ import { useBuilderTranslation } from '../../config/i18n';
 import { useMutation } from '../../config/queryClient';
 import TreeModal from '../main/TreeModal';
 
-const CopyItemModalContext = createContext();
+const CopyItemModalContext = createContext<{
+  openModal?: (ids: string[]) => void;
+}>({});
 
-const CopyItemModalProvider = ({ children }) => {
+const CopyItemModalProvider = ({
+  children,
+}: {
+  children: JSX.Element | JSX.Element[];
+}): JSX.Element => {
   const { t: translateBuilder } = useBuilderTranslation();
   const { mutate: copyItems } = useMutation(MUTATION_KEYS.COPY_ITEMS);
-  const [open, setOpen] = useState(false);
-  const [itemIds, setItemIds] = useState(false);
+  const [open, setOpen] = useState<boolean>(false);
+  const [itemIds, setItemIds] = useState<string[] | null>(null);
 
   const openModal = (newItemIds) => {
     setOpen(true);
@@ -64,12 +69,4 @@ const CopyItemModalProvider = ({ children }) => {
   );
 };
 
-CopyItemModalProvider.propTypes = {
-  children: PropTypes.node,
-};
-
-CopyItemModalProvider.defaultProps = {
-  children: null,
-};
-
 export { CopyItemModalProvider, CopyItemModalContext };

src/components/context/CreateShortcutModalContext.tsx

@@ -40,12 +40,12 @@ const CreateShortcutModalProvider: FC<Props> = ({ children }) => {
     setItem(null);
   };
 
-  const onConfirm = ({ id: target, to }) => {
+  const onConfirm = ({ ids: [target], to }) => {
     const shortcut = {
       name: translateBuilder(BUILDER.CREATE_SHORTCUT_DEFAULT_NAME, {
         name: item.name,
       }),
-      extra: buildShortcutExtra(target[0]),
+      extra: buildShortcutExtra(target),
       type: ItemType.SHORTCUT,
       // set parent id if not root
       parentId: to !== TREE_MODAL_MY_ITEMS_ID ? to : undefined,

src/components/context/CurrentUserContext.js → src/components/context/CurrentUserContext.tsx

@@ -5,14 +5,18 @@ import { createContext, useEffect, useMemo } from 'react';
 import i18n from '../../config/i18n';
 import { hooks } from '../../config/queryClient';
 
-const CurrentUserContext = createContext();
+const CurrentUserContext = createContext(null);
+
+type Props = {
+  children: JSX.Element | JSX.Element[];
+};
 
 const { useCurrentMember } = hooks;
-const CurrentUserContextProvider = ({ children }) => {
+const CurrentUserContextProvider = ({ children }: Props): JSX.Element => {
   const query = useCurrentMember();
 
   // update language depending on user setting
-  const lang = query?.data?.extra?.lang;
+  const lang = query?.data?.extra?.lang as string;
   useEffect(() => {
     if (lang !== i18n.language) {
       i18n.changeLanguage(lang);