From c08600d0aa860852f73b0f76e5ba31bfdfcc89b8 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C5=A0imon=20Brandner?= Date: Wed, 7 Jul 2021 17:11:23 +0200 Subject: [PATCH 01/13] Add DisambiguatedProfile MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: Šimon Brandner --- res/css/_components.scss | 2 +- res/css/structures/_FilePanel.scss | 2 +- res/css/structures/_NotificationPanel.scss | 2 +- ...rofile.scss => _DisambiguatedProfile.scss} | 5 +- res/css/views/rooms/_EventTile.scss | 4 +- res/css/views/rooms/_GroupLayout.scss | 4 +- res/css/views/rooms/_IRCLayout.scss | 14 ++--- .../views/messages/DisambiguatedProfile.tsx | 54 +++++++++++++++++++ .../views/messages/SenderProfile.tsx | 38 ++++--------- .../end-to-end-tests/src/usecases/timeline.js | 2 +- 10 files changed, 83 insertions(+), 44 deletions(-) rename res/css/views/messages/{_SenderProfile.scss => _DisambiguatedProfile.scss} (84%) create mode 100644 src/components/views/messages/DisambiguatedProfile.tsx diff --git a/res/css/_components.scss b/res/css/_components.scss index 389be11c602..ceafdfa0f23 100644 --- a/res/css/_components.scss +++ b/res/css/_components.scss @@ -177,7 +177,7 @@ @import "./views/messages/_ReactionsRowButton.scss"; @import "./views/messages/_RedactedBody.scss"; @import "./views/messages/_RoomAvatarEvent.scss"; -@import "./views/messages/_SenderProfile.scss"; +@import "./views/messages/_DisambiguatedProfile.scss"; @import "./views/messages/_TextualEvent.scss"; @import "./views/messages/_UnknownBody.scss"; @import "./views/messages/_ViewSourceEvent.scss"; diff --git a/res/css/structures/_FilePanel.scss b/res/css/structures/_FilePanel.scss index 7b975110e12..ebd4745c891 100644 --- a/res/css/structures/_FilePanel.scss +++ b/res/css/structures/_FilePanel.scss @@ -88,7 +88,7 @@ limitations under the License. text-decoration: none; } -.mx_FilePanel .mx_EventTile .mx_SenderProfile { +.mx_FilePanel .mx_EventTile .mx_DisambiguatedProfile { flex: 1 1 auto; line-height: initial; padding: 0px; diff --git a/res/css/structures/_NotificationPanel.scss b/res/css/structures/_NotificationPanel.scss index e54feca175d..69c5e86cf5f 100644 --- a/res/css/structures/_NotificationPanel.scss +++ b/res/css/structures/_NotificationPanel.scss @@ -77,7 +77,7 @@ limitations under the License. display: none; // we don't need this in this view } -.mx_NotificationPanel .mx_EventTile .mx_SenderProfile, +.mx_NotificationPanel .mx_EventTile .mx_DisambiguatedProfile, .mx_NotificationPanel .mx_EventTile .mx_MessageTimestamp { color: $primary-fg-color; font-size: $font-12px; diff --git a/res/css/views/messages/_SenderProfile.scss b/res/css/views/messages/_DisambiguatedProfile.scss similarity index 84% rename from res/css/views/messages/_SenderProfile.scss rename to res/css/views/messages/_DisambiguatedProfile.scss index 08644b14e3f..0d2f10e43d3 100644 --- a/res/css/views/messages/_SenderProfile.scss +++ b/res/css/views/messages/_DisambiguatedProfile.scss @@ -1,5 +1,6 @@ /* Copyright 2015, 2016 OpenMarket Ltd +Copyright 2021 Šimon Brandner Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. @@ -14,11 +15,11 @@ See the License for the specific language governing permissions and limitations under the License. */ -.mx_SenderProfile_displayName { +.mx_DisambiguatedProfile_displayName { font-weight: 600; } -.mx_SenderProfile_mxid { +.mx_DisambiguatedProfile_mxid { font-weight: 600; font-size: 1.1rem; margin-left: 5px; diff --git a/res/css/views/rooms/_EventTile.scss b/res/css/views/rooms/_EventTile.scss index 27a83e58f85..d756b89390b 100644 --- a/res/css/views/rooms/_EventTile.scss +++ b/res/css/views/rooms/_EventTile.scss @@ -55,7 +55,7 @@ $hover-select-border: 4px; background-color: $header-panel-bg-color; } -.mx_EventTile .mx_SenderProfile { +.mx_EventTile .mx_DisambiguatedProfile { color: $primary-fg-color; font-size: $font-14px; display: inline-block; /* anti-zalgo, with overflow hidden */ @@ -70,7 +70,7 @@ $hover-select-border: 4px; max-width: calc(100% - $left-gutter); } -.mx_EventTile .mx_SenderProfile .mx_Flair { +.mx_EventTile .mx_DisambiguatedProfile .mx_Flair { opacity: 0.7; margin-left: 5px; display: inline-block; diff --git a/res/css/views/rooms/_GroupLayout.scss b/res/css/views/rooms/_GroupLayout.scss index ddee81a914b..250bc1b1917 100644 --- a/res/css/views/rooms/_GroupLayout.scss +++ b/res/css/views/rooms/_GroupLayout.scss @@ -19,7 +19,7 @@ $left-gutter: 64px; .mx_GroupLayout { .mx_EventTile { - > .mx_SenderProfile { + > .mx_DisambiguatedProfile { line-height: $font-20px; margin-left: $left-gutter; } @@ -64,7 +64,7 @@ $left-gutter: 64px; } } - .mx_SenderProfile { + .mx_DisambiguatedProfile { font-size: $font-13px; } diff --git a/res/css/views/rooms/_IRCLayout.scss b/res/css/views/rooms/_IRCLayout.scss index 5e61c3b8a39..2f05d5534dd 100644 --- a/res/css/views/rooms/_IRCLayout.scss +++ b/res/css/views/rooms/_IRCLayout.scss @@ -162,7 +162,7 @@ $irc-line-height: $font-18px; border-left: 0; } - .mx_SenderProfile { + .mx_DisambiguatedProfile { width: var(--name-width); display: flex; order: 2; @@ -170,34 +170,34 @@ $irc-line-height: $font-18px; justify-content: flex-start; align-items: center; - > .mx_SenderProfile_displayName { + > .mx_DisambiguatedProfile_displayName { width: 100%; text-align: end; overflow: hidden; text-overflow: ellipsis; } - > .mx_SenderProfile_mxid { + > .mx_DisambiguatedProfile_mxid { visibility: collapse; } } - .mx_SenderProfile:hover { + .mx_DisambiguatedProfile:hover { overflow: visible; z-index: 10; - > .mx_SenderProfile_displayName { + > .mx_DisambiguatedProfile_displayName { overflow: visible; } - > .mx_SenderProfile_mxid { + > .mx_DisambiguatedProfile_mxid { visibility: visible; } } .mx_ReplyThread { margin: 0; - .mx_SenderProfile { + .mx_DisambiguatedProfile { width: unset; max-width: var(--name-width); background: transparent; diff --git a/src/components/views/messages/DisambiguatedProfile.tsx b/src/components/views/messages/DisambiguatedProfile.tsx new file mode 100644 index 00000000000..e865a33c881 --- /dev/null +++ b/src/components/views/messages/DisambiguatedProfile.tsx @@ -0,0 +1,54 @@ +/* +Copyright 2021 Šimon Brandner + +Licensed under the Apache License, Version 2.0 (the "License"); +you may not use this file except in compliance with the License. +You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + +Unless required by applicable law or agreed to in writing, software +distributed under the License is distributed on an "AS IS" BASIS, +WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +See the License for the specific language governing permissions and +limitations under the License. +*/ + +import React from 'react'; +import { RoomMember } from 'matrix-js-sdk/src/models/room-member'; +import { getUserNameColorClass } from '../../../utils/FormattingUtils'; + +interface IProps { + member?: RoomMember + fallbackName: string; + flair?: JSX.Element; + onClick?(): void; +} + +export default class DisambiguatedProfile extends React.Component { + render() { + const { fallbackName, member, flair, onClick } = this.props; + const colorClass = getUserNameColorClass(fallbackName); + const rawDisplayName = member?.rawDisplayName || fallbackName; + const mxid = member?.userId || fallbackName; + + let mxidElement; + if (member?.disambiguate) { + mxidElement = ( + + { mxid } + + ); + } + + return ( +
+ + { rawDisplayName } + + { mxidElement } + { flair } +
+ ); + } +} diff --git a/src/components/views/messages/SenderProfile.tsx b/src/components/views/messages/SenderProfile.tsx index 11c3ca4e3cd..d6776fcb7ee 100644 --- a/src/components/views/messages/SenderProfile.tsx +++ b/src/components/views/messages/SenderProfile.tsx @@ -17,10 +17,11 @@ import React from 'react'; import Flair from '../elements/Flair'; import FlairStore from '../../../stores/FlairStore'; -import { getUserNameColorClass } from '../../../utils/FormattingUtils'; import MatrixClientContext from "../../../contexts/MatrixClientContext"; import { replaceableComponent } from "../../../utils/replaceableComponent"; import { MatrixEvent } from "matrix-js-sdk/src/models/event"; +import DisambiguatedProfile from "./DisambiguatedProfile"; +import { MsgType } from '../../../../../matrix-js-sdk/src/@types/event'; interface IProps { mxEvent: MatrixEvent; @@ -105,26 +106,10 @@ export default class SenderProfile extends React.Component { } render() { - const { mxEvent } = this.props; - const colorClass = getUserNameColorClass(mxEvent.getSender()); - const { msgtype } = mxEvent.getContent(); + const { mxEvent, onClick } = this.props; - const disambiguate = mxEvent.sender?.disambiguate; - const displayName = mxEvent.sender?.rawDisplayName || mxEvent.getSender() || ""; - const mxid = mxEvent.sender?.userId || mxEvent.getSender() || ""; - - if (msgtype === 'm.emote') { - return null; // emote message must include the name so don't duplicate it - } - - let mxidElement; - if (disambiguate) { - mxidElement = ( - - { mxid } - - ); - } + // emote message must include the name so don't duplicate it + if (mxEvent.getContent()?.msgtype === MsgType.Emote) return null; let flair; if (this.props.enableFlair) { @@ -139,13 +124,12 @@ export default class SenderProfile extends React.Component { } return ( -
- - { displayName } - - { mxidElement } - { flair } -
+ ); } } diff --git a/test/end-to-end-tests/src/usecases/timeline.js b/test/end-to-end-tests/src/usecases/timeline.js index f9d7300ff1c..0072d8cf66c 100644 --- a/test/end-to-end-tests/src/usecases/timeline.js +++ b/test/end-to-end-tests/src/usecases/timeline.js @@ -121,7 +121,7 @@ function getAllEventTiles(session) { } async function getMessageFromEventTile(eventTile) { - const senderElement = await eventTile.$(".mx_SenderProfile_displayName"); + const senderElement = await eventTile.$(".mx_DisambiguatedProfile_displayName"); const className = await (await eventTile.getProperty("className")).jsonValue(); const classNames = className.split(" "); const bodyElement = await eventTile.$(".mx_EventTile_body"); From d00f095a2f2e8479d6cc5e742e3b86b36953ef60 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C5=A0imon=20Brandner?= Date: Wed, 7 Jul 2021 17:50:34 +0200 Subject: [PATCH 02/13] Give DisambiguatedProfile some nice options MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: Šimon Brandner --- .../views/messages/DisambiguatedProfile.tsx | 18 +++++++++++++++--- .../views/messages/SenderProfile.tsx | 2 ++ 2 files changed, 17 insertions(+), 3 deletions(-) diff --git a/src/components/views/messages/DisambiguatedProfile.tsx b/src/components/views/messages/DisambiguatedProfile.tsx index e865a33c881..09d216d72f9 100644 --- a/src/components/views/messages/DisambiguatedProfile.tsx +++ b/src/components/views/messages/DisambiguatedProfile.tsx @@ -17,21 +17,28 @@ limitations under the License. import React from 'react'; import { RoomMember } from 'matrix-js-sdk/src/models/room-member'; import { getUserNameColorClass } from '../../../utils/FormattingUtils'; +import classNames from 'classnames'; interface IProps { member?: RoomMember fallbackName: string; flair?: JSX.Element; onClick?(): void; + colored?: boolean; + emphasizeDisplayName?: boolean; } export default class DisambiguatedProfile extends React.Component { render() { - const { fallbackName, member, flair, onClick } = this.props; - const colorClass = getUserNameColorClass(fallbackName); + const { fallbackName, member, flair, colored, emphasizeDisplayName, onClick } = this.props; const rawDisplayName = member?.rawDisplayName || fallbackName; const mxid = member?.userId || fallbackName; + let colorClass; + if (colored) { + colorClass = getUserNameColorClass(fallbackName); + } + let mxidElement; if (member?.disambiguate) { mxidElement = ( @@ -41,9 +48,14 @@ export default class DisambiguatedProfile extends React.Component { ); } + const displayNameClasses = classNames({ + "mx_DisambiguatedProfile_displayName": emphasizeDisplayName, + [colorClass]: true, + }); + return (
- + { rawDisplayName } { mxidElement } diff --git a/src/components/views/messages/SenderProfile.tsx b/src/components/views/messages/SenderProfile.tsx index d6776fcb7ee..e05f68becee 100644 --- a/src/components/views/messages/SenderProfile.tsx +++ b/src/components/views/messages/SenderProfile.tsx @@ -129,6 +129,8 @@ export default class SenderProfile extends React.Component { flair={flair} onClick={onClick} member={mxEvent.sender} + colored={true} + emphasizeDisplayName={true} /> ); } From d26c82c90f292757ae4d9764cec3b9c73c1d596e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C5=A0imon=20Brandner?= Date: Wed, 7 Jul 2021 17:58:03 +0200 Subject: [PATCH 03/13] Delint MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: Šimon Brandner --- src/components/views/messages/DisambiguatedProfile.tsx | 2 +- src/components/views/messages/SenderProfile.tsx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/views/messages/DisambiguatedProfile.tsx b/src/components/views/messages/DisambiguatedProfile.tsx index 09d216d72f9..d7d5e274449 100644 --- a/src/components/views/messages/DisambiguatedProfile.tsx +++ b/src/components/views/messages/DisambiguatedProfile.tsx @@ -20,7 +20,7 @@ import { getUserNameColorClass } from '../../../utils/FormattingUtils'; import classNames from 'classnames'; interface IProps { - member?: RoomMember + member?: RoomMember; fallbackName: string; flair?: JSX.Element; onClick?(): void; diff --git a/src/components/views/messages/SenderProfile.tsx b/src/components/views/messages/SenderProfile.tsx index e05f68becee..87bb31592c4 100644 --- a/src/components/views/messages/SenderProfile.tsx +++ b/src/components/views/messages/SenderProfile.tsx @@ -21,7 +21,7 @@ import MatrixClientContext from "../../../contexts/MatrixClientContext"; import { replaceableComponent } from "../../../utils/replaceableComponent"; import { MatrixEvent } from "matrix-js-sdk/src/models/event"; import DisambiguatedProfile from "./DisambiguatedProfile"; -import { MsgType } from '../../../../../matrix-js-sdk/src/@types/event'; +import { MsgType } from 'matrix-js-sdk/src/@types/event'; interface IProps { mxEvent: MatrixEvent; From d726963ce62e2c79580fd1443a81055d2c259dc7 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C5=A0imon=20Brandner?= Date: Wed, 7 Jul 2021 17:59:17 +0200 Subject: [PATCH 04/13] Use DisambiguatedProfile in member tile MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: Šimon Brandner --- src/components/views/rooms/EntityTile.tsx | 3 ++- src/components/views/rooms/MemberTile.tsx | 9 +++++++++ 2 files changed, 11 insertions(+), 1 deletion(-) diff --git a/src/components/views/rooms/EntityTile.tsx b/src/components/views/rooms/EntityTile.tsx index 74738c36839..4538318ef7c 100644 --- a/src/components/views/rooms/EntityTile.tsx +++ b/src/components/views/rooms/EntityTile.tsx @@ -63,6 +63,7 @@ function presenceClassForMember(presenceState: string, lastActiveAgo: number, sh interface IProps { name?: string; + nameJSX?: JSX.Element; title?: string; avatarJsx?: JSX.Element; // className?: string; @@ -116,7 +117,7 @@ export default class EntityTile extends React.PureComponent { mainClassNames[presenceClass] = true; let nameEl; - const { name } = this.props; + const name = this.props.nameJSX || this.props.name; if (!this.props.suppressOnHover) { const activeAgo = this.props.presenceLastActiveAgo ? diff --git a/src/components/views/rooms/MemberTile.tsx b/src/components/views/rooms/MemberTile.tsx index ce571f78add..b4d3760bcbc 100644 --- a/src/components/views/rooms/MemberTile.tsx +++ b/src/components/views/rooms/MemberTile.tsx @@ -28,6 +28,7 @@ import { EventType } from "matrix-js-sdk/src/@types/event"; import { DeviceInfo } from "matrix-js-sdk/src/crypto/deviceinfo"; import EntityTile, { PowerStatus } from "./EntityTile"; import MemberAvatar from "./../avatars/MemberAvatar"; +import DisambiguatedProfile from "../messages/DisambiguatedProfile"; interface IProps { member: RoomMember; @@ -252,6 +253,13 @@ export default class MemberTile extends React.Component { e2eStatus = this.state.e2eStatus; } + const nameJSX = ( + + ); + return ( { avatarJsx={av} title={this.getPowerLabel()} name={name} + nameJSX={nameJSX} powerStatus={powerStatus} showPresence={this.props.showPresence} subtextLabel={statusMessage} From f002ec1dd1a292b47a1c4d5b8d7d27df5d17032a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C5=A0imon=20Brandner?= Date: Wed, 7 Jul 2021 17:59:32 +0200 Subject: [PATCH 05/13] Basic handling of text overflow MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: Šimon Brandner --- .../views/messages/_DisambiguatedProfile.scss | 21 ++++++++++++------- 1 file changed, 13 insertions(+), 8 deletions(-) diff --git a/res/css/views/messages/_DisambiguatedProfile.scss b/res/css/views/messages/_DisambiguatedProfile.scss index 0d2f10e43d3..c079fd48f67 100644 --- a/res/css/views/messages/_DisambiguatedProfile.scss +++ b/res/css/views/messages/_DisambiguatedProfile.scss @@ -15,13 +15,18 @@ See the License for the specific language governing permissions and limitations under the License. */ -.mx_DisambiguatedProfile_displayName { - font-weight: 600; -} +.mx_DisambiguatedProfile { + overflow: hidden; + text-overflow: ellipsis; + + .mx_DisambiguatedProfile_displayName { + font-weight: 600; + } -.mx_DisambiguatedProfile_mxid { - font-weight: 600; - font-size: 1.1rem; - margin-left: 5px; - opacity: 0.5; // Match mx_TextualEvent + .mx_DisambiguatedProfile_mxid { + font-weight: 600; + font-size: 1.1rem; + margin-left: 5px; + opacity: 0.5; // Match mx_TextualEvent + } } From f86828db9bf1acf72137ab7bd27d6228bf6aad93 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C5=A0imon=20Brandner?= Date: Wed, 7 Jul 2021 18:23:37 +0200 Subject: [PATCH 06/13] Use name instead of rawDisplayName MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: Šimon Brandner --- src/components/views/rooms/MemberTile.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/views/rooms/MemberTile.tsx b/src/components/views/rooms/MemberTile.tsx index b4d3760bcbc..ed4370fab2b 100644 --- a/src/components/views/rooms/MemberTile.tsx +++ b/src/components/views/rooms/MemberTile.tsx @@ -256,7 +256,7 @@ export default class MemberTile extends React.Component { const nameJSX = ( ); From fc3a68e62ea575192f633d9081e81870e0f3f7a7 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C5=A0imon=20Brandner?= Date: Wed, 7 Jul 2021 18:25:48 +0200 Subject: [PATCH 07/13] This seems to make more sense MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: Šimon Brandner --- src/components/views/messages/DisambiguatedProfile.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/views/messages/DisambiguatedProfile.tsx b/src/components/views/messages/DisambiguatedProfile.tsx index d7d5e274449..7f81ef2278a 100644 --- a/src/components/views/messages/DisambiguatedProfile.tsx +++ b/src/components/views/messages/DisambiguatedProfile.tsx @@ -32,7 +32,7 @@ export default class DisambiguatedProfile extends React.Component { render() { const { fallbackName, member, flair, colored, emphasizeDisplayName, onClick } = this.props; const rawDisplayName = member?.rawDisplayName || fallbackName; - const mxid = member?.userId || fallbackName; + const mxid = member?.userId; let colorClass; if (colored) { @@ -40,7 +40,7 @@ export default class DisambiguatedProfile extends React.Component { } let mxidElement; - if (member?.disambiguate) { + if (member?.disambiguate && mxid) { mxidElement = ( { mxid } From 722316cd04365c8aa12404db449a3e9c00733cc8 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C5=A0imon=20Brandner?= Date: Tue, 20 Jul 2021 14:45:07 +0200 Subject: [PATCH 08/13] Reodred MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: Šimon Brandner --- res/css/views/rooms/_EventTile.scss | 29 +++++++++++++++-------------- 1 file changed, 15 insertions(+), 14 deletions(-) diff --git a/res/css/views/rooms/_EventTile.scss b/res/css/views/rooms/_EventTile.scss index 20a9060c827..b54eecf67ca 100644 --- a/res/css/views/rooms/_EventTile.scss +++ b/res/css/views/rooms/_EventTile.scss @@ -69,6 +69,21 @@ $hover-select-border: 4px; max-width: calc(100% - $left-gutter); } + .mx_DisambiguatedProfile .mx_Flair { + opacity: 0.7; + margin-left: 5px; + display: inline-block; + vertical-align: top; + overflow: hidden; + user-select: none; + + img { + vertical-align: -2px; + margin-right: 2px; + border-radius: 8px; + } + } + .mx_DisambiguatedProfile { color: $primary-fg-color; font-size: $font-14px; @@ -100,20 +115,6 @@ $hover-select-border: 4px; clear: both; } - .mx_DisambiguatedProfile .mx_Flair { - opacity: 0.7; - margin-left: 5px; - display: inline-block; - vertical-align: top; - overflow: hidden; - user-select: none; - - img { - vertical-align: -2px; - margin-right: 2px; - border-radius: 8px; - } - .mx_EventTile_line, .mx_EventTile_reply { position: relative; padding-left: $left-gutter; From a2883cf282c0e64806c28cc2ec4afcbb521258af Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C5=A0imon=20Brandner?= Date: Thu, 22 Jul 2021 07:50:18 +0200 Subject: [PATCH 09/13] rethemedex MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: Šimon Brandner --- res/css/_components.scss | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/res/css/_components.scss b/res/css/_components.scss index 72128cf6ec0..cfcd211d942 100644 --- a/res/css/_components.scss +++ b/res/css/_components.scss @@ -161,6 +161,7 @@ @import "./views/groups/_GroupUserSettings.scss"; @import "./views/messages/_CreateEvent.scss"; @import "./views/messages/_DateSeparator.scss"; +@import "./views/messages/_DisambiguatedProfile.scss"; @import "./views/messages/_EventTileBubble.scss"; @import "./views/messages/_MEmoteBody.scss"; @import "./views/messages/_MFileBody.scss"; @@ -180,7 +181,6 @@ @import "./views/messages/_ReactionsRowButton.scss"; @import "./views/messages/_RedactedBody.scss"; @import "./views/messages/_RoomAvatarEvent.scss"; -@import "./views/messages/_DisambiguatedProfile.scss"; @import "./views/messages/_TextualEvent.scss"; @import "./views/messages/_UnknownBody.scss"; @import "./views/messages/_ViewSourceEvent.scss"; @@ -200,8 +200,8 @@ @import "./views/rooms/_E2EIcon.scss"; @import "./views/rooms/_EditMessageComposer.scss"; @import "./views/rooms/_EntityTile.scss"; -@import "./views/rooms/_EventTile.scss"; @import "./views/rooms/_EventBubbleTile.scss"; +@import "./views/rooms/_EventTile.scss"; @import "./views/rooms/_GroupLayout.scss"; @import "./views/rooms/_IRCLayout.scss"; @import "./views/rooms/_JumpToBottomButton.scss"; From f7a0ac8229849e5745697fb1f734b287e813c5be Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C5=A0imon=20Brandner?= Date: Fri, 10 Dec 2021 16:22:17 +0100 Subject: [PATCH 10/13] Fix import MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: Šimon Brandner --- src/components/views/messages/DisambiguatedProfile.tsx | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/components/views/messages/DisambiguatedProfile.tsx b/src/components/views/messages/DisambiguatedProfile.tsx index 7f81ef2278a..8421646e56b 100644 --- a/src/components/views/messages/DisambiguatedProfile.tsx +++ b/src/components/views/messages/DisambiguatedProfile.tsx @@ -16,9 +16,10 @@ limitations under the License. import React from 'react'; import { RoomMember } from 'matrix-js-sdk/src/models/room-member'; -import { getUserNameColorClass } from '../../../utils/FormattingUtils'; import classNames from 'classnames'; +import { getUserNameColorClass } from '../../../utils/FormattingUtils'; + interface IProps { member?: RoomMember; fallbackName: string; From 60453e05326558601dd3b97ae553b455a1bce7cf Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C5=A0imon=20Brandner?= Date: Fri, 10 Dec 2021 16:31:17 +0100 Subject: [PATCH 11/13] Fix color MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: Šimon Brandner --- res/css/views/rooms/_EventTile.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/res/css/views/rooms/_EventTile.scss b/res/css/views/rooms/_EventTile.scss index 4e1f515aa45..985a1b703e7 100644 --- a/res/css/views/rooms/_EventTile.scss +++ b/res/css/views/rooms/_EventTile.scss @@ -88,7 +88,7 @@ $left-gutter: 64px; } .mx_DisambiguatedProfile { - color: $primary-fg-color; + color: $primary-content; font-size: $font-14px; display: inline-block; /* anti-zalgo, with overflow hidden */ overflow: hidden; From 8db50f81c4d7fc7e49400b31c9738d02863bdb4e Mon Sep 17 00:00:00 2001 From: Travis Ralston Date: Mon, 21 Mar 2022 19:01:21 -0600 Subject: [PATCH 12/13] Appease the linter --- src/components/views/messages/SenderProfile.tsx | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/src/components/views/messages/SenderProfile.tsx b/src/components/views/messages/SenderProfile.tsx index 8ab393e6db7..1f0c07a0770 100644 --- a/src/components/views/messages/SenderProfile.tsx +++ b/src/components/views/messages/SenderProfile.tsx @@ -24,7 +24,6 @@ import FlairStore from '../../../stores/FlairStore'; import MatrixClientContext from "../../../contexts/MatrixClientContext"; import { replaceableComponent } from "../../../utils/replaceableComponent"; import DisambiguatedProfile from "./DisambiguatedProfile"; -import UserIdentifier from '../../../customisations/UserIdentifier'; import RoomContext, { TimelineRenderingType } from '../../../contexts/RoomContext'; import SettingsStore from "../../../settings/SettingsStore"; import { MatrixClientPeg } from "../../../MatrixClientPeg"; @@ -107,6 +106,7 @@ export default class SenderProfile extends React.Component { render() { const { mxEvent, onClick } = this.props; + const msgtype = mxEvent.getContent().msgtype; let member = mxEvent.sender; if (SettingsStore.getValue("feature_use_only_current_profiles")) { @@ -123,7 +123,7 @@ export default class SenderProfile extends React.Component { ) { return null; // emote message must include the name so don't duplicate it } - + let flair; if (this.props.enableFlair) { const displayedGroups = this.getDisplayedGroups( @@ -133,7 +133,6 @@ export default class SenderProfile extends React.Component { flair = ; } - return ( Date: Mon, 21 Mar 2022 19:01:32 -0600 Subject: [PATCH 13/13] Re-apply UserIdentifier patch --- src/components/views/messages/DisambiguatedProfile.tsx | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/src/components/views/messages/DisambiguatedProfile.tsx b/src/components/views/messages/DisambiguatedProfile.tsx index 8421646e56b..b5e64d999f0 100644 --- a/src/components/views/messages/DisambiguatedProfile.tsx +++ b/src/components/views/messages/DisambiguatedProfile.tsx @@ -1,5 +1,6 @@ /* Copyright 2021 Šimon Brandner +Copyright 2022 The Matrix.org Foundation C.I.C. Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. @@ -19,6 +20,7 @@ import { RoomMember } from 'matrix-js-sdk/src/models/room-member'; import classNames from 'classnames'; import { getUserNameColorClass } from '../../../utils/FormattingUtils'; +import UserIdentifier from "../../../customisations/UserIdentifier"; interface IProps { member?: RoomMember; @@ -44,7 +46,9 @@ export default class DisambiguatedProfile extends React.Component { if (member?.disambiguate && mxid) { mxidElement = ( - { mxid } + { UserIdentifier.getDisplayUserIdentifier( + mxid, { withDisplayName: true, roomId: member.roomId }, + ) } ); }