feat: add hidden setting in setting page

graasp · Oct 4, 2024 · dc3e85c · dc3e85c
1 parent f8cad6b
commit dc3e85c
Show file tree

Hide file tree

Showing 2 changed files with 40 additions and 3 deletions.
diff --git a/cypress/e2e/item/hide/hideItem.cy.ts b/cypress/e2e/item/hide/hideItem.cy.ts
@@ -7,6 +7,7 @@ import {
 import {
   HOME_PATH,
   buildItemPath,
+  buildItemSettingsPath,
   buildItemSharePath,
 } from '../../../../src/config/paths';
 import {
@@ -138,4 +139,37 @@ describe('Hide Item', () => {
       cy.get(`#${SETTINGS_HIDE_ITEM_ID}`).should('be.disabled');
     });
   });
+
+  describe('Settings', () => {
+    it('Hide an item', () => {
+      cy.visit(buildItemSettingsPath(ITEM.id));
+
+      cy.get(`#${SETTINGS_HIDE_ITEM_ID}`).click();
+
+      cy.wait(`@postItemTag-${ItemTagType.Hidden}`).then(
+        ({ request: { url } }) => {
+          expect(url).to.contain(ItemTagType.Hidden);
+          expect(url).to.contain(ITEM.id);
+        },
+      );
+    });
+    it('Show an item', () => {
+      cy.visit(buildItemSettingsPath(HIDDEN_ITEM.id));
+
+      cy.get(`#${SETTINGS_HIDE_ITEM_ID}`).click();
+
+      cy.wait(`@deleteItemTag-${ItemTagType.Hidden}`).then(
+        ({ request: { url } }) => {
+          expect(url).to.contain(ItemTagType.Hidden);
+          expect(url).to.contain(HIDDEN_ITEM.id);
+        },
+      );
+    });
+
+    it('Cannot hide child of hidden item', () => {
+      cy.visit(buildItemSettingsPath(CHILD_HIDDEN_ITEM.id));
+
+      cy.get(`#${SETTINGS_HIDE_ITEM_ID}`).should('be.disabled');
+    });
+  });
 });
diff --git a/src/components/item/settings/ItemSettingsProperties.tsx b/src/components/item/settings/ItemSettingsProperties.tsx
@@ -1,6 +1,6 @@
 import { Stack } from '@mui/material';
 
-import { DiscriminatedItem, ItemType } from '@graasp/sdk';
+import { ItemType, PackedItem } from '@graasp/sdk';
 import { ActionButton, PinButton } from '@graasp/ui';
 
 import { BarChart3, MessageSquareOff, MessageSquareText } from 'lucide-react';
@@ -21,17 +21,18 @@ import {
 import { BUILDER } from '@/langs/constants';
 
 import DescriptionPlacementForm from '../form/DescriptionPlacementForm';
+import HideSettingCheckbox from '../sharing/HideSettingCheckbox';
 import ItemSettingCheckBoxProperty from './ItemSettingCheckBoxProperty';
 import LinkSettings from './LinkSettings';
 import FileAlignmentSetting from './file/FileAlignmentSetting';
 import FileMaxWidthSetting from './file/FileMaxWidthSetting';
 import { SettingVariant } from './settingTypes';
 
 type Props = {
-  item: DiscriminatedItem;
+  item: PackedItem;
 };
 
-type ItemSetting = DiscriminatedItem['settings'];
+type ItemSetting = PackedItem['settings'];
 
 const ItemSettingsProperties = ({ item }: Props): JSX.Element => {
   const { t: translateBuilder } = useBuilderTranslation();
@@ -142,6 +143,8 @@ const ItemSettingsProperties = ({ item }: Props): JSX.Element => {
         }
       />
 
+      <HideSettingCheckbox item={item} />
+
       <ItemSettingCheckBoxProperty
         id={SETTINGS_CHATBOX_TOGGLE_ID}
         title={translateBuilder(BUILDER.ITEM_SETTINGS_SHOW_CHAT_TITLE)}