Remove all usages of UNSAFE_* React methods (#9583)

This commit is contained in:
Michael Telatynski 2022-11-18 09:22:43 +00:00 committed by GitHub
parent 38dbe8ed33
commit 590b845f3f
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
33 changed files with 585 additions and 413 deletions

View file

@ -133,8 +133,7 @@ export default class InteractiveAuthComponent extends React.Component<IProps, IS
}
}
// TODO: [REACT-WARNING] Replace component with real class, use constructor for refs
UNSAFE_componentWillMount() { // eslint-disable-line @typescript-eslint/naming-convention, camelcase
public componentDidMount() {
this.authLogic.attemptAuth().then((result) => {
const extra = {
emailSid: this.authLogic.getEmailSid(),

View file

@ -403,12 +403,17 @@ export default class MatrixChat extends React.PureComponent<IProps, IState> {
this.setState({ pendingInitialSync: false });
}
// TODO: [REACT-WARNING] Replace with appropriate lifecycle stage
// eslint-disable-next-line
UNSAFE_componentWillUpdate(props, state) {
if (this.shouldTrackPageChange(this.state, state)) {
public setState<K extends keyof IState>(
state: ((
prevState: Readonly<IState>,
props: Readonly<IProps>,
) => (Pick<IState, K> | IState | null)) | (Pick<IState, K> | IState | null),
callback?: () => void,
): void {
if (this.shouldTrackPageChange(this.state, { ...this.state, ...state })) {
this.startPageChangeTimer();
}
super.setState<K>(state, callback);
}
public componentDidMount(): void {

View file

@ -299,22 +299,17 @@ class TimelinePanel extends React.Component<IProps, IState> {
cli.on(ClientEvent.Sync, this.onSync);
}
// TODO: [REACT-WARNING] Move into constructor
// eslint-disable-next-line
UNSAFE_componentWillMount() {
public componentDidMount() {
if (this.props.manageReadReceipts) {
this.updateReadReceiptOnUserActivity();
}
if (this.props.manageReadMarkers) {
this.updateReadMarkerOnUserActivity();
}
this.initTimeline(this.props);
}
// TODO: [REACT-WARNING] Replace with appropriate lifecycle event
// eslint-disable-next-line
UNSAFE_componentWillReceiveProps(newProps) {
public componentDidUpdate(newProps) {
if (newProps.timelineSet !== this.props.timelineSet) {
// throw new Error("changing timelineSet on a TimelinePanel is not supported");
@ -334,10 +329,9 @@ class TimelinePanel extends React.Component<IProps, IState> {
const differentHighlightedEventId = newProps.highlightedEventId != this.props.highlightedEventId;
const differentAvoidJump = newProps.eventScrollIntoView && !this.props.eventScrollIntoView;
if (differentEventId || differentHighlightedEventId || differentAvoidJump) {
logger.log("TimelinePanel switching to " +
"eventId " + newProps.eventId + " (was " + this.props.eventId + "), " +
"scrollIntoView: " + newProps.eventScrollIntoView + " (was " + this.props.eventScrollIntoView + ")");
return this.initTimeline(newProps);
logger.log(`TimelinePanel switching to eventId ${newProps.eventId} (was ${this.props.eventId}), ` +
`scrollIntoView: ${newProps.eventScrollIntoView} (was ${this.props.eventScrollIntoView})`);
this.initTimeline(newProps);
}
}

View file

@ -113,17 +113,16 @@ export default class ForgotPassword extends React.Component<IProps, IState> {
this.checkServerCapabilities(this.props.serverConfig);
}
// TODO: [REACT-WARNING] Replace with appropriate lifecycle event
// eslint-disable-next-line
public UNSAFE_componentWillReceiveProps(newProps: IProps): void {
if (newProps.serverConfig.hsUrl === this.props.serverConfig.hsUrl &&
newProps.serverConfig.isUrl === this.props.serverConfig.isUrl) return;
public componentDidUpdate(prevProps: Readonly<IProps>) {
if (prevProps.serverConfig.hsUrl !== this.props.serverConfig.hsUrl ||
prevProps.serverConfig.isUrl !== this.props.serverConfig.isUrl
) {
// Do a liveliness check on the new URLs
this.checkServerLiveliness(this.props.serverConfig);
// Do a liveliness check on the new URLs
this.checkServerLiveliness(newProps.serverConfig);
// Do capabilities check on new URLs
this.checkServerCapabilities(newProps.serverConfig);
// Do capabilities check on new URLs
this.checkServerCapabilities(this.props.serverConfig);
}
}
private async checkServerLiveliness(serverConfig): Promise<void> {

View file

@ -144,9 +144,7 @@ export default class LoginComponent extends React.PureComponent<IProps, IState>
};
}
// TODO: [REACT-WARNING] Replace with appropriate lifecycle event
// eslint-disable-next-line
UNSAFE_componentWillMount() {
public componentDidMount() {
this.initLoginLogic(this.props.serverConfig);
}
@ -154,14 +152,13 @@ export default class LoginComponent extends React.PureComponent<IProps, IState>
this.unmounted = true;
}
// TODO: [REACT-WARNING] Replace with appropriate lifecycle event
// eslint-disable-next-line
UNSAFE_componentWillReceiveProps(newProps) {
if (newProps.serverConfig.hsUrl === this.props.serverConfig.hsUrl &&
newProps.serverConfig.isUrl === this.props.serverConfig.isUrl) return;
// Ensure that we end up actually logging in to the right place
this.initLoginLogic(newProps.serverConfig);
public componentDidUpdate(prevProps) {
if (prevProps.serverConfig.hsUrl !== this.props.serverConfig.hsUrl ||
prevProps.serverConfig.isUrl !== this.props.serverConfig.isUrl
) {
// Ensure that we end up actually logging in to the right place
this.initLoginLogic(this.props.serverConfig);
}
}
isBusy = () => this.state.busy || this.props.busy;
@ -369,7 +366,8 @@ export default class LoginComponent extends React.PureComponent<IProps, IState>
let isDefaultServer = false;
if (this.props.serverConfig.isDefault
&& hsUrl === this.props.serverConfig.hsUrl
&& isUrl === this.props.serverConfig.isUrl) {
&& isUrl === this.props.serverConfig.isUrl
) {
isDefaultServer = true;
}

View file

@ -165,13 +165,13 @@ export default class Registration extends React.Component<IProps, IState> {
return "";
}
};
// TODO: [REACT-WARNING] Replace with appropriate lifecycle event
// eslint-disable-next-line
UNSAFE_componentWillReceiveProps(newProps) {
if (newProps.serverConfig.hsUrl === this.props.serverConfig.hsUrl &&
newProps.serverConfig.isUrl === this.props.serverConfig.isUrl) return;
this.replaceClient(newProps.serverConfig);
public componentDidUpdate(prevProps) {
if (prevProps.serverConfig.hsUrl !== this.props.serverConfig.hsUrl ||
prevProps.serverConfig.isUrl !== this.props.serverConfig.isUrl
) {
this.replaceClient(this.props.serverConfig);
}
}
private async replaceClient(serverConfig: ValidatedServerConfig) {

View file

@ -49,17 +49,21 @@ export default function MemberAvatar({
height,
resizeMethod = 'crop',
viewUserOnClick,
forceHistorical,
fallbackUserId,
hideTitle,
member: propsMember,
...props
}: IProps) {
const card = useContext(CardContext);
const member = useRoomMemberProfile({
userId: props.member?.userId,
member: props.member,
forceHistorical: props.forceHistorical,
userId: propsMember?.userId,
member: propsMember,
forceHistorical: forceHistorical,
});
const name = member?.name ?? props.fallbackUserId;
const name = member?.name ?? fallbackUserId;
let title: string | undefined = props.title;
let imageUrl: string | undefined;
if (member?.name) {
@ -74,7 +78,7 @@ export default function MemberAvatar({
if (!title) {
title = UserIdentifierCustomisations.getDisplayUserIdentifier(
member?.userId ?? "", { roomId: member?.roomId ?? "" },
) ?? props.fallbackUserId;
) ?? fallbackUserId;
}
}
@ -84,13 +88,13 @@ export default function MemberAvatar({
height={height}
resizeMethod={resizeMethod}
name={name ?? ""}
title={props.hideTitle ? undefined : title}
idName={member?.userId ?? props.fallbackUserId}
title={hideTitle ? undefined : title}
idName={member?.userId ?? fallbackUserId}
url={imageUrl}
onClick={viewUserOnClick ? () => {
dis.dispatch({
action: Action.ViewUser,
member: props.member,
member: propsMember,
push: card.isCard,
});
} : props.onClick}

View file

@ -99,7 +99,6 @@ interface IState {
isUserProfileReady: boolean;
error: Error;
menuDisplayed: boolean;
widgetPageTitle: string;
requiresClient: boolean;
}
@ -229,7 +228,6 @@ export default class AppTile extends React.Component<IProps, IState> {
isUserProfileReady: OwnProfileStore.instance.isProfileInfoFetched,
error: null,
menuDisplayed: false,
widgetPageTitle: this.props.widgetPageTitle,
requiresClient: this.determineInitialRequiresClientState(),
};
}
@ -351,21 +349,13 @@ export default class AppTile extends React.Component<IProps, IState> {
}
};
// TODO: [REACT-WARNING] Replace with appropriate lifecycle event
// eslint-disable-next-line @typescript-eslint/naming-convention
public UNSAFE_componentWillReceiveProps(nextProps: IProps): void { // eslint-disable-line camelcase
if (nextProps.app.url !== this.props.app.url) {
this.getNewState(nextProps);
public componentDidUpdate(prevProps: IProps): void {
if (prevProps.app.url !== this.props.app.url) {
this.getNewState(this.props);
if (this.state.hasPermissionToLoad) {
this.resetWidget(nextProps);
this.resetWidget(this.props);
}
}
if (nextProps.widgetPageTitle !== this.props.widgetPageTitle) {
this.setState({
widgetPageTitle: nextProps.widgetPageTitle,
});
}
}
/**
@ -474,8 +464,8 @@ export default class AppTile extends React.Component<IProps, IState> {
const name = this.formatAppTileName();
const titleSpacer = <span>&nbsp;-&nbsp;</span>;
let title = '';
if (this.state.widgetPageTitle && this.state.widgetPageTitle !== this.formatAppTileName()) {
title = this.state.widgetPageTitle;
if (this.props.widgetPageTitle && this.props.widgetPageTitle !== this.formatAppTileName()) {
title = this.props.widgetPageTitle;
}
return (

View file

@ -22,6 +22,7 @@ import AccessibleButton, { ButtonEvent } from './AccessibleButton';
import { _t } from '../../../languageHandler';
import { getKeyBindingsManager } from "../../../KeyBindingsManager";
import { KeyBindingAction } from "../../../accessibility/KeyboardShortcuts";
import { objectHasDiff } from "../../../utils/objects";
interface IMenuOptionProps {
children: ReactElement;
@ -136,20 +137,18 @@ export default class Dropdown extends React.Component<DropdownProps, IState> {
document.addEventListener('click', this.onDocumentClick, false);
}
componentWillUnmount() {
document.removeEventListener('click', this.onDocumentClick, false);
public componentDidUpdate(prevProps: Readonly<DropdownProps>) {
if (objectHasDiff(this.props, prevProps) && this.props.children?.length) {
this.reindexChildren(this.props.children);
const firstChild = this.props.children[0];
this.setState({
highlightedOption: String(firstChild?.key) ?? null,
});
}
}
// TODO: [REACT-WARNING] Replace with appropriate lifecycle event
UNSAFE_componentWillReceiveProps(nextProps) { // eslint-disable-line
if (!nextProps.children || nextProps.children.length === 0) {
return;
}
this.reindexChildren(nextProps.children);
const firstChild = nextProps.children[0];
this.setState({
highlightedOption: firstChild ? firstChild.key : null,
});
componentWillUnmount() {
document.removeEventListener('click', this.onDocumentClick, false);
}
private reindexChildren(children: ReactElement[]): void {

View file

@ -70,11 +70,9 @@ export default class EditableText extends React.Component<IProps, IState> {
};
}
// TODO: [REACT-WARNING] Replace with appropriate lifecycle event
// eslint-disable-next-line @typescript-eslint/naming-convention, camelcase
public UNSAFE_componentWillReceiveProps(nextProps: IProps): void {
if (nextProps.initialValue !== this.props.initialValue) {
this.value = nextProps.initialValue;
public componentDidUpdate(prevProps: Readonly<IProps>): void {
if (prevProps.initialValue !== this.props.initialValue) {
this.value = this.props.initialValue;
if (this.editableDiv.current) {
this.showPlaceholder(!this.value);
}

View file

@ -29,6 +29,7 @@ import { Action } from "../../../dispatcher/actions";
import Tooltip, { Alignment } from './Tooltip';
import RoomAvatar from '../avatars/RoomAvatar';
import MemberAvatar from '../avatars/MemberAvatar';
import { objectHasDiff } from "../../../utils/objects";
export enum PillType {
UserMention = 'TYPE_USER_MENTION',
@ -86,19 +87,17 @@ export default class Pill extends React.Component<IProps, IState> {
};
}
// TODO: [REACT-WARNING] Replace with appropriate lifecycle event
// eslint-disable-next-line camelcase, @typescript-eslint/naming-convention
public async UNSAFE_componentWillReceiveProps(nextProps: IProps): Promise<void> {
let resourceId;
let prefix;
private load(): void {
let resourceId: string;
let prefix: string;
if (nextProps.url) {
if (nextProps.inMessage) {
const parts = parsePermalink(nextProps.url);
if (this.props.url) {
if (this.props.inMessage) {
const parts = parsePermalink(this.props.url);
resourceId = parts.primaryEntityId; // The room/user ID
prefix = parts.sigil; // The first character of prefix
} else {
resourceId = getPrimaryPermalinkEntity(nextProps.url);
resourceId = getPrimaryPermalinkEntity(this.props.url);
prefix = resourceId ? resourceId[0] : undefined;
}
}
@ -109,15 +108,15 @@ export default class Pill extends React.Component<IProps, IState> {
'!': PillType.RoomMention,
}[prefix];
let member;
let room;
let member: RoomMember;
let room: Room;
switch (pillType) {
case PillType.AtRoomMention: {
room = nextProps.room;
room = this.props.room;
}
break;
case PillType.UserMention: {
const localMember = nextProps.room ? nextProps.room.getMember(resourceId) : undefined;
const localMember = this.props.room?.getMember(resourceId);
member = localMember;
if (!localMember) {
member = new RoomMember(null, resourceId);
@ -146,9 +145,13 @@ export default class Pill extends React.Component<IProps, IState> {
public componentDidMount(): void {
this.unmounted = false;
this.matrixClient = MatrixClientPeg.get();
this.load();
}
// eslint-disable-next-line new-cap
this.UNSAFE_componentWillReceiveProps(this.props); // HACK: We shouldn't be calling lifecycle functions ourselves.
public componentDidUpdate(prevProps: Readonly<IProps>) {
if (objectHasDiff(this.props, prevProps)) {
this.load();
}
}
public componentWillUnmount(): void {

View file

@ -21,6 +21,7 @@ import { _t } from '../../../languageHandler';
import Field from "./Field";
import { KeyBindingAction } from "../../../accessibility/KeyboardShortcuts";
import { getKeyBindingsManager } from "../../../KeyBindingsManager";
import { objectHasDiff } from "../../../utils/objects";
const CUSTOM_VALUE = "SELECT_VALUE_CUSTOM";
@ -72,36 +73,35 @@ export default class PowerSelector extends React.Component<IProps, IState> {
};
}
// TODO: [REACT-WARNING] Replace with appropriate lifecycle event
// eslint-disable-next-line camelcase, @typescript-eslint/naming-convention
public UNSAFE_componentWillMount(): void {
this.initStateFromProps(this.props);
public componentDidMount() {
this.initStateFromProps();
}
// eslint-disable-next-line camelcase, @typescript-eslint/naming-convention
public UNSAFE_componentWillReceiveProps(newProps: IProps): void {
this.initStateFromProps(newProps);
public componentDidUpdate(prevProps: Readonly<IProps>) {
if (objectHasDiff(this.props, prevProps)) {
this.initStateFromProps();
}
}
private initStateFromProps(newProps: IProps): void {
private initStateFromProps(): void {
// This needs to be done now because levelRoleMap has translated strings
const levelRoleMap = Roles.levelRoleMap(newProps.usersDefault);
const levelRoleMap = Roles.levelRoleMap(this.props.usersDefault);
const options = Object.keys(levelRoleMap).filter(level => {
return (
level === undefined ||
parseInt(level) <= newProps.maxValue ||
parseInt(level) == newProps.value
parseInt(level) <= this.props.maxValue ||
parseInt(level) == this.props.value
);
}).map(level => parseInt(level));
const isCustom = levelRoleMap[newProps.value] === undefined;
const isCustom = levelRoleMap[this.props.value] === undefined;
this.setState({
levelRoleMap,
options,
custom: isCustom,
customValue: newProps.value,
selectValue: isCustom ? CUSTOM_VALUE : newProps.value,
customValue: this.props.value,
selectValue: isCustom ? CUSTOM_VALUE : this.props.value,
});
}
@ -127,7 +127,7 @@ export default class PowerSelector extends React.Component<IProps, IState> {
if (Number.isFinite(this.state.customValue)) {
this.props.onChange(this.state.customValue, this.props.powerLevelKey);
} else {
this.initStateFromProps(this.props); // reset, invalid input
this.initStateFromProps(); // reset, invalid input
}
};

View file

@ -369,12 +369,6 @@ export class UnwrappedEventTile extends React.Component<EventTileProps, IState>
return true;
}
// TODO: [REACT-WARNING] Move into constructor
// eslint-disable-next-line
UNSAFE_componentWillMount() {
this.verifyEvent(this.props.mxEvent);
}
componentDidMount() {
this.suppressReadReceiptAnimation = false;
const client = MatrixClientPeg.get();
@ -405,6 +399,8 @@ export class UnwrappedEventTile extends React.Component<EventTileProps, IState>
const room = client.getRoom(this.props.mxEvent.getRoomId());
room?.on(ThreadEvent.New, this.onNewThread);
this.verifyEvent(this.props.mxEvent);
}
private get supportsThreadNotifications(): boolean {
@ -451,16 +447,6 @@ export class UnwrappedEventTile extends React.Component<EventTileProps, IState>
this.setState({ thread });
};
// TODO: [REACT-WARNING] Replace with appropriate lifecycle event
// eslint-disable-next-line
UNSAFE_componentWillReceiveProps(nextProps: EventTileProps) {
// re-check the sender verification as outgoing events progress through
// the send process.
if (nextProps.eventSendStatus !== this.props.eventSendStatus) {
this.verifyEvent(nextProps.mxEvent);
}
}
shouldComponentUpdate(nextProps: EventTileProps, nextState: IState): boolean {
if (objectHasDiff(this.state, nextState)) {
return true;
@ -490,12 +476,16 @@ export class UnwrappedEventTile extends React.Component<EventTileProps, IState>
}
}
componentDidUpdate() {
componentDidUpdate(prevProps: Readonly<EventTileProps>) {
// If we're not listening for receipts and expect to be, register a listener.
if (!this.isListeningForReceipts && (this.shouldShowSentReceipt || this.shouldShowSendingReceipt)) {
MatrixClientPeg.get().on(RoomEvent.Receipt, this.onRoomReceipt);
this.isListeningForReceipts = true;
}
// re-check the sender verification as outgoing events progress through the send process.
if (prevProps.eventSendStatus !== this.props.eventSendStatus) {
this.verifyEvent(this.props.mxEvent);
}
}
private onNewThread = (thread: Thread) => {

View file

@ -96,8 +96,7 @@ export default class MemberList extends React.Component<IProps, IState> {
this.showPresence = enablePresenceByHsUrl?.[hsUrl] ?? true;
}
// eslint-disable-next-line
UNSAFE_componentWillMount() {
public componentDidMount() {
const cli = MatrixClientPeg.get();
this.mounted = true;
if (cli.hasLazyLoadMembersEnabled()) {
@ -121,7 +120,7 @@ export default class MemberList extends React.Component<IProps, IState> {
cli.on(UserEvent.CurrentlyActive, this.onUserPresenceChange);
}
componentWillUnmount() {
public componentWillUnmount() {
this.mounted = false;
const cli = MatrixClientPeg.get();
if (cli) {

View file

@ -159,7 +159,9 @@ export class SendMessageComposer extends React.Component<ISendMessageComposerPro
};
constructor(props: ISendMessageComposerProps, context: React.ContextType<typeof RoomContext>) {
super(props);
super(props, context);
this.context = context; // otherwise React will only set it prior to render due to type def above
if (this.props.mxClient.isCryptoEnabled() && this.props.mxClient.isRoomEncrypted(this.props.room.roomId)) {
this.prepareToEncrypt = throttle(() => {
this.props.mxClient.prepareToEncrypt(this.props.room);
@ -167,6 +169,12 @@ export class SendMessageComposer extends React.Component<ISendMessageComposerPro
}
window.addEventListener("beforeunload", this.saveStoredEditorState);
const partCreator = new CommandPartCreator(this.props.room, this.props.mxClient);
const parts = this.restoreStoredEditorState(partCreator) || [];
this.model = new EditorModel(parts, partCreator);
this.dispatcherRef = dis.register(this.onAction);
this.sendHistoryManager = new SendHistoryManager(this.props.room.roomId, 'mx_cider_history_');
}
public componentDidUpdate(prevProps: ISendMessageComposerProps): void {
@ -456,15 +464,6 @@ export class SendMessageComposer extends React.Component<ISendMessageComposerPro
this.saveStoredEditorState();
}
// TODO: [REACT-WARNING] Move this to constructor
UNSAFE_componentWillMount() { // eslint-disable-line
const partCreator = new CommandPartCreator(this.props.room, this.props.mxClient);
const parts = this.restoreStoredEditorState(partCreator) || [];
this.model = new EditorModel(parts, partCreator);
this.dispatcherRef = dis.register(this.onAction);
this.sendHistoryManager = new SendHistoryManager(this.props.room.roomId, 'mx_cider_history_');
}
private get editorStateKey() {
let key = `mx_cider_state_${this.props.room.roomId}`;
if (this.props.relation?.rel_type === THREAD_RELATION_TYPE.name) {

View file

@ -67,11 +67,11 @@ export class EmailAddress extends React.Component<IEmailAddressProps, IEmailAddr
};
}
// TODO: [REACT-WARNING] Replace with appropriate lifecycle event
// eslint-disable-next-line @typescript-eslint/naming-convention, camelcase
public UNSAFE_componentWillReceiveProps(nextProps: IEmailAddressProps): void {
const { bound } = nextProps.email;
this.setState({ bound });
public componentDidUpdate(prevProps: Readonly<IEmailAddressProps>) {
if (this.props.email !== prevProps.email) {
const { bound } = this.props.email;
this.setState({ bound });
}
}
private async changeBinding({ bind, label, errorTitle }): Promise<void> {

View file

@ -63,11 +63,11 @@ export class PhoneNumber extends React.Component<IPhoneNumberProps, IPhoneNumber
};
}
// TODO: [REACT-WARNING] Replace with appropriate lifecycle event
// eslint-disable-next-line @typescript-eslint/naming-convention, camelcase
public UNSAFE_componentWillReceiveProps(nextProps: IPhoneNumberProps): void {
const { bound } = nextProps.msisdn;
this.setState({ bound });
public componentDidUpdate(prevProps: Readonly<IPhoneNumberProps>) {
if (this.props.msisdn !== prevProps.msisdn) {
const { bound } = this.props.msisdn;
this.setState({ bound });
}
}
private async changeBinding({ bind, label, errorTitle }): Promise<void> {

View file

@ -55,22 +55,18 @@ export default class NotificationsSettingsTab extends React.Component<IProps, IS
this.roomProps = EchoChamber.forRoom(context.getRoom(this.props.roomId));
let currentSound = "default";
const soundData = Notifier.getSoundForRoom(this.props.roomId);
if (soundData) {
currentSound = soundData.name || soundData.url;
}
this.state = {
currentSound: "default",
currentSound,
uploadedFile: null,
};
}
// TODO: [REACT-WARNING] Replace component with real class, use constructor for refs
// eslint-disable-next-line @typescript-eslint/naming-convention, camelcase
public UNSAFE_componentWillMount(): void {
const soundData = Notifier.getSoundForRoom(this.props.roomId);
if (!soundData) {
return;
}
this.setState({ currentSound: soundData.name || soundData.url });
}
private triggerUploader = async (e: React.MouseEvent): Promise<void> => {
e.stopPropagation();
e.preventDefault();

View file

@ -107,25 +107,8 @@ export default class GeneralUserSettingsTab extends React.Component<IProps, ISta
};
this.dispatcherRef = dis.register(this.onAction);
}
// TODO: [REACT-WARNING] Move this to constructor
// eslint-disable-next-line @typescript-eslint/naming-convention, camelcase
public async UNSAFE_componentWillMount(): Promise<void> {
const cli = MatrixClientPeg.get();
const serverSupportsSeparateAddAndBind = await cli.doesServerSupportSeparateAddAndBind();
const capabilities = await cli.getCapabilities(); // this is cached
const changePasswordCap = capabilities['m.change_password'];
// You can change your password so long as the capability isn't explicitly disabled. The implicit
// behaviour is you can change your password when the capability is missing or has not-false as
// the enabled flag value.
const canChangePassword = !changePasswordCap || changePasswordCap['enabled'] !== false;
this.setState({ serverSupportsSeparateAddAndBind, canChangePassword });
this.getCapabilities();
this.getThreepidState();
}
@ -163,6 +146,22 @@ export default class GeneralUserSettingsTab extends React.Component<IProps, ISta
this.setState({ msisdns });
};
private async getCapabilities(): Promise<void> {
const cli = MatrixClientPeg.get();
const serverSupportsSeparateAddAndBind = await cli.doesServerSupportSeparateAddAndBind();
const capabilities = await cli.getCapabilities(); // this is cached
const changePasswordCap = capabilities['m.change_password'];
// You can change your password so long as the capability isn't explicitly disabled. The implicit
// behaviour is you can change your password when the capability is missing or has not-false as
// the enabled flag value.
const canChangePassword = !changePasswordCap || changePasswordCap['enabled'] !== false;
this.setState({ serverSupportsSeparateAddAndBind, canChangePassword });
}
private async getThreepidState(): Promise<void> {
const cli = MatrixClientPeg.get();
@ -171,7 +170,7 @@ export default class GeneralUserSettingsTab extends React.Component<IProps, ISta
// Need to get 3PIDs generally for Account section and possibly also for
// Discovery (assuming we have an IS and terms are agreed).
let threepids = [];
let threepids: IThreepid[] = [];
try {
threepids = await getThreepidsWithBindStatus(cli);
} catch (e) {