imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge branch 't3chguy/nvl/userinfo' of https://github.com/matrix-org/matrix-react-sdk into t3chguy/nvl/userinfo

Browse source 
 Conflicts:
	src/components/views/right_panel/UserInfo.js
This commit is contained in:
Michael Telatynski 2019-10-19 16:42:00 +01:00
commit 02f8b18346
2 changed files with 255 additions and 213 deletions
Download patch file Download diff file Expand all files Collapse all files

149
src/components/views/right_panel/UserInfo.js
View file

@ -20,7 +20,7 @@ limitations under the License.
import React, {useCallback, useMemo, useState, useEffect} from 'react'; import React, {useCallback, useMemo, useState, useEffect} from 'react';
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import classNames from 'classnames'; import classNames from 'classnames';
import {Group, MatrixClient, RoomMember, User} from 'matrix-js-sdk'; import {Group, RoomMember, User} from 'matrix-js-sdk';
import dis from '../../../dispatcher'; import dis from '../../../dispatcher';
import Modal from '../../../Modal'; import Modal from '../../../Modal';
import sdk from '../../../index'; import sdk from '../../../index';
@ -38,6 +38,7 @@ import MultiInviter from "../../../utils/MultiInviter";
import GroupStore from "../../../stores/GroupStore"; import GroupStore from "../../../stores/GroupStore";
import MatrixClientPeg from "../../../MatrixClientPeg"; import MatrixClientPeg from "../../../MatrixClientPeg";
import E2EIcon from "../rooms/E2EIcon"; import E2EIcon from "../rooms/E2EIcon";
import withLegacyMatrixClient from "../../../utils/withLegacyMatrixClient";
import {useEventEmitter} from "../../../hooks/useEventEmitter"; import {useEventEmitter} from "../../../hooks/useEventEmitter";
const _disambiguateDevices = (devices) => { const _disambiguateDevices = (devices) => {
@ -57,22 +58,12 @@ const _disambiguateDevices = (devices) => {
} }
}; };
const withLegacyMatrixClient = (Component) => class extends React.PureComponent {
static contextTypes = {
matrixClient: PropTypes.instanceOf(MatrixClient).isRequired,
};
render() {
return <Component {...this.props} cli={this.context.matrixClient} />;
}
};
const _getE2EStatus = (devices) => { const _getE2EStatus = (devices) => {
const hasUnverifiedDevice = devices.some((device) => device.isUnverified()); const hasUnverifiedDevice = devices.some((device) => device.isUnverified());
return hasUnverifiedDevice ? "warning" : "verified"; return hasUnverifiedDevice ? "warning" : "verified";
}; };
const DevicesSection = withLegacyMatrixClient(({devices, userId, loading}) => { const DevicesSection = ({devices, userId, loading}) => {
const MemberDeviceInfo = sdk.getComponent('rooms.MemberDeviceInfo'); const MemberDeviceInfo = sdk.getComponent('rooms.MemberDeviceInfo');
const Spinner = sdk.getComponent("elements.Spinner"); const Spinner = sdk.getComponent("elements.Spinner");
@ -95,7 +86,7 @@ const DevicesSection = withLegacyMatrixClient(({devices, userId, loading}) => {
</div> </div>
</div> </div>
); );
}); };
const onRoomTileClick = (roomId) => { const onRoomTileClick = (roomId) => {
dis.dispatch({ dis.dispatch({
@ -104,7 +95,7 @@ const onRoomTileClick = (roomId) => {
}); });
}; };
const DirectChatsSection = withLegacyMatrixClient(({cli, userId, startUpdating, stopUpdating}) => { const DirectChatsSection = withLegacyMatrixClient(({matrixClient: cli, userId, startUpdating, stopUpdating}) => {
const onNewDMClick = async () => { const onNewDMClick = async () => {
startUpdating(); startUpdating();
await createRoom({dmUserId: userId}); await createRoom({dmUserId: userId});
@ -194,7 +185,7 @@ const DirectChatsSection = withLegacyMatrixClient(({cli, userId, startUpdating,
); );
}); });
const UserOptionsSection = withLegacyMatrixClient(({cli, member, isIgnored, canInvite}) => { const UserOptionsSection = withLegacyMatrixClient(({matrixClient: cli, member, isIgnored, canInvite}) => {
let ignoreButton = null; let ignoreButton = null;
let insertPillButton = null; let insertPillButton = null;
let inviteUserButton = null; let inviteUserButton = null;
@ -371,24 +362,7 @@ const useRoomPowerLevels = (room) => {
return powerLevels; return powerLevels;
}; };
const RoomAdminToolsContainer = withLegacyMatrixClient(({cli, room, children, member, startUpdating, stopUpdating}) => { const RoomKickButton = withLegacyMatrixClient(({matrixClient: cli, member, startUpdating, stopUpdating}) => {
let kickButton;
let banButton;
let muteButton;
let redactButton;
const powerLevels = useRoomPowerLevels(room);
const editPowerLevel = (
(powerLevels.events ? powerLevels.events["m.room.power_levels"] : null) ||
powerLevels.state_default
);
const me = room.getMember(cli.getUserId());
const isMe = me.userId === member.userId;
const canAffectUser = member.powerLevel < me.powerLevel || isMe;
const membership = member.membership;
if (canAffectUser && me.powerLevel >= powerLevels.kick) {
const onKick = async () => { const onKick = async () => {
const ConfirmUserActionDialog = sdk.getComponent("dialogs.ConfirmUserActionDialog"); const ConfirmUserActionDialog = sdk.getComponent("dialogs.ConfirmUserActionDialog");
const {finished} = Modal.createTrackedDialog( const {finished} = Modal.createTrackedDialog(
@ -397,9 +371,9 @@ const RoomAdminToolsContainer = withLegacyMatrixClient(({cli, room, children, me
ConfirmUserActionDialog, ConfirmUserActionDialog,
{ {
member, member,
action: membership === "invite" ? _t("Disinvite") : _t("Kick"), action: member.membership === "invite" ? _t("Disinvite") : _t("Kick"),
title: membership === "invite" ? _t("Disinvite this user?") : _t("Kick this user?"), title: member.membership === "invite" ? _t("Disinvite this user?") : _t("Kick this user?"),
askReason: membership === "join", askReason: member.membership === "join",
danger: true, danger: true,
}, },
); );
@ -424,15 +398,13 @@ const RoomAdminToolsContainer = withLegacyMatrixClient(({cli, room, children, me
}); });
}; };
const kickLabel = membership === "invite" ? _t("Disinvite") : _t("Kick"); const kickLabel = member.membership === "invite" ? _t("Disinvite") : _t("Kick");
kickButton = ( return <AccessibleButton className="mx_UserInfo_field" onClick={onKick}>
<AccessibleButton className="mx_UserInfo_field"
onClick={onKick}>
{ kickLabel } { kickLabel }
</AccessibleButton> </AccessibleButton>;
); });
}
if (me.powerLevel >= powerLevels.redact) { const RedactMessagesButton = withLegacyMatrixClient(({matrixClient: cli, member}) => {
const onRedactAllMessages = async () => { const onRedactAllMessages = async () => {
const {roomId, userId} = member; const {roomId, userId} = member;
const room = cli.getRoom(roomId); const room = cli.getRoom(roomId);
@ -500,13 +472,12 @@ const RoomAdminToolsContainer = withLegacyMatrixClient(({cli, room, children, me
} }
}; };
redactButton = ( return <AccessibleButton className="mx_UserInfo_field" onClick={onRedactAllMessages}>
<AccessibleButton className="mx_UserInfo_field" onClick={onRedactAllMessages}>
{ _t("Remove recent messages") } { _t("Remove recent messages") }
</AccessibleButton> </AccessibleButton>;
); });
}
if (canAffectUser && me.powerLevel >= powerLevels.ban) { const BanToggleButton = withLegacyMatrixClient(({matrixClient: cli, member, startUpdating, stopUpdating}) => {
const onBanOrUnban = async () => { const onBanOrUnban = async () => {
const ConfirmUserActionDialog = sdk.getComponent("dialogs.ConfirmUserActionDialog"); const ConfirmUserActionDialog = sdk.getComponent("dialogs.ConfirmUserActionDialog");
const {finished} = Modal.createTrackedDialog( const {finished} = Modal.createTrackedDialog(
@ -515,10 +486,10 @@ const RoomAdminToolsContainer = withLegacyMatrixClient(({cli, room, children, me
ConfirmUserActionDialog, ConfirmUserActionDialog,
{ {
member, member,
action: membership === 'ban' ? _t("Unban") : _t("Ban"), action: member.membership === 'ban' ? _t("Unban") : _t("Ban"),
title: membership === 'ban' ? _t("Unban this user?") : _t("Ban this user?"), title: member.membership === 'ban' ? _t("Unban this user?") : _t("Ban this user?"),
askReason: membership !== 'ban', askReason: member.membership !== 'ban',
danger: membership !== 'ban', danger: member.membership !== 'ban',
}, },
); );
@ -527,7 +498,7 @@ const RoomAdminToolsContainer = withLegacyMatrixClient(({cli, room, children, me
startUpdating(); startUpdating();
let promise; let promise;
if (membership === 'ban') { if (member.membership === 'ban') {
promise = cli.unban(member.roomId, member.userId); promise = cli.unban(member.roomId, member.userId);
} else { } else {
promise = cli.ban(member.roomId, member.userId, reason || undefined); promise = cli.ban(member.roomId, member.userId, reason || undefined);
@ -549,16 +520,17 @@ const RoomAdminToolsContainer = withLegacyMatrixClient(({cli, room, children, me
}; };
let label = _t("Ban"); let label = _t("Ban");
if (membership === 'ban') { if (member.membership === 'ban') {
label = _t("Unban"); label = _t("Unban");
} }
banButton = (
<AccessibleButton className="mx_UserInfo_field" onClick={onBanOrUnban}> return <AccessibleButton className="mx_UserInfo_field" onClick={onBanOrUnban}>
{ label } { label }
</AccessibleButton> </AccessibleButton>;
); });
}
if (canAffectUser && me.powerLevel >= editPowerLevel) { const MuteToggleButton = withLegacyMatrixClient(
({matrixClient: cli, member, room, powerLevels, startUpdating, stopUpdating}) => {
const isMuted = _isMuted(member, powerLevels); const isMuted = _isMuted(member, powerLevels);
const onMuteToggle = async () => { const onMuteToggle = async () => {
const ErrorDialog = sdk.getComponent("dialogs.ErrorDialog"); const ErrorDialog = sdk.getComponent("dialogs.ErrorDialog");
@ -610,11 +582,49 @@ const RoomAdminToolsContainer = withLegacyMatrixClient(({cli, room, children, me
}; };
const muteLabel = isMuted ? _t("Unmute") : _t("Mute"); const muteLabel = isMuted ? _t("Unmute") : _t("Mute");
muteButton = ( return <AccessibleButton className="mx_UserInfo_field" onClick={onMuteToggle}>
<AccessibleButton className="mx_UserInfo_field"
onClick={onMuteToggle}>
{ muteLabel } { muteLabel }
</AccessibleButton> </AccessibleButton>;
},
);
const RoomAdminToolsContainer = withLegacyMatrixClient(
({matrixClient: cli, room, children, member, startUpdating, stopUpdating}) => {
let kickButton;
let banButton;
let muteButton;
let redactButton;
const powerLevels = useRoomPowerLevels(room);
const editPowerLevel = (
(powerLevels.events ? powerLevels.events["m.room.power_levels"] : null) ||
powerLevels.state_default
);
const me = room.getMember(cli.getUserId());
const isMe = me.userId === member.userId;
const canAffectUser = member.powerLevel < me.powerLevel || isMe;
if (canAffectUser && me.powerLevel >= powerLevels.kick) {
kickButton = <RoomKickButton member={member} startUpdating={startUpdating} stopUpdating={stopUpdating} />;
}
if (me.powerLevel >= powerLevels.redact) {
redactButton = (
<RedactMessagesButton member={member} startUpdating={startUpdating} stopUpdating={stopUpdating} />
);
}
if (canAffectUser && me.powerLevel >= powerLevels.ban) {
banButton = <BanToggleButton member={member} startUpdating={startUpdating} stopUpdating={stopUpdating} />;
}
if (canAffectUser && me.powerLevel >= editPowerLevel) {
muteButton = (
<MuteToggleButton
member={member}
room={room}
powerLevels={powerLevels}
startUpdating={startUpdating}
stopUpdating={stopUpdating}
/>
); );
} }
@ -629,10 +639,11 @@ const RoomAdminToolsContainer = withLegacyMatrixClient(({cli, room, children, me
} }
return <div />; return <div />;
}); },
);
const GroupAdminToolsSection = withLegacyMatrixClient( const GroupAdminToolsSection = withLegacyMatrixClient(
({cli, children, groupId, groupMember, startUpdating, stopUpdating}) => { ({matrixClient: cli, children, groupId, groupMember, startUpdating, stopUpdating}) => {
const [isPrivileged, setIsPrivileged] = useState(false); const [isPrivileged, setIsPrivileged] = useState(false);
const [isInvited, setIsInvited] = useState(false); const [isInvited, setIsInvited] = useState(false);
@ -734,7 +745,7 @@ const useIsSynapseAdmin = (cli) => {
}; };
// cli is injected by withLegacyMatrixClient // cli is injected by withLegacyMatrixClient
const UserInfo = withLegacyMatrixClient(({cli, user, groupId, roomId, onClose}) => { const UserInfo = withLegacyMatrixClient(({matrixClient: cli, user, groupId, roomId, onClose}) => {
// Load room if we are given a room id and memoize it // Load room if we are given a room id and memoize it
const room = useMemo(() => roomId ? cli.getRoom(roomId) : null, [cli, roomId]); const room = useMemo(() => roomId ? cli.getRoom(roomId) : null, [cli, roomId]);

31
src/utils/withLegacyMatrixClient.js Normal file
View file

@ -0,0 +1,31 @@
/*
Copyright 2019 The Matrix.org Foundation C.I.C.
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
import React from "react";
import PropTypes from "prop-types";
import {MatrixClient} from "matrix-js-sdk";
// Higher Order Component to allow use of legacy MatrixClient React Context
// in Functional Components which do not otherwise support legacy React Contexts
export default (Component) => class extends React.PureComponent {
static contextTypes = {
matrixClient: PropTypes.instanceOf(MatrixClient).isRequired,
};
render() {
return <Component {...this.props} matrixClient={this.context.matrixClient} />;
}
};