PrivateCoffee/element-web
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 3

Disable quick reactions button when no permissions (#7412)

Browse source
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
Show stats Download patch file Download diff file Expand all files Collapse all files

22
src/components/views/messages/ReactionsRow.tsx
View file

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

6
src/components/views/messages/ReactionsRowButton.tsx
View file

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