Remove all usages of UNSAFE_* React methods (#9583)
This commit is contained in:
parent
38dbe8ed33
commit
590b845f3f
33 changed files with 585 additions and 413 deletions
|
@ -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(),
|
||||
|
|
|
@ -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 {
|
||||
|
|
|
@ -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);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -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> {
|
||||
|
|
|
@ -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;
|
||||
}
|
||||
|
||||
|
|
|
@ -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) {
|
||||
|
|
|
@ -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}
|
||||
|
|
|
@ -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> - </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 (
|
||||
|
|
|
@ -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 {
|
||||
|
|
|
@ -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);
|
||||
}
|
||||
|
|
|
@ -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 {
|
||||
|
|
|
@ -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
|
||||
}
|
||||
};
|
||||
|
||||
|
|
|
@ -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) => {
|
||||
|
|
|
@ -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) {
|
||||
|
|
|
@ -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) {
|
||||
|
|
|
@ -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> {
|
||||
|
|
|
@ -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> {
|
||||
|
|
|
@ -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();
|
||||
|
|
|
@ -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) {
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue