Disable quick reactions button when no permissions (#7412)

This commit is contained in:
Michael Telatynski 2021-12-23 12:01:40 +00:00 committed by GitHub
parent a9d1f6e616
commit 097c40b577
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 17 additions and 11 deletions

View file

@ -16,7 +16,6 @@ limitations under the License.
import React from "react";
import classNames from "classnames";
import { EventType } from "matrix-js-sdk/src/@types/event";
import { MatrixEvent } from "matrix-js-sdk/src/models/event";
import { Relations } from "matrix-js-sdk/src/models/relations";
@ -27,7 +26,7 @@ import { ContextMenuTooltipButton } from "../../../accessibility/context_menu/Co
import ContextMenu, { aboveLeftOf, useContextMenu } from "../../structures/ContextMenu";
import ReactionPicker from "../emojipicker/ReactionPicker";
import ReactionsRowButton from "./ReactionsRowButton";
import MatrixClientContext from "../../../contexts/MatrixClientContext";
import RoomContext from "../../../contexts/RoomContext";
// The maximum number of reactions to initially show on a message.
const MAX_ITEMS_WHEN_LIMITED = 8;
@ -76,10 +75,12 @@ interface IState {
@replaceableComponent("views.messages.ReactionsRow")
export default class ReactionsRow extends React.PureComponent<IProps, IState> {
static contextType = MatrixClientContext;
static contextType = RoomContext;
public context!: React.ContextType<typeof RoomContext>;
constructor(props, context) {
constructor(props: IProps, context: React.ContextType<typeof RoomContext>) {
super(props, context);
this.context = context;
this.state = {
myReactions: this.getMyReactions(),
@ -143,7 +144,7 @@ export default class ReactionsRow extends React.PureComponent<IProps, IState> {
if (!reactions) {
return null;
}
const userId = this.context.getUserId();
const userId = this.context.room.client.getUserId();
const myReactions = reactions.getAnnotationsBySender()[userId];
if (!myReactions) {
return null;
@ -165,6 +166,11 @@ export default class ReactionsRow extends React.PureComponent<IProps, IState> {
return null;
}
const cli = this.context.room.client;
const room = cli.getRoom(mxEvent.getRoomId());
const isPeeking = room.getMyMembership() !== "join";
const canReact = !isPeeking && this.context.canReact;
let items = reactions.getSortedAnnotationsByKey().map(([content, events]) => {
const count = events.size;
if (!count) {
@ -183,6 +189,7 @@ export default class ReactionsRow extends React.PureComponent<IProps, IState> {
mxEvent={mxEvent}
reactionEvents={events}
myReactionEvent={myReactionEvent}
disabled={!canReact}
/>;
}).filter(item => !!item);
@ -203,11 +210,8 @@ export default class ReactionsRow extends React.PureComponent<IProps, IState> {
</a>;
}
const cli = this.context;
let addReactionButton;
const room = cli.getRoom(mxEvent.getRoomId());
if (room.getMyMembership() === "join" && room.currentState.maySendEvent(EventType.Reaction, cli.getUserId())) {
if (room.getMyMembership() === "join" && this.context.canReact) {
addReactionButton = <ReactButton mxEvent={mxEvent} reactions={reactions} />;
}

View file

@ -37,6 +37,8 @@ interface IProps {
reactionEvents: Set<MatrixEvent>;
// A possible Matrix event if the current user has voted for this type
myReactionEvent?: MatrixEvent;
// Whether to prevent quick-reactions by clicking on this reaction
disabled?: boolean;
}
interface IState {
@ -121,12 +123,12 @@ export default class ReactionsRowButton extends React.PureComponent<IProps, ISta
label = reactors;
}
}
const isPeeking = room.getMyMembership() !== "join";
return <AccessibleButton
className={classes}
aria-label={label}
onClick={this.onClick}
disabled={isPeeking}
disabled={this.props.disabled}
onMouseOver={this.onMouseOver}
onMouseLeave={this.onMouseLeave}
>