diff --git a/cypress/e2e/island.cy.ts b/cypress/e2e/island.cy.ts
index de613164..7a18f263 100644
--- a/cypress/e2e/island.cy.ts
+++ b/cypress/e2e/island.cy.ts
@@ -1,15 +1,23 @@
-import { PackedFolderItemFactory } from '@graasp/sdk';
+import {
+ DocumentItemExtra,
+ PackedFolderItemFactory,
+ getDocumentExtra,
+} from '@graasp/sdk';
import { buildContentPagePath } from '@/config/paths';
import {
ITEM_CHATBOX_BUTTON_ID,
ITEM_MAP_BUTTON_ID,
+ NAVIGATION_ISLAND_CY,
+ buildDataCyWrapper,
+ buildDocumentId,
buildTreeItemClass,
} from '@/config/selectors';
import {
DOCUMENT_WITHOUT_CHAT_BOX,
DOCUMENT_WITH_CHAT_BOX,
+ getFolderWithShortcutFixture,
} from '../fixtures/items';
describe('Island', () => {
@@ -111,4 +119,19 @@ describe('Island', () => {
.should('be.disabled');
});
});
+
+ it('Shows only one island when folder contains shortcut', () => {
+ const items = getFolderWithShortcutFixture();
+ const parent = items[0];
+ const documentTarget = items[1];
+ cy.setUpApi({ items });
+ cy.visit(buildContentPagePath({ rootId: parent.id, itemId: parent.id }));
+ cy.get(`#${buildDocumentId(documentTarget.id)}`).should(
+ 'contain',
+ getDocumentExtra(documentTarget.extra as DocumentItemExtra).content,
+ );
+ cy.get(buildDataCyWrapper(NAVIGATION_ISLAND_CY))
+ .should('be.visible')
+ .and('have.length', 1);
+ });
});
diff --git a/cypress/fixtures/items.ts b/cypress/fixtures/items.ts
index 1381b15f..3c77612f 100644
--- a/cypress/fixtures/items.ts
+++ b/cypress/fixtures/items.ts
@@ -1,4 +1,11 @@
-import { ItemType, PermissionLevel, buildPathFromIds } from '@graasp/sdk';
+import {
+ DocumentItemFactory,
+ FolderItemFactory,
+ ItemType,
+ PermissionLevel,
+ ShortcutItemFactory,
+ buildPathFromIds,
+} from '@graasp/sdk';
import { DEFAULT_LANG } from '@graasp/translations';
import { v4 } from 'uuid';
@@ -364,6 +371,30 @@ export const FOLDER_WITH_HIDDEN_ITEMS: { items: MockItem[] } = {
],
};
+export const getFolderWithShortcutFixture = (): MockItem[] => {
+ const parent = FolderItemFactory({ name: 'Lesson', creator: CURRENT_USER });
+ const child = FolderItemFactory({
+ parentItem: parent,
+ name: 'Part 1',
+ creator: CURRENT_USER,
+ });
+ const documentItem = DocumentItemFactory({
+ extra: { document: { content: 'I am a document' } },
+ creator: CURRENT_USER,
+ });
+ return [
+ parent,
+ documentItem,
+ child,
+ DocumentItemFactory({ parentItem: parent, creator: CURRENT_USER }),
+ ShortcutItemFactory({
+ parentItem: parent,
+ creator: CURRENT_USER,
+ extra: { shortcut: { target: documentItem.id } },
+ }),
+ ];
+};
+
export const FOLDER_WITH_COLLAPSIBLE_SHORTCUT_ITEMS: { items: MockItem[] } = {
items: [
// original for the shortcut
diff --git a/src/config/selectors.ts b/src/config/selectors.ts
index 528d874b..85e11909 100644
--- a/src/config/selectors.ts
+++ b/src/config/selectors.ts
@@ -37,6 +37,9 @@ export const buildTreeItemClass = (id: string): string => `buildTreeItem-${id}`;
export const buildTreeShortcutItemClass = (id: string): string =>
`buildTreeShortcutItem-${id}`;
+export const buildDataCyWrapper = (dataCy: string): string =>
+ `[data-cy="${dataCy}"]`;
+
export const HEADER_MEMBER_MENU_BUTTON_ID = 'headerMemberMenuButton';
export const HEADER_MEMBER_MENU_SEE_PROFILE_BUTTON_ID =
'headerMemberMenuSeeProfileButton';
@@ -65,6 +68,8 @@ export const APP_NAVIGATION_PLATFORM_SWITCH_BUTTON_IDS = {
[Platform.Analytics]: 'appNavigationPlatformSwitchButtonAnalytics',
};
+export const NAVIGATION_ISLAND_CY = 'navigationIsland';
+
export const TREE_NODE_GROUP_CLASS = 'tree-node-group';
export const BACK_TO_SHORTCUT_ID = 'backToButtonShortcut';
export const ITEM_MAP_BUTTON_ID = 'itemMapButton';
diff --git a/src/modules/item/Item.tsx b/src/modules/item/Item.tsx
index f2718652..8d7afcda 100644
--- a/src/modules/item/Item.tsx
+++ b/src/modules/item/Item.tsx
@@ -513,7 +513,10 @@ const Item = ({
return (
<>
-
+ {
+ // only render the island when the item is not a children
+ isChildren ? false :
+ }
>
);
}
diff --git a/src/modules/navigationIsland/NavigationIsland.tsx b/src/modules/navigationIsland/NavigationIsland.tsx
index ae2770dc..a5299a61 100644
--- a/src/modules/navigationIsland/NavigationIsland.tsx
+++ b/src/modules/navigationIsland/NavigationIsland.tsx
@@ -1,5 +1,7 @@
import { Box, Stack } from '@mui/material';
+import { NAVIGATION_ISLAND_CY } from '@/config/selectors';
+
import useChatButton from './ChatButton';
// import useGeolocationButton from './GeolocationButton';
import usePinnedItemsButton from './PinnedItemsButton';
@@ -24,6 +26,7 @@ const NavigationIslandBox = (): JSX.Element | false => {
return (