Matrix/element-web-Github
1
0
Fork 0
mirror of https://github.com/vector-im/element-web.git synced 2024-11-15 20:54:59 +08:00
Code Issues Packages Projects Releases Wiki Activity

Update to thread UI (#7714)

Browse Source
This commit is contained in:
Germain 2022-02-03 16:24:49 +00:00 committed by GitHub
parent 78e78292cb
commit df86678798
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 15 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
res/css/views/right_panel/_ThreadPanel.scss
View File

@ -302,7 +302,7 @@ limitations under the License.
&::after {
content: "";
border: inherit;
border-bottom-color: $background;
border-bottom-color: $menu-bg-color;
position: absolute;
top: 1px;
left: -8px;

4
src/components/views/messages/SenderProfile.tsx
View File

@ -24,11 +24,13 @@ import { getUserNameColorClass } from '../../../utils/FormattingUtils';
import MatrixClientContext from "../../../contexts/MatrixClientContext";
import { replaceableComponent } from "../../../utils/replaceableComponent";
import UserIdentifier from '../../../customisations/UserIdentifier';
import { TileShape } from '../rooms/EventTile';
interface IProps {
mxEvent: MatrixEvent;
onClick?(): void;
enableFlair: boolean;
tileShape?: TileShape;
}
interface IState {
@ -109,7 +111,7 @@ export default class SenderProfile extends React.Component<IProps, IState> {
const displayName = mxEvent.sender?.rawDisplayName || mxEvent.getSender() || "";
const mxid = mxEvent.sender?.userId || mxEvent.getSender() || "";
if (msgtype === MsgType.Emote) {
if (msgtype === MsgType.Emote && this.props.tileShape !== TileShape.ThreadPanel) {
return null; // emote message must include the name so don't duplicate it
}

14
src/components/views/rooms/EventTile.tsx
View File

@ -870,6 +870,9 @@ export default class EventTile extends React.Component<IProps, IState> {
private shouldHighlight(): boolean {
if (this.props.forExport) return false;
if (this.props.tileShape === TileShape.Notif) return false;
if (this.props.tileShape === TileShape.ThreadPanel) return false;
const actions = this.context.getPushActionsForEvent(this.props.mxEvent.replacingEvent() || this.props.mxEvent);
if (!actions || !actions.tweaks) { return false; }
@ -1170,7 +1173,7 @@ export default class EventTile extends React.Component<IProps, IState> {
mx_EventTile_12hr: this.props.isTwelveHour,
// Note: we keep the `sending` state class for tests, not for our styles
mx_EventTile_sending: !isEditing && isSending,
mx_EventTile_highlight: this.props.tileShape === TileShape.Notif ? false : this.shouldHighlight(),
mx_EventTile_highlight: this.shouldHighlight(),
mx_EventTile_selected: this.props.isSelectedEvent,
mx_EventTile_continuation: isContinuation || eventType === EventType.CallInvite,
mx_EventTile_last: this.props.last,
@ -1206,7 +1209,7 @@ export default class EventTile extends React.Component<IProps, IState> {
let avatarSize;
let needsSenderProfile;
if (this.props.tileShape === TileShape.Notif) {
if (this.props.tileShape === TileShape.Notif || this.props.tileShape === TileShape.ThreadPanel) {
avatarSize = 24;
needsSenderProfile = true;
} else if (tileHandler === 'messages.RoomCreate' || isBubbleMessage) {
@ -1259,9 +1262,14 @@ export default class EventTile extends React.Component<IProps, IState> {
sender = <SenderProfile onClick={this.onSenderProfileClick}
mxEvent={this.props.mxEvent}
enableFlair={this.props.enableFlair}
tileShape={this.props.tileShape}
/>;
} else {
sender = <SenderProfile mxEvent={this.props.mxEvent} enableFlair={this.props.enableFlair} />;
sender = <SenderProfile
mxEvent={this.props.mxEvent}
enableFlair={this.props.enableFlair}
tileShape={this.props.tileShape}
/>;
}
}