Disable quick reactions button when no permissions (#7412)
This commit is contained in:
parent
a9d1f6e616
commit
097c40b577
2 changed files with 17 additions and 11 deletions
|
@ -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} />;
|
||||
}
|
||||
|
||||
|
|
|
@ -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}
|
||||
>
|
||||
|
|
Loading…
Reference in a new issue