feat: extend verification badge to user profile and settings members list

Extract MemberVerificationBadge into a shared component and render it in:
- UserRoomProfile: shield badge beside the display name on the profile card
- common-settings Members: badge next to each member in the room/space
  settings members page (accessible from the lobby)

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

src/app/components/MemberVerificationBadge.tsx

@@ -0,0 +1,35 @@
+import React from 'react';
+import { Icon, Icons, Text, Tooltip, TooltipProvider } from 'folds';
+import { useUserVerifiedStatus } from '../hooks/useUserVerifiedStatus';
+
+type MemberVerificationBadgeProps = {
+  userId: string;
+};
+
+export function MemberVerificationBadge({ userId }: MemberVerificationBadgeProps) {
+  const vs = useUserVerifiedStatus(userId);
+  if (vs === 'unknown') return null;
+  const color =
+    vs === 'verified' ? 'var(--tc-positive-normal, #5effc4)' : 'var(--tc-warning-normal, #ffcc55)';
+  const label = vs === 'verified' ? 'Identity verified' : 'Not verified';
+  return (
+    <TooltipProvider
+      position="Top"
+      tooltip={
+        <Tooltip>
+          <Text size="T200">{label}</Text>
+        </Tooltip>
+      }
+    >
+      {(ref) => (
+        <span
+          ref={ref}
+          title={label}
+          style={{ display: 'inline-flex', alignItems: 'center', flexShrink: 0 }}
+        >
+          <Icon size="100" src={Icons.ShieldUser} style={{ color }} />
+        </span>
+      )}
+    </TooltipProvider>
+  );
+}

src/app/components/user-profile/UserRoomProfile.tsx

@@ -10,6 +10,8 @@ import { usePowerLevels } from '../../hooks/usePowerLevels';
 import { useRoom } from '../../hooks/useRoom';
 import { useUserPresence } from '../../hooks/useUserPresence';
 import { IgnoredUserAlert, MutualRoomsChip, OptionsChip, ServerChip, ShareChip } from './UserChips';
+import { useCrossSigningActive } from '../../hooks/useCrossSigning';
+import { MemberVerificationBadge } from '../MemberVerificationBadge';
 import { useCloseUserRoomProfile } from '../../state/hooks/userRoomProfile';
 import { PowerChip } from './PowerChip';
 import { UserInviteAlert, UserBanAlert, UserModeration, UserKickAlert } from './UserModeration';
@@ -28,6 +30,7 @@ type UserRoomProfileProps = {
 };
 export function UserRoomProfile({ userId }: UserRoomProfileProps) {
   const mx = useMatrixClient();
+  const crossSigningActive = useCrossSigningActive();
   const useAuthentication = useMediaAuthentication();
   const navigate = useNavigate();
   const closeUserRoomProfile = useCloseUserRoomProfile();
@@ -35,6 +38,7 @@ export function UserRoomProfile({ userId }: UserRoomProfileProps) {
   const ignored = ignoredUsers.includes(userId);
 
   const room = useRoom();
+  const showEncryption = room.hasEncryptionStateEvent() && crossSigningActive;
   const powerLevels = usePowerLevels(room);
   const creators = useRoomCreators(room);
 
@@ -76,8 +80,9 @@ export function UserRoomProfile({ userId }: UserRoomProfileProps) {
       />
       <Box direction="Column" gap="500" style={{ padding: config.space.S400 }}>
         <Box direction="Column" gap="400">
-          <Box gap="400" alignItems="Start">
+          <Box gap="400" alignItems="Center">
             <UserHeroName displayName={displayName} userId={userId} />
+            {showEncryption && <MemberVerificationBadge userId={userId} />}
             {userId !== myUserId && (
               <Box shrink="No">
                 <Button