OpenCloud
/
element-web
mirror of https://github.com/vector-im/element-web
1
0
Fork 0
Code Issues Releases Wiki Activity

Remove withMatrixClient as we are committed to using Contexts 

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
pull/21833/head
Michael Telatynski 2019-08-05 12:26:31 +01:00
parent f80cbebb9d
commit 224dac3ffb
6 changed files with 73 additions and 108 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
src/components/structures/MyGroups.js
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>;
},
}));
});

3
src/components/views/elements/Flair.js
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,
};

14
src/components/views/groups/GroupMemberTile.js
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({
/>
);
},
}));
});

30
src/components/views/rooms/EventTile.js
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'];

76
src/components/views/rooms/MemberInfo.js
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>
);
},
}));
});

41
src/wrappers/withMatrixClient.js
View File

@ -1,41 +0,0 @@
/*
Copyright 2015, 2016 OpenMarket Ltd
Copyright 2017 Vector Creations Ltd
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 * as Matrix from 'matrix-js-sdk';
import React from 'react';
import PropTypes from 'prop-types';
/**
* Wraps a react class, pulling the MatrixClient from the context and adding it
* as a 'matrixClient' property instead.
*
* This abstracts the use of the context API, so that we can use a different
* mechanism in future.
*/
export default function(WrappedComponent) {
return React.createClass({
displayName: "withMatrixClient<" + WrappedComponent.displayName + ">",
contextTypes: {
matrixClient: PropTypes.instanceOf(Matrix.MatrixClient).isRequired,
},
render: function() {
return <WrappedComponent {...this.props} matrixClient={this.context.matrixClient} />;
},
});
}