diff --git a/.github/workflows/deploy-dev.yml b/.github/workflows/deploy-dev.yml index 43127c4fe..08288159f 100644 --- a/.github/workflows/deploy-dev.yml +++ b/.github/workflows/deploy-dev.yml @@ -40,6 +40,7 @@ jobs: # VITE_GA_MEASUREMENT_ID: ${{ secrets.VITE_GA_MEASUREMENT_ID }} VITE_SHOW_NOTIFICATIONS: ${{ vars.VITE_SHOW_NOTIFICATIONS }} VITE_GRAASP_REDIRECTION_HOST: ${{ vars.VITE_GRAASP_REDIRECTION_HOST }} + VITE_UMAMI_WEBSITE_ID: ${{ vars.VITE_UMAMI_WEBSITE_ID }} run: yarn build shell: bash diff --git a/cypress/e2e/authentication.cy.ts b/cypress/e2e/authentication.cy.ts index e2d2ac1fe..2feb4ce5a 100644 --- a/cypress/e2e/authentication.cy.ts +++ b/cypress/e2e/authentication.cy.ts @@ -2,15 +2,11 @@ import { CookieKeys, PackedFolderItemFactory } from '@graasp/sdk'; import { HOME_PATH, - ITEMS_PATH, REDIRECT_PATH, buildItemPath, } from '../../src/config/paths'; import { HEADER_APP_BAR_ID, ITEM_MAIN_CLASS } from '../../src/config/selectors'; -import { - REDIRECTION_TIME, - REQUEST_FAILURE_LOADING_TIME, -} from '../support/constants'; +import { REQUEST_FAILURE_LOADING_TIME } from '../support/constants'; import { SIGN_IN_PATH } from '../support/paths'; describe('Authentication', () => { @@ -46,29 +42,25 @@ describe('Authentication', () => { }); }); - describe('Redirect to URL in local storage', () => { + describe('Redirect to URL saved in cookie', () => { it('Home', () => { cy.setCookie(CookieKeys.RedirectUrl, HOME_PATH); cy.visit(REDIRECT_PATH); - cy.url({ - timeout: REDIRECTION_TIME, - }).should('include', HOME_PATH); - }); - - it('Items', () => { - cy.setCookie(CookieKeys.RedirectUrl, ITEMS_PATH); - cy.visit(REDIRECT_PATH); - cy.url({ - timeout: REDIRECTION_TIME, - }).should('include', ITEMS_PATH); + cy.url().should( + 'equal', + new URL(HOME_PATH, Cypress.config().baseUrl).toString(), + ); }); it('Item', () => { cy.setCookie(CookieKeys.RedirectUrl, buildItemPath(ENV.items[0].id)); cy.visit(REDIRECT_PATH); - cy.url({ timeout: REDIRECTION_TIME }).should( - 'include', - buildItemPath(ENV.items[0].id), + cy.url().should( + 'equal', + new URL( + buildItemPath(ENV.items[0].id), + Cypress.config().baseUrl, + ).toString(), ); }); }); diff --git a/cypress/e2e/header.cy.ts b/cypress/e2e/header.cy.ts index 0c16aca0d..5499d1a94 100644 --- a/cypress/e2e/header.cy.ts +++ b/cypress/e2e/header.cy.ts @@ -13,7 +13,7 @@ describe('Header', () => { cy.visit(HOME_PATH); // check navigation and display and interface doesn't crash // todo: this is less robust than using the Platform contant from ui, but it was making cypress compile ui which is unnecessary. - cy.get(`#${APP_NAVIGATION_PLATFORM_SWITCH_BUTTON_IDS.Builder}`).click(); + cy.get(`#${APP_NAVIGATION_PLATFORM_SWITCH_BUTTON_IDS.builder}`).click(); cy.get(`#${APP_NAVIGATION_PLATFORM_SWITCH_ID}`).should('exist'); }); diff --git a/cypress/e2e/item/chatbox/chatbox.cy.ts b/cypress/e2e/item/chatbox/chatbox.cy.ts index 666a1157e..9526cb638 100644 --- a/cypress/e2e/item/chatbox/chatbox.cy.ts +++ b/cypress/e2e/item/chatbox/chatbox.cy.ts @@ -11,11 +11,11 @@ import { } from '../../../../src/config/selectors'; import { ITEM_WITH_CHATBOX_MESSAGES } from '../../../fixtures/chatbox'; import { CURRENT_USER, MEMBERS } from '../../../fixtures/members'; -import { CHATBOX_LOADING_TIME } from '../../../support/constants'; +import { CHATBOX_TIMEOUT } from '../../../support/constants'; const openChatbox = () => { cy.get(`#${ITEM_CHATBOX_BUTTON_ID}`).click(); - cy.wait('@getItemChat', { timeout: CHATBOX_LOADING_TIME }); + cy.wait('@getItemChat', { timeout: CHATBOX_TIMEOUT }); }; describe('Chatbox Scenarios', () => { diff --git a/cypress/e2e/memberships/deleteItemMembership.cy.ts b/cypress/e2e/memberships/deleteItemMembership.cy.ts index adb80fe69..dcf1e256e 100644 --- a/cypress/e2e/memberships/deleteItemMembership.cy.ts +++ b/cypress/e2e/memberships/deleteItemMembership.cy.ts @@ -15,7 +15,6 @@ import { } from '../../../src/config/selectors'; import { CURRENT_USER, MEMBERS } from '../../fixtures/members'; import { ITEMS_WITH_MEMBERSHIPS } from '../../fixtures/memberships'; -import { TABLE_MEMBERSHIP_RENDER_TIME } from '../../support/constants'; import { ItemForTest } from '../../support/types'; const deleteItemMembership = ({ @@ -26,7 +25,6 @@ const deleteItemMembership = ({ itemId: string; }) => { cy.get(`#${buildShareButtonId(itemId)}`).click(); - cy.wait(TABLE_MEMBERSHIP_RENDER_TIME); cy.get(`#${buildItemMembershipRowDeleteButtonId(id)}`).click(); cy.get(`#${CONFIRM_MEMBERSHIP_DELETE_BUTTON_ID}`).click(); }; diff --git a/cypress/support/constants.ts b/cypress/support/constants.ts index 5e424d29e..8c3645a1f 100644 --- a/cypress/support/constants.ts +++ b/cypress/support/constants.ts @@ -1,22 +1,12 @@ export const CREATE_ITEM_PAUSE = 1000; export const EDIT_ITEM_PAUSE = 1000; export const ITEM_LOGIN_PAUSE = 1000; -export const NAVIGATE_PAUSE = 1000; export const NAVIGATION_LOAD_PAUSE = 1500; -export const PAGE_LOAD_WAITING_PAUSE = 3000; export const REQUEST_FAILURE_LOADING_TIME = 1500; export const FILE_LOADING_PAUSE = 2000; -export const TREE_VIEW_PAUSE = 1500; -export const WEBSOCKETS_DELAY_TIME = 1500; export const EDIT_TAG_REQUEST_TIMEOUT = 10000; -export const REDIRECTION_CONTENT = 'hello'; -export const REQUEST_FAILURE_TIME = 2500; - -export const REDIRECTION_TIME = 500; export const CAPTION_EDIT_PAUSE = 2000; -export const TABLE_MEMBERSHIP_RENDER_TIME = 1000; -export const FIXTURES_THUMBNAILS_FOLDER = './thumbnails'; -export const CHATBOX_LOADING_TIME = 5000; +export const CHATBOX_TIMEOUT = 5000; diff --git a/index.html b/index.html index 3a54b7965..abc74eb80 100644 --- a/index.html +++ b/index.html @@ -18,6 +18,18 @@ rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200..1000;1,200..1000&display=swap" /> + + + + + Graasp Builder diff --git a/package.json b/package.json index 1396bd61c..e0220c385 100644 --- a/package.json +++ b/package.json @@ -24,7 +24,7 @@ "@graasp/sdk": "4.31.0", "@graasp/stylis-plugin-rtl": "2.2.0", "@graasp/translations": "1.39.0", - "@graasp/ui": "5.2.2", + "@graasp/ui": "5.3.0", "@mui/icons-material": "5.16.7", "@mui/lab": "5.0.0-alpha.173", "@mui/material": "5.16.7", diff --git a/src/components/App.tsx b/src/components/App.tsx index 07ed0c3db..5ecd16c94 100644 --- a/src/components/App.tsx +++ b/src/components/App.tsx @@ -27,7 +27,7 @@ import { buildItemPath, } from '../config/paths'; import { hooks, mutations } from '../config/queryClient'; -import Main from './main/Main'; +import { Main } from './main/Main'; import Redirect from './main/Redirect'; import BookmarkedItemsScreen from './pages/BookmarkedItemsScreen'; import MapItemsScreen from './pages/MapItemsScreen'; diff --git a/src/components/common/SelectTypes.tsx b/src/components/common/SelectTypes.tsx index 0eb0b1aeb..7b94dd2fe 100644 --- a/src/components/common/SelectTypes.tsx +++ b/src/components/common/SelectTypes.tsx @@ -68,7 +68,12 @@ export const SelectTypes = (): JSX.Element => { multiple value={itemTypes} onChange={handleChange} - input={} + input={ + + } renderValue={renderValues} MenuProps={MenuProps} sx={{ diff --git a/src/components/common/UserSwitchWrapper.tsx b/src/components/common/UserSwitchWrapper.tsx index 50df7c1e5..2e482aa6b 100644 --- a/src/components/common/UserSwitchWrapper.tsx +++ b/src/components/common/UserSwitchWrapper.tsx @@ -49,6 +49,7 @@ const UserSwitchWrapper = ({ ButtonContent }: Props): JSX.Element => { seeProfileButtonId={HEADER_MEMBER_MENU_SEE_PROFILE_BUTTON_ID} buildMemberMenuItemId={buildMemberMenuItemId} avatar={} + dataUmamiEvent="header-avatar" /> ); }; diff --git a/src/components/item/ItemSearch.tsx b/src/components/item/ItemSearch.tsx index 45ac11118..6a90b9ff9 100644 --- a/src/components/item/ItemSearch.tsx +++ b/src/components/item/ItemSearch.tsx @@ -51,6 +51,7 @@ export const useItemSearch = ({ inputBaseId={ITEM_SEARCH_INPUT_ID} placeholder={translateBuilder(BUILDER.ITEM_SEARCH_PLACEHOLDER)} size="small" + dataUmamiEvent="item-search" /> ); return { text: searchText, input: itemSearchInput }; diff --git a/src/components/main/Main.tsx b/src/components/main/Main.tsx index 1e54ea6f0..6c227102b 100644 --- a/src/components/main/Main.tsx +++ b/src/components/main/Main.tsx @@ -37,7 +37,13 @@ const StyledLink = styled(Link)(() => ({ alignItems: 'center', })); const LinkComponent = ({ children }: { children: ReactNode }) => ( - {children} + + {children} + ); // small converter for HOST_MAP into a usePlatformNavigation mapper @@ -47,9 +53,9 @@ export const platformsHostsMap = defaultHostsMapper({ [Platform.Analytics]: HOST_MAP.analytics, }); -type Props = { children: JSX.Element | (JSX.Element & string) }; +type Props = { children: ReactNode }; -const Main = ({ children }: Props): JSX.Element => { +export const Main = ({ children }: Props): JSX.Element => { const { t } = useBuilderTranslation(); const theme = useTheme(); const { isMobile } = useMobileView(); diff --git a/src/components/main/MainMenu.tsx b/src/components/main/MainMenu.tsx index 743e97f77..ec7382dfc 100644 --- a/src/components/main/MainMenu.tsx +++ b/src/components/main/MainMenu.tsx @@ -36,7 +36,11 @@ const ResourceLinks = () => { const { t } = useBuilderTranslation(); return ( - + @@ -64,18 +68,21 @@ const MainMenu = (): JSX.Element | null => { member.type === AccountType.Individual ? ( <> goTo(BOOKMARKED_ITEMS_PATH)} selected={pathname === BOOKMARKED_ITEMS_PATH} text={t(BUILDER.BOOKMARKED_ITEMS_TITLE)} icon={} /> goTo(PUBLISHED_ITEMS_PATH)} selected={pathname === PUBLISHED_ITEMS_PATH} text={t(BUILDER.NAVIGATION_PUBLISHED_ITEMS_TITLE)} icon={} /> goTo(RECYCLE_BIN_PATH)} selected={pathname === RECYCLE_BIN_PATH} text={t(BUILDER.RECYCLE_BIN_TITLE)} @@ -89,6 +96,7 @@ const MainMenu = (): JSX.Element | null => { goTo(HOME_PATH)} selected={pathname === HOME_PATH} icon={} diff --git a/src/components/main/NewItemButton.tsx b/src/components/main/NewItemButton.tsx index 88b39e9db..cc69a600b 100644 --- a/src/components/main/NewItemButton.tsx +++ b/src/components/main/NewItemButton.tsx @@ -45,6 +45,7 @@ const NewItemButton = ({ background: theme.palette.primary.main, '&:hover': { background: 'grey' }, }} + data-umami-event="new-item-icon-button" > @@ -56,6 +57,7 @@ const NewItemButton = ({ aria-label="add" startIcon={} size={size} + data-umami-event="new-item-button" > {translateBuilder(BUILDER.NEW_ITEM_BUTTON)} diff --git a/src/components/table/ShowOnlyMeButton.tsx b/src/components/table/ShowOnlyMeButton.tsx index 21c78181b..32f7b84a8 100644 --- a/src/components/table/ShowOnlyMeButton.tsx +++ b/src/components/table/ShowOnlyMeButton.tsx @@ -23,6 +23,9 @@ const ShowOnlyMeButton = ({ sx={{ fontSize: '1rem', maxWidth: 'max-content' }} id={ACCESSIBLE_ITEMS_ONLY_ME_ID} label={translateBuilder(BUILDER.HOME_SHOW_ONLY_CREATED_BY_ME)} + // We need to have a button component so the onclick triggers an event in umami + component="button" + data-umami-event="filter-created-by-me" /> ); }; diff --git a/src/config/selectors.ts b/src/config/selectors.ts index a495101bd..341442427 100644 --- a/src/config/selectors.ts +++ b/src/config/selectors.ts @@ -217,10 +217,10 @@ export const ITEM_PUBLISH_SECTION_TITLE_ID = 'itemPublishSectionTitle'; export const APP_NAVIGATION_PLATFORM_SWITCH_ID = 'appNavigationPlatformSwitch'; // cannot use graasp ui because it slows down a lot cypress export const APP_NAVIGATION_PLATFORM_SWITCH_BUTTON_IDS = { - Builder: 'appNavigationPlatformSwitchButtonBuilder', - Player: 'appNavigationPlatformSwitchButtonPlayer', - Library: 'appNavigationPlatformSwitchButtonLibrary', - Analytics: 'appNavigationPlatformSwitchButtonAnalytics', + builder: 'appNavigationPlatformSwitchButtonBuilder', + player: 'appNavigationPlatformSwitchButtonPlayer', + library: 'appNavigationPlatformSwitchButtonLibrary', + analytics: 'appNavigationPlatformSwitchButtonAnalytics', }; export const buildItemPublicationButton = (status: PublicationStatus): string => diff --git a/yarn.lock b/yarn.lock index 3552acf27..3061a97a3 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1688,9 +1688,9 @@ __metadata: languageName: node linkType: hard -"@graasp/ui@npm:5.2.2": - version: 5.2.2 - resolution: "@graasp/ui@npm:5.2.2" +"@graasp/ui@npm:5.3.0": + version: 5.3.0 + resolution: "@graasp/ui@npm:5.3.0" dependencies: http-status-codes: "npm:2.3.0" interweave: "npm:13.1.0" @@ -1719,7 +1719,7 @@ __metadata: react-i18next: ^13.0.0 || ^14.0.0 || ^15.0.0 react-router-dom: ^6.11.0 stylis: ^4.1.3 - checksum: 10/717d2a0d282dfc4fa7de61f6b132765bdf933870d13ff0570caa713c40281ca96690af7566f41ceff94c7c49a7f22489b0ddddd83329bb5537a5f0f46542af1a + checksum: 10/7edfe0f82ef71c718785f98de4be78c2dae712d5681100b5ff8dd9f83d73980dfb0940ab020c86f9231757bd058a926094d5e72934fa57612bcd3f3690f037f4 languageName: node linkType: hard @@ -6476,7 +6476,7 @@ __metadata: "@graasp/sdk": "npm:4.31.0" "@graasp/stylis-plugin-rtl": "npm:2.2.0" "@graasp/translations": "npm:1.39.0" - "@graasp/ui": "npm:5.2.2" + "@graasp/ui": "npm:5.3.0" "@mui/icons-material": "npm:5.16.7" "@mui/lab": "npm:5.0.0-alpha.173" "@mui/material": "npm:5.16.7"