Remove withMatrixClient as we are committed to using Contexts

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
This commit is contained in:
Michael Telatynski 2019-08-05 12:26:31 +01:00
parent f80cbebb9d
commit 224dac3ffb
6 changed files with 73 additions and 108 deletions

View file

@ -1,5 +1,6 @@
/*
Copyright 2017 Vector Creations Ltd
Copyright 2019 Michael Telatynski <7t3chguy@gmail.com>
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
@ -19,16 +20,12 @@ import PropTypes from 'prop-types';
import sdk from '../../index';
import { _t } from '../../languageHandler';
import dis from '../../dispatcher';
import withMatrixClient from '../../wrappers/withMatrixClient';
import AccessibleButton from '../views/elements/AccessibleButton';
import * as Matrix from "matrix-js-sdk";
export default withMatrixClient(React.createClass({
export default React.createClass({
displayName: 'MyGroups',
propTypes: {
matrixClient: PropTypes.object.isRequired,
},
getInitialState: function() {
return {
groups: null,
@ -36,6 +33,10 @@ export default withMatrixClient(React.createClass({
};
},
contextTypes: {
matrixClient: PropTypes.instanceOf(Matrix.MatrixClient).isRequired,
},
componentWillMount: function() {
this._fetch();
},
@ -45,7 +46,7 @@ export default withMatrixClient(React.createClass({
},
_fetch: function() {
this.props.matrixClient.getJoinedGroups().done((result) => {
this.context.matrixClient.getJoinedGroups().done((result) => {
this.setState({groups: result.groups, error: null});
}, (err) => {
if (err.errcode === 'M_GUEST_ACCESS_FORBIDDEN') {
@ -146,4 +147,4 @@ export default withMatrixClient(React.createClass({
</div>
</div>;
},
}));
});

View file

@ -134,9 +134,6 @@ Flair.propTypes = {
groups: PropTypes.arrayOf(PropTypes.string),
};
// TODO: We've decided that all components should follow this pattern, which means removing withMatrixClient and using
// this.context.matrixClient everywhere instead of this.props.matrixClient.
// See https://github.com/vector-im/riot-web/issues/4951.
Flair.contextTypes = {
matrixClient: PropTypes.instanceOf(MatrixClient).isRequired,
};

View file

@ -1,6 +1,7 @@
/*
Copyright 2017 Vector Creations Ltd
Copyright 2017 New Vector Ltd
Copyright 2019 Michael Telatynski <7t3chguy@gmail.com>
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
@ -20,13 +21,12 @@ import PropTypes from 'prop-types';
import sdk from '../../../index';
import dis from '../../../dispatcher';
import { GroupMemberType } from '../../../groups';
import withMatrixClient from '../../../wrappers/withMatrixClient';
import * as Matrix from "matrix-js-sdk";
export default withMatrixClient(React.createClass({
export default React.createClass({
displayName: 'GroupMemberTile',
propTypes: {
matrixClient: PropTypes.object,
groupId: PropTypes.string.isRequired,
member: GroupMemberType.isRequired,
},
@ -35,6 +35,10 @@ export default withMatrixClient(React.createClass({
return {};
},
contextTypes: {
matrixClient: PropTypes.instanceOf(Matrix.MatrixClient).isRequired,
},
onClick: function(e) {
dis.dispatch({
action: 'view_group_user',
@ -48,7 +52,7 @@ export default withMatrixClient(React.createClass({
const EntityTile = sdk.getComponent('rooms.EntityTile');
const name = this.props.member.displayname || this.props.member.userId;
const avatarUrl = this.props.matrixClient.mxcUrlToHttp(
const avatarUrl = this.context.matrixClient.mxcUrlToHttp(
this.props.member.avatarUrl,
36, 36, 'crop',
);
@ -67,4 +71,4 @@ export default withMatrixClient(React.createClass({
/>
);
},
}));
});

View file

@ -29,11 +29,10 @@ const Modal = require('../../../Modal');
const sdk = require('../../../index');
const TextForEvent = require('../../../TextForEvent');
import withMatrixClient from '../../../wrappers/withMatrixClient';
import dis from '../../../dispatcher';
import SettingsStore from "../../../settings/SettingsStore";
import {EventStatus} from 'matrix-js-sdk';
import {EventStatus, default as Matrix} from 'matrix-js-sdk';
const ObjectUtils = require('../../../ObjectUtils');
@ -85,13 +84,10 @@ const MAX_READ_AVATARS = 5;
// | '--------------------------------------' |
// '----------------------------------------------------------'
module.exports = withMatrixClient(React.createClass({
module.exports = React.createClass({
displayName: 'EventTile',
propTypes: {
/* MatrixClient instance for sender verification etc */
matrixClient: PropTypes.object.isRequired,
/* the MatrixEvent to show */
mxEvent: PropTypes.object.isRequired,
@ -192,6 +188,10 @@ module.exports = withMatrixClient(React.createClass({
};
},
contextTypes: {
matrixClient: PropTypes.instanceOf(Matrix.MatrixClient).isRequired,
},
componentWillMount: function() {
// don't do RR animations until we are mounted
this._suppressReadReceiptAnimation = true;
@ -200,7 +200,7 @@ module.exports = withMatrixClient(React.createClass({
componentDidMount: function() {
this._suppressReadReceiptAnimation = false;
const client = this.props.matrixClient;
const client = this.context.matrixClient;
client.on("deviceVerificationChanged", this.onDeviceVerificationChanged);
this.props.mxEvent.on("Event.decrypted", this._onDecrypted);
if (this.props.showReactions) {
@ -225,7 +225,7 @@ module.exports = withMatrixClient(React.createClass({
},
componentWillUnmount: function() {
const client = this.props.matrixClient;
const client = this.context.matrixClient;
client.removeListener("deviceVerificationChanged", this.onDeviceVerificationChanged);
this.props.mxEvent.removeListener("Event.decrypted", this._onDecrypted);
if (this.props.showReactions) {
@ -254,7 +254,7 @@ module.exports = withMatrixClient(React.createClass({
return;
}
const verified = await this.props.matrixClient.isEventSenderVerified(mxEvent);
const verified = await this.context.matrixClient.isEventSenderVerified(mxEvent);
this.setState({
verified: verified,
}, () => {
@ -312,11 +312,11 @@ module.exports = withMatrixClient(React.createClass({
},
shouldHighlight: function() {
const actions = this.props.matrixClient.getPushActionsForEvent(this.props.mxEvent);
const actions = this.context.matrixClient.getPushActionsForEvent(this.props.mxEvent);
if (!actions || !actions.tweaks) { return false; }
// don't show self-highlights from another of our clients
if (this.props.mxEvent.getSender() === this.props.matrixClient.credentials.userId) {
if (this.props.mxEvent.getSender() === this.context.matrixClient.credentials.userId) {
return false;
}
@ -424,7 +424,7 @@ module.exports = withMatrixClient(React.createClass({
// Cancel any outgoing key request for this event and resend it. If a response
// is received for the request with the required keys, the event could be
// decrypted successfully.
this.props.matrixClient.cancelAndResendEventRoomKeyRequest(this.props.mxEvent);
this.context.matrixClient.cancelAndResendEventRoomKeyRequest(this.props.mxEvent);
},
onPermalinkClicked: function(e) {
@ -457,7 +457,7 @@ module.exports = withMatrixClient(React.createClass({
}
}
if (this.props.matrixClient.isRoomEncrypted(ev.getRoomId())) {
if (this.context.matrixClient.isRoomEncrypted(ev.getRoomId())) {
// else if room is encrypted
// and event is being encrypted or is not_sent (Unknown Devices/Network Error)
if (ev.status === EventStatus.ENCRYPTING) {
@ -691,7 +691,7 @@ module.exports = withMatrixClient(React.createClass({
switch (this.props.tileShape) {
case 'notif': {
const room = this.props.matrixClient.getRoom(this.props.mxEvent.getRoomId());
const room = this.context.matrixClient.getRoom(this.props.mxEvent.getRoomId());
return (
<div className={classes}>
<div className="mx_EventTile_roomName">
@ -816,7 +816,7 @@ module.exports = withMatrixClient(React.createClass({
}
}
},
}));
});
// XXX this'll eventually be dynamic based on the fields once we have extensible event types
const messageTypes = ['m.room.message', 'm.sticker'];

View file

@ -1,6 +1,7 @@
/*
Copyright 2015, 2016 OpenMarket Ltd
Copyright 2017, 2018 Vector Creations Ltd
Copyright 2019 Michael Telatynski <7t3chguy@gmail.com>
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
@ -37,7 +38,6 @@ import createRoom from '../../../createRoom';
import DMRoomMap from '../../../utils/DMRoomMap';
import Unread from '../../../Unread';
import { findReadReceiptFromUserId } from '../../../utils/Receipt';
import withMatrixClient from '../../../wrappers/withMatrixClient';
import AccessibleButton from '../elements/AccessibleButton';
import RoomViewStore from '../../../stores/RoomViewStore';
import SdkConfig from '../../../SdkConfig';
@ -45,12 +45,12 @@ import MultiInviter from "../../../utils/MultiInviter";
import SettingsStore from "../../../settings/SettingsStore";
import E2EIcon from "./E2EIcon";
import AutoHideScrollbar from "../../structures/AutoHideScrollbar";
import * as Matrix from "matrix-js-sdk";
module.exports = withMatrixClient(React.createClass({
module.exports = React.createClass({
displayName: 'MemberInfo',
propTypes: {
matrixClient: PropTypes.object.isRequired,
member: PropTypes.object.isRequired,
},
@ -71,13 +71,17 @@ module.exports = withMatrixClient(React.createClass({
};
},
contextTypes: {
matrixClient: PropTypes.instanceOf(Matrix.MatrixClient).isRequired,
},
componentWillMount: function() {
this._cancelDeviceList = null;
const cli = this.context.matrixClient;
// only display the devices list if our client supports E2E
this._enableDevices = this.props.matrixClient.isCryptoEnabled();
this._enableDevices = cli.isCryptoEnabled();
const cli = this.props.matrixClient;
cli.on("deviceVerificationChanged", this.onDeviceVerificationChanged);
cli.on("Room", this.onRoom);
cli.on("deleteRoom", this.onDeleteRoom);
@ -103,7 +107,7 @@ module.exports = withMatrixClient(React.createClass({
},
componentWillUnmount: function() {
const client = this.props.matrixClient;
const client = this.context.matrixClient;
if (client) {
client.removeListener("deviceVerificationChanged", this.onDeviceVerificationChanged);
client.removeListener("Room", this.onRoom);
@ -122,7 +126,7 @@ module.exports = withMatrixClient(React.createClass({
},
_checkIgnoreState: function() {
const isIgnoring = this.props.matrixClient.isUserIgnored(this.props.member.userId);
const isIgnoring = this.context.matrixClient.isUserIgnored(this.props.member.userId);
this.setState({isIgnoring: isIgnoring});
},
@ -154,7 +158,7 @@ module.exports = withMatrixClient(React.createClass({
// Promise.resolve to handle transition from static result to promise; can be removed
// in future
Promise.resolve(this.props.matrixClient.getStoredDevicesForUser(userId)).then((devices) => {
Promise.resolve(this.context.matrixClient.getStoredDevicesForUser(userId)).then((devices) => {
this.setState({
devices: devices,
e2eStatus: this._getE2EStatus(devices),
@ -188,7 +192,7 @@ module.exports = withMatrixClient(React.createClass({
onRoomReceipt: function(receiptEvent, room) {
// because if we read a notification, it will affect notification count
// only bother updating if there's a receipt from us
if (findReadReceiptFromUserId(receiptEvent, this.props.matrixClient.credentials.userId)) {
if (findReadReceiptFromUserId(receiptEvent, this.context.matrixClient.credentials.userId)) {
this.forceUpdate();
}
},
@ -233,7 +237,7 @@ module.exports = withMatrixClient(React.createClass({
let cancelled = false;
this._cancelDeviceList = function() { cancelled = true; };
const client = this.props.matrixClient;
const client = this.context.matrixClient;
const self = this;
client.downloadKeys([member.userId], true).then(() => {
return client.getStoredDevicesForUser(member.userId);
@ -258,7 +262,7 @@ module.exports = withMatrixClient(React.createClass({
},
onIgnoreToggle: function() {
const ignoredUsers = this.props.matrixClient.getIgnoredUsers();
const ignoredUsers = this.context.matrixClient.getIgnoredUsers();
if (this.state.isIgnoring) {
const index = ignoredUsers.indexOf(this.props.member.userId);
if (index !== -1) ignoredUsers.splice(index, 1);
@ -266,7 +270,7 @@ module.exports = withMatrixClient(React.createClass({
ignoredUsers.push(this.props.member.userId);
}
this.props.matrixClient.setIgnoredUsers(ignoredUsers).then(() => {
this.context.matrixClient.setIgnoredUsers(ignoredUsers).then(() => {
return this.setState({isIgnoring: !this.state.isIgnoring});
});
},
@ -284,7 +288,7 @@ module.exports = withMatrixClient(React.createClass({
if (!proceed) return;
this.setState({ updating: this.state.updating + 1 });
this.props.matrixClient.kick(
this.context.matrixClient.kick(
this.props.member.roomId, this.props.member.userId,
reason || undefined,
).then(function() {
@ -320,11 +324,11 @@ module.exports = withMatrixClient(React.createClass({
this.setState({ updating: this.state.updating + 1 });
let promise;
if (this.props.member.membership === 'ban') {
promise = this.props.matrixClient.unban(
promise = this.context.matrixClient.unban(
this.props.member.roomId, this.props.member.userId,
);
} else {
promise = this.props.matrixClient.ban(
promise = this.context.matrixClient.ban(
this.props.member.roomId, this.props.member.userId,
reason || undefined,
);
@ -370,11 +374,11 @@ module.exports = withMatrixClient(React.createClass({
const ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
const roomId = this.props.member.roomId;
const target = this.props.member.userId;
const room = this.props.matrixClient.getRoom(roomId);
const room = this.context.matrixClient.getRoom(roomId);
if (!room) return;
// if muting self, warn as it may be irreversible
if (target === this.props.matrixClient.getUserId()) {
if (target === this.context.matrixClient.getUserId()) {
try {
if (!(await this._warnSelfDemote())) return;
} catch (e) {
@ -402,7 +406,7 @@ module.exports = withMatrixClient(React.createClass({
if (!isNaN(level)) {
this.setState({ updating: this.state.updating + 1 });
this.props.matrixClient.setPowerLevel(roomId, target, level, powerLevelEvent).then(
this.context.matrixClient.setPowerLevel(roomId, target, level, powerLevelEvent).then(
function() {
// NO-OP; rely on the m.room.member event coming down else we could
// get out of sync if we force setState here!
@ -424,13 +428,13 @@ module.exports = withMatrixClient(React.createClass({
const ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
const roomId = this.props.member.roomId;
const target = this.props.member.userId;
const room = this.props.matrixClient.getRoom(roomId);
const room = this.context.matrixClient.getRoom(roomId);
if (!room) return;
const powerLevelEvent = room.currentState.getStateEvents("m.room.power_levels", "");
if (!powerLevelEvent) return;
const me = room.getMember(this.props.matrixClient.credentials.userId);
const me = room.getMember(this.context.matrixClient.credentials.userId);
if (!me) return;
const defaultLevel = powerLevelEvent.getContent().users_default;
@ -439,7 +443,7 @@ module.exports = withMatrixClient(React.createClass({
// toggle the level
const newLevel = this.state.isTargetMod ? defaultLevel : modLevel;
this.setState({ updating: this.state.updating + 1 });
this.props.matrixClient.setPowerLevel(roomId, target, parseInt(newLevel), powerLevelEvent).then(
this.context.matrixClient.setPowerLevel(roomId, target, parseInt(newLevel), powerLevelEvent).then(
function() {
// NO-OP; rely on the m.room.member event coming down else we could
// get out of sync if we force setState here!
@ -462,7 +466,7 @@ module.exports = withMatrixClient(React.createClass({
_applyPowerChange: function(roomId, target, powerLevel, powerLevelEvent) {
this.setState({ updating: this.state.updating + 1 });
this.props.matrixClient.setPowerLevel(roomId, target, parseInt(powerLevel), powerLevelEvent).then(
this.context.matrixClient.setPowerLevel(roomId, target, parseInt(powerLevel), powerLevelEvent).then(
function() {
// NO-OP; rely on the m.room.member event coming down else we could
// get out of sync if we force setState here!
@ -483,7 +487,7 @@ module.exports = withMatrixClient(React.createClass({
onPowerChange: async function(powerLevel) {
const roomId = this.props.member.roomId;
const target = this.props.member.userId;
const room = this.props.matrixClient.getRoom(roomId);
const room = this.context.matrixClient.getRoom(roomId);
if (!room) return;
const powerLevelEvent = room.currentState.getStateEvents("m.room.power_levels", "");
@ -494,7 +498,7 @@ module.exports = withMatrixClient(React.createClass({
return;
}
const myUserId = this.props.matrixClient.getUserId();
const myUserId = this.context.matrixClient.getUserId();
const QuestionDialog = sdk.getComponent("dialogs.QuestionDialog");
// If we are changing our own PL it can only ever be decreasing, which we cannot reverse.
@ -549,13 +553,13 @@ module.exports = withMatrixClient(React.createClass({
can: {},
muted: false,
};
const room = this.props.matrixClient.getRoom(member.roomId);
const room = this.context.matrixClient.getRoom(member.roomId);
if (!room) return defaultPerms;
const powerLevels = room.currentState.getStateEvents("m.room.power_levels", "");
if (!powerLevels) return defaultPerms;
const me = room.getMember(this.props.matrixClient.credentials.userId);
const me = room.getMember(this.context.matrixClient.credentials.userId);
if (!me) return defaultPerms;
const them = member;
@ -619,7 +623,7 @@ module.exports = withMatrixClient(React.createClass({
const avatarUrl = member.getMxcAvatarUrl();
if (!avatarUrl) return;
const httpUrl = this.props.matrixClient.mxcUrlToHttp(avatarUrl);
const httpUrl = this.context.matrixClient.mxcUrlToHttp(avatarUrl);
const ImageView = sdk.getComponent("elements.ImageView");
const params = {
src: httpUrl,
@ -678,7 +682,7 @@ module.exports = withMatrixClient(React.createClass({
},
_renderUserOptions: function() {
const cli = this.props.matrixClient;
const cli = this.context.matrixClient;
const member = this.props.member;
let ignoreButton = null;
@ -784,8 +788,8 @@ module.exports = withMatrixClient(React.createClass({
let giveModButton;
let spinner;
if (this.props.member.userId !== this.props.matrixClient.credentials.userId) {
const dmRoomMap = new DMRoomMap(this.props.matrixClient);
if (this.props.member.userId !== this.context.matrixClient.credentials.userId) {
const dmRoomMap = new DMRoomMap(this.context.matrixClient);
// dmRooms will not include dmRooms that we have been invited into but did not join.
// Because DMRoomMap runs off account_data[m.direct] which is only set on join of dm room.
// XXX: we potentially want DMs we have been invited to, to also show up here :L
@ -796,7 +800,7 @@ module.exports = withMatrixClient(React.createClass({
const tiles = [];
for (const roomId of dmRooms) {
const room = this.props.matrixClient.getRoom(roomId);
const room = this.context.matrixClient.getRoom(roomId);
if (room) {
const myMembership = room.getMyMembership();
// not a DM room if we have are not joined
@ -918,12 +922,12 @@ module.exports = withMatrixClient(React.createClass({
}
}
const room = this.props.matrixClient.getRoom(this.props.member.roomId);
const room = this.context.matrixClient.getRoom(this.props.member.roomId);
const powerLevelEvent = room ? room.currentState.getStateEvents("m.room.power_levels", "") : null;
const powerLevelUsersDefault = powerLevelEvent ? powerLevelEvent.getContent().users_default : 0;
const enablePresenceByHsUrl = SdkConfig.get()["enable_presence_by_hs_url"];
const hsUrl = this.props.matrixClient.baseUrl;
const hsUrl = this.context.matrixClient.baseUrl;
let showPresence = true;
if (enablePresenceByHsUrl && enablePresenceByHsUrl[hsUrl] !== undefined) {
showPresence = enablePresenceByHsUrl[hsUrl];
@ -962,7 +966,7 @@ module.exports = withMatrixClient(React.createClass({
</div>
</div>;
const isEncrypted = this.props.matrixClient.isRoomEncrypted(this.props.member.roomId);
const isEncrypted = this.context.matrixClient.isRoomEncrypted(this.props.member.roomId);
if (this.state.e2eStatus && isEncrypted) {
e2eIconElement = (<E2EIcon status={this.state.e2eStatus} isUser={true} />);
}
@ -971,7 +975,7 @@ module.exports = withMatrixClient(React.createClass({
const avatarUrl = this.props.member.getMxcAvatarUrl();
let avatarElement;
if (avatarUrl) {
const httpUrl = this.props.matrixClient.mxcUrlToHttp(avatarUrl, 800, 800);
const httpUrl = this.context.matrixClient.mxcUrlToHttp(avatarUrl, 800, 800);
avatarElement = <div className="mx_MemberInfo_avatar">
<img src={httpUrl} />
</div>;
@ -1020,4 +1024,4 @@ module.exports = withMatrixClient(React.createClass({
</div>
);
},
}));
});