diff --git a/cypress/fixtures/items.js b/cypress/fixtures/items.js index 1d926a0b7..a44241cea 100644 --- a/cypress/fixtures/items.js +++ b/cypress/fixtures/items.js @@ -606,3 +606,48 @@ export const PUBLISHED_ITEM = { }, ], }; + +export const ITEMS_SETTINGS = { + items: [ + { + ...DEFAULT_FOLDER_ITEM, + id: 'ecafbd2a-5688-11eb-ae93-0242ac130002', + name: 'parent public item', + path: 'ecafbd2a_5688_11eb_ae93_0242ac130002', + extra: { + image: 'someimageurl', + }, + settings: { + isPinned: true, + showChatbox: true, + }, + memberships: [ + { + itemPath: 'fdf09f5a_5688_11eb_ae93_0242ac130002', + permission: PERMISSION_LEVELS.ADMIN, + memberId: MEMBERS.ANNA.id, + }, + ], + }, + { + ...DEFAULT_FOLDER_ITEM, + id: 'ecafbd2a-5688-11eb-ae93-0242ac130003', + name: 'parent public item', + path: 'ecafbd2a_5688_11eb_ae93_0242ac130003', + extra: { + image: 'someimageurl', + }, + settings: { + isPinned: false, + showChatbox: false, + }, + memberships: [ + { + itemPath: 'fdf09f5a_5688_11eb_ae93_0242ac130003', + permission: PERMISSION_LEVELS.ADMIN, + memberId: MEMBERS.ANNA.id, + }, + ], + }, + ], +}; diff --git a/cypress/integration/item/settings/itemSettings.spec.js b/cypress/integration/item/settings/itemSettings.spec.js new file mode 100644 index 000000000..d57fe09b3 --- /dev/null +++ b/cypress/integration/item/settings/itemSettings.spec.js @@ -0,0 +1,61 @@ +import { buildItemPath } from '../../../../src/config/paths'; +import { + ITEM_SETTINGS_BUTTON_CLASS, + SETTINGS_CHATBOX_TOGGLE, + SETTINGS_PINNED_TOGGLE, +} from '../../../../src/config/selectors'; +import { ITEMS_SETTINGS } from '../../../fixtures/items'; + +describe('Item Settings', () => { + beforeEach(() => { + cy.setUpApi(ITEMS_SETTINGS); + }); + + describe('Chatbox Settings', () => { + it('Disabling Chatbox', () => { + cy.visit(buildItemPath(ITEMS_SETTINGS.items[0].id)); + cy.get(`.${ITEM_SETTINGS_BUTTON_CLASS}`).click(); + + cy.get(`#${SETTINGS_CHATBOX_TOGGLE}`).should('be.checked'); + + cy.get(`#${SETTINGS_CHATBOX_TOGGLE}`).click(); + + cy.get(`#${SETTINGS_CHATBOX_TOGGLE}`).should('not.be.checked'); + }); + + it('Enabling Chatbox', () => { + cy.visit(buildItemPath(ITEMS_SETTINGS.items[1].id)); + cy.get(`.${ITEM_SETTINGS_BUTTON_CLASS}`).click(); + + cy.get(`#${SETTINGS_CHATBOX_TOGGLE}`).should('not.be.checked'); + + cy.get(`#${SETTINGS_CHATBOX_TOGGLE}`).click(); + + cy.get(`#${SETTINGS_CHATBOX_TOGGLE}`).should('be.checked'); + }); + }); + + describe('Pinned Settings', () => { + it('Unpin Items', () => { + cy.visit(buildItemPath(ITEMS_SETTINGS.items[0].id)); + cy.get(`.${ITEM_SETTINGS_BUTTON_CLASS}`).click(); + + cy.get(`#${SETTINGS_PINNED_TOGGLE}`).should('be.checked'); + + cy.get(`#${SETTINGS_PINNED_TOGGLE}`).click(); + + cy.get(`#${SETTINGS_PINNED_TOGGLE}`).should('not.be.checked'); + }); + + it('Pin Item', () => { + cy.visit(buildItemPath(ITEMS_SETTINGS.items[1].id)); + cy.get(`.${ITEM_SETTINGS_BUTTON_CLASS}`).click(); + + cy.get(`#${SETTINGS_PINNED_TOGGLE}`).should('not.be.checked'); + + cy.get(`#${SETTINGS_PINNED_TOGGLE}`).click(); + + cy.get(`#${SETTINGS_PINNED_TOGGLE}`).should('be.checked'); + }); + }); +}); diff --git a/src/components/item/settings/ItemSettings.js b/src/components/item/settings/ItemSettings.js index 5e96b85da..bd408387b 100644 --- a/src/components/item/settings/ItemSettings.js +++ b/src/components/item/settings/ItemSettings.js @@ -11,6 +11,10 @@ import { } from '@material-ui/core'; import { MUTATION_KEYS } from '@graasp/query-client'; import { useMutation } from '../../../config/queryClient'; +import { + SETTINGS_CHATBOX_TOGGLE, + SETTINGS_PINNED_TOGGLE, +} from '../../../config/selectors'; const useStyles = makeStyles((theme) => ({ title: { @@ -63,25 +67,23 @@ const ItemSettings = ({ item }) => { - ) + } /> - ) + } /> diff --git a/src/config/selectors.js b/src/config/selectors.js index 234b85fb6..d9545f8d6 100644 --- a/src/config/selectors.js +++ b/src/config/selectors.js @@ -149,3 +149,6 @@ export const SHARE_ITEM_PSEUDONYMIZED_SCHEMA_ID = 'shareItemPseudonymizedSchema'; export const ITEM_RECYCLE_BUTTON_CLASS = 'itemRecycleButton'; export const buildItemsTableId = (id) => `itemsTable-${id}`; + +export const SETTINGS_PINNED_TOGGLE = 'pinned'; +export const SETTINGS_CHATBOX_TOGGLE = 'chatbox';