Add customisation point for mxid display (#7595)
* add wrapping component for hiding UI Signed-off-by: Kerry Archibald <kerrya@element.io> * add Setting Signed-off-by: Kerry Archibald <kerrya@element.io> * apply setting to profile settings, user menu, invite dialog, userinfo Signed-off-by: Kerry Archibald <kerrya@element.io> * hide mxids in user autocomplete * remove mxids from title in memeber list and timeline Signed-off-by: Kerry Archibald <kerrya@element.io> * hide mxid in ConfirmUserActionDialog Signed-off-by: Kerry Archibald <kerrya@element.io> * use name in power level event message when displayMxids is falsy Signed-off-by: Kerry Archibald <kerrya@element.io> * add customisation point for mxid display Signed-off-by: Kerry Archibald <kerrya@element.io> * use userid customisation Signed-off-by: Kerry Archibald <kerrya@element.io> * use customisation in sender profile Signed-off-by: Kerry Archibald <kerrya@element.io> * hide profile settings mxid if falsy Signed-off-by: Kerry Archibald <kerrya@element.io> * rename and move to components Signed-off-by: Kerry Archibald <kerrya@element.io> * remove change to UIFeature.ts Signed-off-by: Kerry Archibald <kerrya@element.io> * improvements from pr Signed-off-by: Kerry Archibald <kerrya@element.io> * lint fix Signed-off-by: Kerry Archibald <kerrya@element.io>
This commit is contained in:
parent
b481fc069e
commit
502b805164
15 changed files with 154 additions and 23 deletions
|
@ -34,6 +34,7 @@ import { makeUserPermalink } from "../utils/permalinks/Permalinks";
|
|||
import { ICompletion, ISelectionRange } from "./Autocompleter";
|
||||
import MemberAvatar from '../components/views/avatars/MemberAvatar';
|
||||
import { TimelineRenderingType } from '../contexts/RoomContext';
|
||||
import UserIdentifierCustomisations from '../customisations/UserIdentifier';
|
||||
|
||||
const USER_REGEX = /\B@\S*/g;
|
||||
|
||||
|
@ -127,6 +128,9 @@ export default class UserProvider extends AutocompleteProvider {
|
|||
// Don't include the '@' in our search query - it's only used as a way to trigger completion
|
||||
const query = fullMatch.startsWith('@') ? fullMatch.substring(1) : fullMatch;
|
||||
completions = this.matcher.match(query, limit).map((user) => {
|
||||
const description = UserIdentifierCustomisations.getDisplayUserIdentifier(
|
||||
user.userId, { roomId: this.room.roomId, withDisplayName: true },
|
||||
);
|
||||
const displayName = (user.name || user.userId || '');
|
||||
return {
|
||||
// Length of completion should equal length of text in decorator. draft-js
|
||||
|
@ -137,7 +141,7 @@ export default class UserProvider extends AutocompleteProvider {
|
|||
suffix: (selection.beginning && range.start === 0) ? ': ' : ' ',
|
||||
href: makeUserPermalink(user.userId),
|
||||
component: (
|
||||
<PillCompletion title={displayName} description={user.userId}>
|
||||
<PillCompletion title={displayName} description={description}>
|
||||
<MemberAvatar member={user} width={24} height={24} />
|
||||
</PillCompletion>
|
||||
),
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue