mirrors/element-web
1
0
Fork 0
mirror of https://github.com/element-hq/element-web synced 2024-11-27 19:56:47 +03:00
Code Issues Projects Releases Packages Wiki Activity

Create rendering context enum for MessageActionBar

Browse source
This commit is contained in:
Germain Souquet 2021-09-28 14:55:00 +01:00
parent 160bf8e21f
commit c1165830ed
2 changed files with 14 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
src/components/views/messages/MessageActionBar.tsx
View file

@ -128,6 +128,11 @@ const ReactButton: React.FC<IReactButtonProps> = ({ mxEvent, reactions, onFocusC
</React.Fragment>; </React.Fragment>;
}; };
export enum ActionBarRenderingContext {
Room,
Thread
}
interface IMessageActionBarProps { interface IMessageActionBarProps {
mxEvent: MatrixEvent; mxEvent: MatrixEvent;
reactions?: Relations; reactions?: Relations;
@ -137,7 +142,7 @@ interface IMessageActionBarProps {
permalinkCreator?: RoomPermalinkCreator; permalinkCreator?: RoomPermalinkCreator;
onFocusChange?: (menuDisplayed: boolean) => void; onFocusChange?: (menuDisplayed: boolean) => void;
toggleThreadExpanded: () => void; toggleThreadExpanded: () => void;
isInThreadTimeline?: boolean; renderingContext?: ActionBarRenderingContext;
isQuoteExpanded?: boolean; isQuoteExpanded?: boolean;
} }
@ -146,7 +151,7 @@ export default class MessageActionBar extends React.PureComponent<IMessageAction
public static contextType = RoomContext; public static contextType = RoomContext;
public static defaultProps = { public static defaultProps = {
isInThreadTimeline: false, renderingContext: ActionBarRenderingContext.Room,
}; };
public componentDidMount(): void { public componentDidMount(): void {
@ -293,7 +298,7 @@ export default class MessageActionBar extends React.PureComponent<IMessageAction
// Like the resend button, the react and reply buttons need to appear before the edit. // Like the resend button, the react and reply buttons need to appear before the edit.
// The only catch is we do the reply button first so that we can make sure the react // The only catch is we do the reply button first so that we can make sure the react
// button is the very first button without having to do length checks for `splice()`. // button is the very first button without having to do length checks for `splice()`.
if (this.context.canReply && !this.props.isInThreadTimeline) { if (this.context.canReply && this.props.renderingContext === ActionBarRenderingContext.Room) {
toolbarOpts.splice(0, 0, <> toolbarOpts.splice(0, 0, <>
<RovingAccessibleTooltipButton <RovingAccessibleTooltipButton
className="mx_MessageActionBar_maskButton mx_MessageActionBar_replyButton" className="mx_MessageActionBar_maskButton mx_MessageActionBar_replyButton"

9
src/components/views/rooms/EventTile.tsx
View file

@ -53,7 +53,7 @@ import SenderProfile from '../messages/SenderProfile';
import MessageTimestamp from '../messages/MessageTimestamp'; import MessageTimestamp from '../messages/MessageTimestamp';
import TooltipButton from '../elements/TooltipButton'; import TooltipButton from '../elements/TooltipButton';
import ReadReceiptMarker from "./ReadReceiptMarker"; import ReadReceiptMarker from "./ReadReceiptMarker";
import MessageActionBar from "../messages/MessageActionBar"; import MessageActionBar, { ActionBarRenderingContext } from "../messages/MessageActionBar";
import ReactionsRow from '../messages/ReactionsRow'; import ReactionsRow from '../messages/ReactionsRow';
import { getEventDisplayInfo } from '../../../utils/EventUtils'; import { getEventDisplayInfo } from '../../../utils/EventUtils';
import { RightPanelPhases } from "../../../stores/RightPanelStorePhases"; import { RightPanelPhases } from "../../../stores/RightPanelStorePhases";
@ -1056,7 +1056,9 @@ export default class EventTile extends React.Component<IProps, IState> {
} }
} }
const isInThreadTimeline = this.props.tileShape === TileShape.Thread; const renderingContext = this.props.tileShape === TileShape.Thread
? ActionBarRenderingContext.Thread
: ActionBarRenderingContext.Room;
const actionBar = !isEditing ? <MessageActionBar const actionBar = !isEditing ? <MessageActionBar
mxEvent={this.props.mxEvent} mxEvent={this.props.mxEvent}
reactions={this.state.reactions} reactions={this.state.reactions}
@ -1064,7 +1066,8 @@ export default class EventTile extends React.Component<IProps, IState> {
getTile={this.getTile} getTile={this.getTile}
getReplyThread={this.getReplyThread} getReplyThread={this.getReplyThread}
onFocusChange={this.onActionBarFocusChange} onFocusChange={this.onActionBarFocusChange}
isInThreadTimeline={isInThreadTimeline} renderingContext={renderingContext}
isQuoteExpanded={isQuoteExpanded}
toggleThreadExpanded={() => this.setQuoteExpanded(!isQuoteExpanded)} toggleThreadExpanded={() => this.setQuoteExpanded(!isQuoteExpanded)}
/> : undefined; /> : undefined;