registration: redesign email verification page (#8554)

This commit is contained in:
Janne Mareike Koschinski 2022-05-13 16:10:22 +02:00 committed by GitHub
parent 438e66bb3f
commit 6d6cfcde11
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
16 changed files with 382 additions and 90 deletions

View file

@ -15,7 +15,7 @@ limitations under the License.
*/
import { createClient } from 'matrix-js-sdk/src/matrix';
import React, { ReactNode } from 'react';
import React, { Fragment, ReactNode } from 'react';
import { MatrixClient } from "matrix-js-sdk/src/client";
import classNames from "classnames";
import { logger } from "matrix-js-sdk/src/logger";
@ -36,6 +36,8 @@ import AuthBody from "../../views/auth/AuthBody";
import AuthHeader from "../../views/auth/AuthHeader";
import InteractiveAuth from "../InteractiveAuth";
import Spinner from "../../views/elements/Spinner";
import { AuthHeaderDisplay } from './header/AuthHeaderDisplay';
import { AuthHeaderProvider } from './header/AuthHeaderProvider';
interface IProps {
serverConfig: ValidatedServerConfig;
@ -619,28 +621,37 @@ export default class Registration extends React.Component<IProps, IState> {
{ regDoneText }
</div>;
} else {
body = <div>
<h2>{ _t('Create account') }</h2>
{ errorText }
{ serverDeadSection }
<ServerPicker
title={_t("Host account on")}
dialogTitle={_t("Decide where your account is hosted")}
serverConfig={this.props.serverConfig}
onServerConfigChange={this.state.doingUIAuth ? undefined : this.props.onServerConfigChange}
/>
{ this.renderRegisterComponent() }
{ goBack }
{ signIn }
</div>;
body = <Fragment>
<div className="mx_Register_mainContent">
<AuthHeaderDisplay
title={_t('Create account')}
serverPicker={<ServerPicker
title={_t("Host account on")}
dialogTitle={_t("Decide where your account is hosted")}
serverConfig={this.props.serverConfig}
onServerConfigChange={this.state.doingUIAuth ? undefined : this.props.onServerConfigChange}
/>}
>
{ errorText }
{ serverDeadSection }
</AuthHeaderDisplay>
{ this.renderRegisterComponent() }
</div>
<div className="mx_Register_footerActions">
{ goBack }
{ signIn }
</div>
</Fragment>;
}
return (
<AuthPage>
<AuthHeader />
<AuthBody>
{ body }
</AuthBody>
<AuthHeaderProvider>
<AuthBody flex>
{ body }
</AuthBody>
</AuthHeaderProvider>
</AuthPage>
);
}