diff --git a/package.json b/package.json index b2f5e5abb3..0c5458f05e 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "dependencies": { - "@wireapp/api-client": "27.9.0", + "@wireapp/api-client": "27.10.0", "@wireapp/commons": "5.2.13", "@wireapp/react-ui-kit": "9.26.1", "core-js": "3.39.0", diff --git a/src/i18n/en-US.json b/src/i18n/en-US.json index 977219fbf2..2027f7c84f 100644 --- a/src/i18n/en-US.json +++ b/src/i18n/en-US.json @@ -112,7 +112,7 @@ "confirmPageHeader": "Join your team", "confirmPageSubHeader": "To ensure a secure transfer and prevent unauthorized access, please enter the password of your personal account again.", "termsPageHeader": "Join your team", - "termsPageSubHeader": "You’re about to join the team.", + "termsPageSubHeader": "You’re about to join the team managed by {{email}}.", "termsPageListHeader": "Things to know", "termsPageListItem1": "Your personal account will be transferred to a team account.", "termsPageListItem2": "This change is permanent and irrevocable.", diff --git a/src/script/module/action/TeamAction.ts b/src/script/module/action/TeamAction.ts index bd6fa65612..49ce3138a5 100644 --- a/src/script/module/action/TeamAction.ts +++ b/src/script/module/action/TeamAction.ts @@ -36,4 +36,8 @@ export class TeamAction { acceptInvitation = async (payload: {code: string; password: string}) => { return this.apiClient.api.teams.invitation.acceptInvitation(payload); }; + + getInvitationInfo = async (code: string) => { + return this.apiClient.api.teams.invitation.getInvitationFromCode(code); + }; } diff --git a/src/script/page/migration/TermsAcknowledgement.tsx b/src/script/page/migration/TermsAcknowledgement.tsx index 814c3faca3..a36f26b787 100644 --- a/src/script/page/migration/TermsAcknowledgement.tsx +++ b/src/script/page/migration/TermsAcknowledgement.tsx @@ -23,6 +23,7 @@ import { Checkbox, COLOR_V2, Link, + Loading, Logo, QUERY, QueryKeys, @@ -36,27 +37,51 @@ import { termsContentHeaderCss, termsListCss, termsListItemCss, - termsContentGrayBox, - termsContentGrayBoxContent, + termsContentWarningBox, + termsContentWarningBoxContent, termsContentBlueBox, termsContentBlueBoxContent, buttonCss, termsCheckboxLabelCss, + loginContainerCss, } from './styles'; import {ShieldIcon} from './ShieldIcon'; import {OutlinedCheckIcon} from './OutlinedCheckIcon'; -import React, {useState} from 'react'; +import React, {useEffect, useState} from 'react'; import {useNavigate} from 'react-router-dom'; import {EXTERNAL_ROUTE, ROUTE} from 'script/route'; import {useTranslation} from 'react-i18next'; import MarkupTranslation from 'script/component/MarkupTranslation'; +import {useActionContext} from 'script/module/action'; +import {getTeamInvitationCode} from './utils'; export const TermsAcknowledgement = () => { const navigate = useNavigate(); + const {teamAction} = useActionContext(); const {t} = useTranslation('migration'); const isTablet = useMatchMedia(QUERY[QueryKeys.TABLET_DOWN]); + const code = getTeamInvitationCode(); + const [loading, setLoading] = useState(true); const [isMigrationAccepted, setIsMigrationAccepted] = useState(false); const [isTermOfUseAccepted, setIsTermOfUseAccepted] = useState(false); + const [inviterEmail, setInviterEmail] = useState(''); + + useEffect(() => { + teamAction + .getInvitationInfo(code) + .then(res => { + setInviterEmail(res.created_by_email); + }) + .finally(() => setLoading(false)); + }, []); + + if (loading) { + return ( +