2016-08-03 13:34:13 +03:00
|
|
|
/*
|
|
|
|
Copyright 2016 OpenMarket Ltd
|
2020-04-07 00:42:06 +03:00
|
|
|
Copyright 2019, 2020 The Matrix.org Foundation C.I.C.
|
2016-08-03 13:34:13 +03:00
|
|
|
|
|
|
|
Licensed under the Apache License, Version 2.0 (the "License");
|
|
|
|
you may not use this file except in compliance with the License.
|
|
|
|
You may obtain a copy of the License at
|
|
|
|
|
|
|
|
http://www.apache.org/licenses/LICENSE-2.0
|
|
|
|
|
|
|
|
Unless required by applicable law or agreed to in writing, software
|
|
|
|
distributed under the License is distributed on an "AS IS" BASIS,
|
|
|
|
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
|
|
See the License for the specific language governing permissions and
|
|
|
|
limitations under the License.
|
|
|
|
*/
|
|
|
|
|
|
|
|
import React from 'react';
|
|
|
|
|
2019-12-20 04:19:56 +03:00
|
|
|
import * as sdk from '../../../index';
|
2017-07-27 19:19:18 +03:00
|
|
|
import Analytics from '../../../Analytics';
|
2019-12-21 00:13:46 +03:00
|
|
|
import {MatrixClientPeg} from '../../../MatrixClientPeg';
|
2017-03-13 17:10:14 +03:00
|
|
|
import * as Lifecycle from '../../../Lifecycle';
|
2017-05-30 17:09:57 +03:00
|
|
|
import { _t } from '../../../languageHandler';
|
2020-04-07 00:42:06 +03:00
|
|
|
import InteractiveAuth, {ERROR_USER_CANCELLED} from "../../structures/InteractiveAuth";
|
|
|
|
import {DEFAULT_PHASE, PasswordAuthEntry, SSOAuthEntry} from "../auth/InteractiveAuthEntryComponents";
|
2020-05-29 00:33:00 +03:00
|
|
|
import StyledCheckbox from "../elements/StyledCheckbox";
|
2021-03-09 05:59:41 +03:00
|
|
|
import {replaceableComponent} from "../../../utils/replaceableComponent";
|
2020-04-07 00:42:06 +03:00
|
|
|
|
2021-06-14 23:53:44 +03:00
|
|
|
interface IProps {
|
|
|
|
onFinished: (success: boolean) => void;
|
|
|
|
}
|
|
|
|
|
|
|
|
interface IState {
|
|
|
|
shouldErase: boolean;
|
|
|
|
errStr: string;
|
|
|
|
authData: any; // for UIA
|
|
|
|
authEnabled: boolean; // see usages for information
|
|
|
|
|
|
|
|
// A few strings that are passed to InteractiveAuth for design or are displayed
|
|
|
|
// next to the InteractiveAuth component.
|
|
|
|
bodyText: string;
|
|
|
|
continueText: string;
|
|
|
|
continueKind: string;
|
|
|
|
}
|
|
|
|
|
2021-03-09 05:59:41 +03:00
|
|
|
@replaceableComponent("views.dialogs.DeactivateAccountDialog")
|
2021-06-14 23:53:44 +03:00
|
|
|
export default class DeactivateAccountDialog extends React.Component<IProps, IState> {
|
2019-12-17 20:26:12 +03:00
|
|
|
constructor(props) {
|
|
|
|
super(props);
|
2016-08-03 13:34:13 +03:00
|
|
|
|
|
|
|
this.state = {
|
2018-10-30 01:57:33 +03:00
|
|
|
shouldErase: false,
|
2016-08-03 13:34:13 +03:00
|
|
|
errStr: null,
|
2020-04-07 00:42:06 +03:00
|
|
|
authData: null, // for UIA
|
2020-05-13 02:17:17 +03:00
|
|
|
authEnabled: true, // see usages for information
|
2020-04-07 00:42:06 +03:00
|
|
|
|
|
|
|
// A few strings that are passed to InteractiveAuth for design or are displayed
|
|
|
|
// next to the InteractiveAuth component.
|
|
|
|
bodyText: null,
|
|
|
|
continueText: null,
|
|
|
|
continueKind: null,
|
2016-08-03 13:34:13 +03:00
|
|
|
};
|
|
|
|
|
2021-06-14 23:53:44 +03:00
|
|
|
this.initAuth(/* shouldErase= */false);
|
2016-08-03 13:34:13 +03:00
|
|
|
}
|
|
|
|
|
2021-06-14 23:53:44 +03:00
|
|
|
private onStagePhaseChange = (stage: string, phase: string): void => {
|
2020-04-22 23:37:52 +03:00
|
|
|
const dialogAesthetics = {
|
|
|
|
[SSOAuthEntry.PHASE_PREAUTH]: {
|
|
|
|
body: _t("Confirm your account deactivation by using Single Sign On to prove your identity."),
|
|
|
|
continueText: _t("Single Sign On"),
|
|
|
|
continueKind: "danger",
|
|
|
|
},
|
|
|
|
[SSOAuthEntry.PHASE_POSTAUTH]: {
|
|
|
|
body: _t("Are you sure you want to deactivate your account? This is irreversible."),
|
|
|
|
continueText: _t("Confirm account deactivation"),
|
|
|
|
continueKind: "danger",
|
|
|
|
},
|
|
|
|
};
|
|
|
|
|
|
|
|
// This is the same as aestheticsForStagePhases in InteractiveAuthDialog minus the `title`
|
|
|
|
const DEACTIVATE_AESTHETICS = {
|
|
|
|
[SSOAuthEntry.LOGIN_TYPE]: dialogAesthetics,
|
|
|
|
[SSOAuthEntry.UNSTABLE_LOGIN_TYPE]: dialogAesthetics,
|
|
|
|
[PasswordAuthEntry.LOGIN_TYPE]: {
|
|
|
|
[DEFAULT_PHASE]: {
|
|
|
|
body: _t("To continue, please enter your password:"),
|
|
|
|
},
|
|
|
|
},
|
|
|
|
};
|
|
|
|
|
2020-04-07 00:42:06 +03:00
|
|
|
const aesthetics = DEACTIVATE_AESTHETICS[stage];
|
|
|
|
let bodyText = null;
|
|
|
|
let continueText = null;
|
|
|
|
let continueKind = null;
|
|
|
|
if (aesthetics) {
|
|
|
|
const phaseAesthetics = aesthetics[phase];
|
|
|
|
if (phaseAesthetics && phaseAesthetics.body) bodyText = phaseAesthetics.body;
|
|
|
|
if (phaseAesthetics && phaseAesthetics.continueText) continueText = phaseAesthetics.continueText;
|
|
|
|
if (phaseAesthetics && phaseAesthetics.continueKind) continueKind = phaseAesthetics.continueKind;
|
|
|
|
}
|
|
|
|
this.setState({bodyText, continueText, continueKind});
|
|
|
|
};
|
2018-05-23 18:33:32 +03:00
|
|
|
|
2021-06-14 23:53:44 +03:00
|
|
|
private onUIAuthFinished = (success: boolean, result: Error) => {
|
2020-04-07 00:42:06 +03:00
|
|
|
if (success) return; // great! makeRequest() will be called too.
|
|
|
|
|
|
|
|
if (result === ERROR_USER_CANCELLED) {
|
2021-06-14 23:53:44 +03:00
|
|
|
this.onCancel();
|
2018-05-23 15:35:42 +03:00
|
|
|
return;
|
|
|
|
}
|
2018-05-23 18:33:32 +03:00
|
|
|
|
2021-06-14 23:53:44 +03:00
|
|
|
console.error("Error during UI Auth:", { result });
|
2020-04-07 00:42:06 +03:00
|
|
|
this.setState({errStr: _t("There was a problem communicating with the server. Please try again.")});
|
|
|
|
};
|
|
|
|
|
2021-06-14 23:53:44 +03:00
|
|
|
private onUIAuthComplete = (auth): void => {
|
2020-04-07 00:42:06 +03:00
|
|
|
MatrixClientPeg.get().deactivateAccount(auth, this.state.shouldErase).then(r => {
|
|
|
|
// Deactivation worked - logout & close this dialog
|
|
|
|
Analytics.trackEvent('Account', 'Deactivate Account');
|
|
|
|
Lifecycle.onLoggedOut();
|
|
|
|
this.props.onFinished(true);
|
|
|
|
}).catch(e => {
|
|
|
|
console.error(e);
|
|
|
|
this.setState({errStr: _t("There was a problem communicating with the server. Please try again.")});
|
|
|
|
});
|
|
|
|
};
|
|
|
|
|
2021-06-14 23:53:44 +03:00
|
|
|
private onEraseFieldChange = (ev: React.FormEvent<HTMLInputElement>): void => {
|
2020-04-07 00:42:06 +03:00
|
|
|
this.setState({
|
2021-06-14 23:53:44 +03:00
|
|
|
shouldErase: ev.currentTarget.checked,
|
2020-05-13 02:17:17 +03:00
|
|
|
|
|
|
|
// Disable the auth form because we're going to have to reinitialize the auth
|
|
|
|
// information. We do this because we can't modify the parameters in the UIA
|
|
|
|
// session, and the user will have selected something which changes the request.
|
|
|
|
// Therefore, we throw away the last auth session and try a new one.
|
|
|
|
authEnabled: false,
|
2020-04-07 00:42:06 +03:00
|
|
|
});
|
2020-05-13 02:17:17 +03:00
|
|
|
|
|
|
|
// As mentioned above, set up for auth again to get updated UIA session info
|
2021-06-14 23:53:44 +03:00
|
|
|
this.initAuth(/* shouldErase= */ev.currentTarget.checked);
|
2020-04-07 00:42:06 +03:00
|
|
|
};
|
2016-08-03 13:34:13 +03:00
|
|
|
|
2021-06-14 23:53:44 +03:00
|
|
|
private onCancel(): void {
|
2016-08-03 13:34:13 +03:00
|
|
|
this.props.onFinished(false);
|
|
|
|
}
|
|
|
|
|
2021-06-14 23:53:44 +03:00
|
|
|
private initAuth(shouldErase: boolean): void {
|
2020-05-13 02:17:17 +03:00
|
|
|
MatrixClientPeg.get().deactivateAccount(null, shouldErase).then(r => {
|
|
|
|
// If we got here, oops. The server didn't require any auth.
|
|
|
|
// Our application lifecycle will catch the error and do the logout bits.
|
|
|
|
// We'll try to log something in an vain attempt to record what happened (storage
|
|
|
|
// is also obliterated on logout).
|
|
|
|
console.warn("User's account got deactivated without confirmation: Server had no auth");
|
|
|
|
this.setState({errStr: _t("Server did not require any authentication")});
|
|
|
|
}).catch(e => {
|
|
|
|
if (e && e.httpStatus === 401 && e.data) {
|
|
|
|
// Valid UIA response
|
|
|
|
this.setState({authData: e.data, authEnabled: true});
|
|
|
|
} else {
|
|
|
|
this.setState({errStr: _t("Server did not return valid authentication information.")});
|
|
|
|
}
|
|
|
|
});
|
2020-05-13 02:20:26 +03:00
|
|
|
}
|
2020-05-13 02:17:17 +03:00
|
|
|
|
2021-06-14 23:53:44 +03:00
|
|
|
public render() {
|
2017-12-18 13:08:51 +03:00
|
|
|
const BaseDialog = sdk.getComponent('views.dialogs.BaseDialog');
|
2016-08-03 13:34:13 +03:00
|
|
|
|
|
|
|
let error = null;
|
|
|
|
if (this.state.errStr) {
|
|
|
|
error = <div className="error">
|
2017-10-11 19:56:17 +03:00
|
|
|
{ this.state.errStr }
|
2017-01-20 17:22:27 +03:00
|
|
|
</div>;
|
2016-08-03 13:34:13 +03:00
|
|
|
}
|
|
|
|
|
2020-04-07 00:42:06 +03:00
|
|
|
let auth = <div>{_t("Loading...")}</div>;
|
2020-05-13 02:17:17 +03:00
|
|
|
if (this.state.authData && this.state.authEnabled) {
|
2020-04-07 00:42:06 +03:00
|
|
|
auth = (
|
|
|
|
<div>
|
|
|
|
{this.state.bodyText}
|
|
|
|
<InteractiveAuth
|
|
|
|
matrixClient={MatrixClientPeg.get()}
|
|
|
|
authData={this.state.authData}
|
2021-06-14 23:53:44 +03:00
|
|
|
makeRequest={this.onUIAuthComplete}
|
|
|
|
onAuthFinished={this.onUIAuthFinished}
|
|
|
|
onStagePhaseChange={this.onStagePhaseChange}
|
2020-04-07 00:42:06 +03:00
|
|
|
continueText={this.state.continueText}
|
|
|
|
continueKind={this.state.continueKind}
|
|
|
|
/>
|
|
|
|
</div>
|
|
|
|
);
|
2016-08-03 13:34:13 +03:00
|
|
|
}
|
|
|
|
|
2020-01-29 16:38:50 +03:00
|
|
|
// this is on purpose not a <form /> to prevent Enter triggering submission, to further prevent accidents
|
2016-08-03 13:34:13 +03:00
|
|
|
return (
|
2017-12-18 13:08:51 +03:00
|
|
|
<BaseDialog className="mx_DeactivateAccountDialog"
|
|
|
|
onFinished={this.props.onFinished}
|
|
|
|
titleClass="danger"
|
2018-05-23 18:33:32 +03:00
|
|
|
title={_t("Deactivate Account")}
|
|
|
|
>
|
2016-08-03 13:34:13 +03:00
|
|
|
<div className="mx_Dialog_content">
|
2018-05-23 18:33:32 +03:00
|
|
|
<p>{ _t(
|
|
|
|
"This will make your account permanently unusable. " +
|
2018-05-24 13:50:45 +03:00
|
|
|
"You will not be able to log in, and no one will be able to re-register the same " +
|
|
|
|
"user ID. " +
|
|
|
|
"This will cause your account to leave all rooms it is participating in, and it " +
|
|
|
|
"will remove your account details from your identity server. " +
|
2018-05-23 18:33:32 +03:00
|
|
|
"<b>This action is irreversible.</b>",
|
|
|
|
{},
|
|
|
|
{ b: (sub) => <b> { sub } </b> },
|
|
|
|
) }</p>
|
|
|
|
|
|
|
|
<p>{ _t(
|
2018-05-24 13:50:45 +03:00
|
|
|
"Deactivating your account <b>does not by default cause us to forget messages you " +
|
|
|
|
"have sent.</b> " +
|
|
|
|
"If you would like us to forget your messages, please tick the box below.",
|
2018-05-23 18:33:32 +03:00
|
|
|
{},
|
|
|
|
{ b: (sub) => <b> { sub } </b> },
|
|
|
|
) }</p>
|
|
|
|
|
|
|
|
<p>{ _t(
|
|
|
|
"Message visibility in Matrix is similar to email. " +
|
2018-05-24 13:50:45 +03:00
|
|
|
"Our forgetting your messages means that messages you have sent will not be shared " +
|
|
|
|
"with any new or unregistered users, but registered users who already have access " +
|
|
|
|
"to these messages will still have access to their copy.",
|
2018-05-23 18:33:32 +03:00
|
|
|
) }</p>
|
|
|
|
|
2018-05-24 13:50:45 +03:00
|
|
|
<div className="mx_DeactivateAccountDialog_input_section">
|
|
|
|
<p>
|
2020-05-29 00:33:00 +03:00
|
|
|
<StyledCheckbox
|
|
|
|
checked={this.state.shouldErase}
|
2021-06-14 23:53:44 +03:00
|
|
|
onChange={this.onEraseFieldChange}
|
2020-05-29 00:33:00 +03:00
|
|
|
>
|
|
|
|
{_t(
|
2018-05-24 13:50:45 +03:00
|
|
|
"Please forget all messages I have sent when my account is deactivated " +
|
|
|
|
"(<b>Warning:</b> this will cause future users to see an incomplete view " +
|
|
|
|
"of conversations)",
|
|
|
|
{},
|
|
|
|
{ b: (sub) => <b>{ sub }</b> },
|
2020-05-29 00:33:00 +03:00
|
|
|
)}
|
|
|
|
</StyledCheckbox>
|
2018-05-24 13:50:45 +03:00
|
|
|
</p>
|
|
|
|
|
2020-04-07 00:42:06 +03:00
|
|
|
{error}
|
|
|
|
{auth}
|
2018-05-24 13:50:45 +03:00
|
|
|
</div>
|
2018-05-23 18:33:32 +03:00
|
|
|
|
2016-08-03 13:34:13 +03:00
|
|
|
</div>
|
2017-12-18 13:08:51 +03:00
|
|
|
</BaseDialog>
|
2016-08-03 13:34:13 +03:00
|
|
|
);
|
|
|
|
}
|
|
|
|
}
|