From 697d15a211cb68dbfdcc89b230165677a6c69580 Mon Sep 17 00:00:00 2001
From: R Midhun Suresh <hi@midhun.dev>
Date: Sun, 5 Jan 2025 20:37:06 +0530
Subject: [PATCH] Support the new memberlist in Diasambiguated profile

1. Use MemberInfo instead of RoomMember
2. CSS changes to reflect the new design
---
 .../views/messages/_DisambiguatedProfile.pcss | 23 ++++++++++++++++++-
 .../views/messages/DisambiguatedProfile.tsx   | 10 ++++++--
 2 files changed, 30 insertions(+), 3 deletions(-)

diff --git a/res/css/views/messages/_DisambiguatedProfile.pcss b/res/css/views/messages/_DisambiguatedProfile.pcss
index 25a28971d4..93dce8ab52 100644
--- a/res/css/views/messages/_DisambiguatedProfile.pcss
+++ b/res/css/views/messages/_DisambiguatedProfile.pcss
@@ -21,8 +21,29 @@ Please see LICENSE files in the repository root for full details.
     }
 
     .mx_DisambiguatedProfile_mxid {
-        margin-inline-start: 5px;
         color: $secondary-content;
         font-size: var(--cpd-font-size-body-sm);
+        margin-inline-start: 5px;
+    }
+}
+
+/** Disambiguated profile needs to have a different layout in the member tile */
+.mx_MemberTileView .mx_DisambiguatedProfile {
+    display: flex;
+    flex-direction: column;
+
+    .mx_DisambiguatedProfile_mxid {
+        margin-inline-start: 0;
+        font: var(--cpd-font-body-sm-regular);
+    }
+
+    span:not(.mx_DisambiguatedProfile_mxid) {
+        /**
+        In a member tile, this span element is a flex child and so
+        we need the following for text overflow to work.
+        **/
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
     }
 }
diff --git a/src/components/views/messages/DisambiguatedProfile.tsx b/src/components/views/messages/DisambiguatedProfile.tsx
index 0e7d2e046e..b6b469eaa6 100644
--- a/src/components/views/messages/DisambiguatedProfile.tsx
+++ b/src/components/views/messages/DisambiguatedProfile.tsx
@@ -8,15 +8,21 @@ Please see LICENSE files in the repository root for full details.
 */
 
 import React from "react";
-import { RoomMember } from "matrix-js-sdk/src/matrix";
 import classNames from "classnames";
 
 import { _t } from "../../../languageHandler";
 import { getUserNameColorClass } from "../../../utils/FormattingUtils";
 import UserIdentifier from "../../../customisations/UserIdentifier";
 
+interface MemberInfo {
+    userId: string;
+    roomId: string;
+    rawDisplayName?: string;
+    disambiguate: boolean;
+}
+
 interface IProps {
-    member?: RoomMember | null;
+    member?: MemberInfo | null;
     fallbackName: string;
     onClick?(): void;
     colored?: boolean;