Apply tweaks to Thread list as per design spec (#8149)

Co-authored-by: Germain Souquet <germains@element.io>
This commit is contained in:
Michael Telatynski 2022-04-05 17:01:34 +01:00 committed by GitHub
parent 4f6b939426
commit 27e48062b6
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
7 changed files with 173 additions and 72 deletions

View file

@ -631,12 +631,22 @@ export class UnwrappedEventTile extends React.Component<IProps, IState> {
}
private renderThreadInfo(): React.ReactNode {
if (this.state.thread?.id === this.props.mxEvent.getId()) {
return <ThreadSummary mxEvent={this.props.mxEvent} thread={this.state.thread} />;
}
if (this.context.timelineRenderingType === TimelineRenderingType.Search && this.props.mxEvent.threadRootId) {
if (this.props.highlightLink) {
return (
<a className="mx_ThreadSummaryIcon" href={this.props.highlightLink}>
{ _t("From a thread") }
</a>
);
}
return (
<p className="mx_ThreadSummaryIcon">{ _t("From a thread") }</p>
);
} else if (this.state.thread?.id === this.props.mxEvent.getId()) {
return <ThreadSummary mxEvent={this.props.mxEvent} thread={this.state.thread} />;
}
}
@ -1100,6 +1110,7 @@ export class UnwrappedEventTile extends React.Component<IProps, IState> {
let isContinuation = this.props.continuation;
if (this.context.timelineRenderingType !== TimelineRenderingType.Room &&
this.context.timelineRenderingType !== TimelineRenderingType.Search &&
this.context.timelineRenderingType !== TimelineRenderingType.Thread &&
this.props.layout !== Layout.Bubble
) {
isContinuation = false;
@ -1146,16 +1157,17 @@ export class UnwrappedEventTile extends React.Component<IProps, IState> {
? undefined
: this.props.mxEvent.getId();
let avatar;
let sender;
let avatarSize;
let needsSenderProfile;
let avatar: JSX.Element;
let sender: JSX.Element;
let avatarSize: number;
let needsSenderProfile: boolean;
if (this.context.timelineRenderingType === TimelineRenderingType.Notification ||
this.context.timelineRenderingType === TimelineRenderingType.ThreadsList
) {
if (this.context.timelineRenderingType === TimelineRenderingType.Notification) {
avatarSize = 24;
needsSenderProfile = true;
} else if (this.context.timelineRenderingType === TimelineRenderingType.ThreadsList) {
avatarSize = 36;
needsSenderProfile = true;
} else if (tileHandler === 'messages.RoomCreate' || isBubbleMessage) {
avatarSize = 0;
needsSenderProfile = false;
@ -1364,7 +1376,8 @@ export class UnwrappedEventTile extends React.Component<IProps, IState> {
</a>
</div>,
<div className={lineClasses} key="mx_EventTile_line">
<EventTileType ref={this.tile}
<EventTileType
ref={this.tile}
mxEvent={this.props.mxEvent}
highlights={this.props.highlights}
highlightLink={this.props.highlightLink}
@ -1399,9 +1412,7 @@ export class UnwrappedEventTile extends React.Component<IProps, IState> {
</div>,
<div className="mx_EventTile_senderDetails" key="mx_EventTile_senderDetails">
{ avatar }
<a href={permalink} onClick={this.onPermalinkClicked}>
{ sender }
</a>
{ sender }
</div>,
<div className={lineClasses} key="mx_EventTile_line">
{ replyChain }
@ -1417,7 +1428,9 @@ export class UnwrappedEventTile extends React.Component<IProps, IState> {
isSeeingThroughMessageHiddenForModeration={isSeeingThroughMessageHiddenForModeration}
/>
{ actionBar }
{ timestamp }
<a href={permalink} onClick={this.onPermalinkClicked}>
{ timestamp }
</a>
</div>,
reactionsRow,
]);