From b2d196447f2f5d0846685e2b254851353fdf565f Mon Sep 17 00:00:00 2001 From: Shea Date: Sun, 12 Jul 2026 22:39:08 +0300 Subject: [PATCH 1/2] fix unclickable handles and hard to see handles Signed-off-by: Shea --- .changeset/fix_unlickable_handles.md | 5 ++ src/app/components/user-profile/UserHero.tsx | 50 +++++++++++-------- .../user-profile/UserRoomProfile.tsx | 2 +- src/app/pages/client/profile/Profile.tsx | 4 +- src/app/pages/client/sidebar/UserMenuTab.tsx | 4 +- .../pages/client/sidebar/UserQuickTools.tsx | 2 + 6 files changed, 42 insertions(+), 25 deletions(-) create mode 100644 .changeset/fix_unlickable_handles.md diff --git a/.changeset/fix_unlickable_handles.md b/.changeset/fix_unlickable_handles.md new file mode 100644 index 000000000..5fb8fb3a1 --- /dev/null +++ b/.changeset/fix_unlickable_handles.md @@ -0,0 +1,5 @@ +--- +default: patch +--- + +Fix clickable handles diff --git a/src/app/components/user-profile/UserHero.tsx b/src/app/components/user-profile/UserHero.tsx index 622315d3d..ba79f3fed 100644 --- a/src/app/components/user-profile/UserHero.tsx +++ b/src/app/components/user-profile/UserHero.tsx @@ -318,28 +318,34 @@ function UserHeroNameInner({ )} - - { - if (username && server) { - copyToClipboard(`@${username}:${server}`); - isSuccess.current = true; - } else isSuccess.current = false; - setCopied(); - }} - style={{ backgroundColor: 'transparent', padding: '0' }} - onPointerEnter={() => setIsHovered(true)} - onPointerLeave={() => setIsHovered(false)} - before={`@${username}`} - after={ - copied || isHovered ? ( - profileIcon(copied ? (isSuccess ? Check : CrossIcon) : CopyIcon) - ) : ( - <> - ) - } - /> - + { + evt.stopPropagation(); + if (username && server) { + copyToClipboard(`@${username}:${server}`); + isSuccess.current = true; + } else isSuccess.current = false; + setCopied(); + }} + style={{ backgroundColor: 'transparent', color: 'inherit', padding: '0' }} + onPointerEnter={() => setIsHovered(true)} + onPointerLeave={() => setIsHovered(false)} + before={ + {`@${username}`} + } + after={ + copied || isHovered ? ( + profileIcon(copied ? (isSuccess ? Check : CrossIcon) : CopyIcon) + ) : ( + <> + ) + } + /> ); diff --git a/src/app/components/user-profile/UserRoomProfile.tsx b/src/app/components/user-profile/UserRoomProfile.tsx index 31903dc52..5f41ce764 100644 --- a/src/app/components/user-profile/UserRoomProfile.tsx +++ b/src/app/components/user-profile/UserRoomProfile.tsx @@ -579,7 +579,7 @@ export function UserRoomProfile({ userId, initialProfile }: Readonly - + - + diff --git a/src/app/pages/client/sidebar/UserMenuTab.tsx b/src/app/pages/client/sidebar/UserMenuTab.tsx index f319ef230..e561fd096 100644 --- a/src/app/pages/client/sidebar/UserMenuTab.tsx +++ b/src/app/pages/client/sidebar/UserMenuTab.tsx @@ -65,6 +65,7 @@ import { UserIcon, } from '@phosphor-icons/react'; import * as css from './UserMenuTab.css'; +import { getMxIdServer } from '$utils/mxIdHelper'; const log = createLogger('AccountSwitcherTab'); @@ -643,6 +644,7 @@ export function UserMenuTab({ isBottom, isMobile }: { isBottom?: boolean; isMobi const navigate = useNavigate(); const userId = mx.getUserId() ?? ''; + const server = getMxIdServer(userId); const profile = useUserProfile(userId); const presence = useUserPresence(userId); const currentPresence = presence?.presence ?? Presence.Online; @@ -761,7 +763,7 @@ export function UserMenuTab({ isBottom, isMobile }: { isBottom?: boolean; isMobi allowEditing={true} /> - + diff --git a/src/app/pages/client/sidebar/UserQuickTools.tsx b/src/app/pages/client/sidebar/UserQuickTools.tsx index b9357e8e4..6d4155725 100644 --- a/src/app/pages/client/sidebar/UserQuickTools.tsx +++ b/src/app/pages/client/sidebar/UserQuickTools.tsx @@ -55,6 +55,8 @@ export function UserQuickTools({ <> Date: Mon, 13 Jul 2026 07:37:07 +0300 Subject: [PATCH 2/2] fix ghost reactions through an objective hack but the sdk is the sdk Signed-off-by: Shea --- .../timeline/useTimelineEventRenderer.tsx | 63 +++++++++++-------- 1 file changed, 38 insertions(+), 25 deletions(-) diff --git a/src/app/hooks/timeline/useTimelineEventRenderer.tsx b/src/app/hooks/timeline/useTimelineEventRenderer.tsx index c9f651b58..3b8d639b6 100644 --- a/src/app/hooks/timeline/useTimelineEventRenderer.tsx +++ b/src/app/hooks/timeline/useTimelineEventRenderer.tsx @@ -437,7 +437,8 @@ export function useTimelineEventRenderer({ ) : null; const reactionRelations = getEventReactions(timelineSet, mEventId); - const reactions = reactionRelations?.getSortedAnnotationsByKey(); + const annotations = reactionRelations?.getSortedAnnotationsByKey(); + const reactions = annotations?.filter((annotation) => annotation[1].size > 0); const hasReactions = reactions && reactions.length > 0; return ( @@ -540,7 +541,8 @@ export function useTimelineEventRenderer({ : (threadReplyTargetId ?? rawReplyEventId); const reactionRelations = getEventReactions(timelineSet, mEventId); - const reactions = reactionRelations?.getSortedAnnotationsByKey(); + const annotations = reactionRelations?.getSortedAnnotationsByKey(); + const reactions = annotations?.filter((annotation) => annotation[1].size > 0); const hasReactions = reactions && reactions.length > 0; const highlighted = focusItem?.index === item && focusItem.highlight; const marked = activeReplyId === mEventId && !suppressMark; @@ -645,7 +647,7 @@ export function useTimelineEventRenderer({ if (!reactionRelations && !threadChip) return undefined; return ( <> - {reactionRelations && ( + {reactionRelations && hasReactions && ( annotation[1].size > 0); const hasReactions = reactions && reactions.length > 0; const highlighted = focusItem?.index === item && focusItem.highlight; const marked = activeReplyId === mEventId && !suppressMark; @@ -777,7 +780,7 @@ export function useTimelineEventRenderer({ if (!reactionRelations && !threadChip) return undefined; return ( <> - {reactionRelations && ( + {reactionRelations && hasReactions && ( annotation[1].size > 0); const hasReactions = reactions && reactions.length > 0; const highlighted = focusItem?.index === item && focusItem.highlight; const marked = activeReplyId === mEventId && !suppressMark; @@ -949,7 +953,7 @@ export function useTimelineEventRenderer({ if (!reactionRelations && !threadChip) return undefined; return ( <> - {reactionRelations && ( + {reactionRelations && hasReactions && ( annotation[1].size > 0); const hasReactions = reactions && reactions.length > 0; const highlighted = focusItem?.index === item && focusItem.highlight; const marked = activeReplyId === mEventId && !suppressMark; @@ -1119,7 +1124,7 @@ export function useTimelineEventRenderer({ if (!reactionRelations && !threadChip) return undefined; return ( <> - {reactionRelations && ( + {reactionRelations && hasReactions && ( annotation[1].size > 0); const hasReactions = reactions && reactions.length > 0; return ( @@ -1226,7 +1232,7 @@ export function useTimelineEventRenderer({ if (!reactionRelations && !threadChip) return undefined; return ( <> - {reactionRelations && ( + {reactionRelations && hasReactions && ( annotation[1].size > 0); const hasReactions = reactions && reactions.length > 0; return ( @@ -1319,7 +1326,7 @@ export function useTimelineEventRenderer({ if (!reactionRelations && !threadChip) return undefined; return ( <> - {reactionRelations && ( + {reactionRelations && hasReactions && ( annotation[1].size > 0); const hasReactions = reactions && reactions.length > 0; return ( @@ -1414,7 +1422,7 @@ export function useTimelineEventRenderer({ if (!reactionRelations && !threadChip) return undefined; return ( <> - {reactionRelations && ( + {reactionRelations && hasReactions && ( annotation[1].size > 0); const hasReactions = reactions && reactions.length > 0; return ( @@ -1509,7 +1518,7 @@ export function useTimelineEventRenderer({ if (!reactionRelations && !threadChip) return undefined; return ( <> - {reactionRelations && ( + {reactionRelations && hasReactions && ( annotation[1].size > 0); const hasReactions = reactions && reactions.length > 0; return ( @@ -1611,7 +1621,7 @@ export function useTimelineEventRenderer({ if (!reactionRelations && !threadChip) return undefined; return ( <> - {reactionRelations && ( + {reactionRelations && hasReactions && ( annotation[1].size > 0); const hasReactions = reactions && reactions.length > 0; if (mEvent.isRedacted()) { @@ -1813,7 +1824,7 @@ export function useTimelineEventRenderer({ if (!reactionRelations && !threadChip) return undefined; return ( <> - {reactionRelations && ( + {reactionRelations && hasReactions && ( annotation[1].size > 0); const hasReactions = reactions && reactions.length > 0; return ( @@ -1935,7 +1947,7 @@ export function useTimelineEventRenderer({ if (!reactionRelations && !threadChip) return undefined; return ( <> - {reactionRelations && ( + {reactionRelations && hasReactions && ( annotation[1].size > 0); const hasReactions = reactions && reactions.length > 0; return ( @@ -2043,7 +2056,7 @@ export function useTimelineEventRenderer({ if (!reactionRelations && !threadChip) return undefined; return ( <> - {reactionRelations && ( + {reactionRelations && hasReactions && (