diff --git a/cypress/e2e/SignUp.cy.ts b/cypress/e2e/SignUp.cy.ts index 7fe2d433..df74f22f 100644 --- a/cypress/e2e/SignUp.cy.ts +++ b/cypress/e2e/SignUp.cy.ts @@ -9,7 +9,7 @@ import { SUCCESS_CONTENT_ID, } from '../../src/config/selectors'; import { MEMBERS } from '../fixtures/members'; -import { checkInvitationFields } from './util'; +import { checkInvitationFields, fillSignUpLayout } from './util'; describe('SignUp', () => { describe('Must Accept All Terms To Sign Up', () => { @@ -26,6 +26,9 @@ describe('SignUp', () => { cy.get(`#${SIGN_UP_BUTTON_ID}`).should('be.disabled'); }); it('Sign Up Is Available When Accepting All Terms', () => { + fillSignUpLayout({ name: 'name', email: 'email' }); + cy.get(`#${SIGN_UP_BUTTON_ID}`).should('be.disabled'); + cy.agreeWithAllTerms(); cy.get(`#${SIGN_UP_BUTTON_ID}`).should('not.be.disabled'); }); diff --git a/src/components/BrandingLogo.tsx b/src/components/BrandingLogo.tsx new file mode 100644 index 00000000..63ac585f --- /dev/null +++ b/src/components/BrandingLogo.tsx @@ -0,0 +1,18 @@ +import { GraaspLogo } from '@graasp/ui'; + +import { Stack, Typography, useTheme } from '@mui/material'; + +export const BrandingLogo = () => { + const theme = useTheme(); + + return ( +
+ + + + Graasp + + +
+ ); +}; diff --git a/src/components/LeftContentContainer.tsx b/src/components/LeftContentContainer.tsx index 21388a63..ae390d8c 100644 --- a/src/components/LeftContentContainer.tsx +++ b/src/components/LeftContentContainer.tsx @@ -1,67 +1,108 @@ -import { Stack } from '@mui/material'; +import { + AccentColors, + AnalyticsIcon, + BuildIcon, + LibraryIcon, + PlayIcon, +} from '@graasp/ui'; +import { Box, Stack } from '@mui/material'; + +import { BACKGROUND_PATTERN } from '../config/constants'; +import { useAuthTranslation } from '../config/i18n'; +import { AUTH } from '../langs/constants'; import APIChecker from './APIChecker'; +import { BrandingLogo } from './BrandingLogo'; import Footer from './Footer'; -import { AnalyticsContent } from './leftContent/AnalyticsContent'; -import { BuilderContent } from './leftContent/BuilderContent'; -import { LibraryContent } from './leftContent/LibraryContent'; -import { PlayerContent } from './leftContent/PlayerContent'; +import { PlatformContent } from './leftContent/PlatformContent'; type Props = { children: JSX.Element | JSX.Element[]; }; -const PLATFORMS = [ - { content: }, - { content: }, - { content: }, - { content: }, -]; - const LeftContentContainer = ({ children }: Props): JSX.Element => { - const platform = PLATFORMS[Math.floor(Math.random() * PLATFORMS.length)]; + const { t } = useAuthTranslation(); return ( - - + - - {platform.content} - + + + + + + + + + + + - {children} + + {children} + +