diff --git a/src/app/features/common-settings/members/Members.tsx b/src/app/features/common-settings/members/Members.tsx
index 37fe57c02..89c63c28b 100644
--- a/src/app/features/common-settings/members/Members.tsx
+++ b/src/app/features/common-settings/members/Members.tsx
@@ -58,6 +58,14 @@ import { useRoomCreators } from '../../../hooks/useRoomCreators';
import { getMouseEventCords } from '../../../utils/dom';
import { useCrossSigningActive } from '../../../hooks/useCrossSigning';
import { MemberVerificationBadge } from '../../../components/MemberVerificationBadge';
+import { useUserPresence } from '../../../hooks/useUserPresence';
+import { PresenceBadge } from '../../../components/presence';
+
+function MemberPresenceBadge({ userId }: { userId: string }) {
+ const presence = useUserPresence(userId);
+ if (!presence) return null;
+ return ;
+}
const SEARCH_OPTIONS: UseAsyncSearchOptions = {
limit: 1000,
@@ -333,6 +341,7 @@ export function Members({ requestClose }: MembersProps) {
useAuthentication={useAuthentication}
after={
<>
+
{showEncryption && (
)}
diff --git a/src/app/features/room/MembersDrawer.tsx b/src/app/features/room/MembersDrawer.tsx
index 426505666..29ae8f30e 100644
--- a/src/app/features/room/MembersDrawer.tsx
+++ b/src/app/features/room/MembersDrawer.tsx
@@ -61,6 +61,8 @@ import { useFlattenPowerTagMembers, useGetMemberPowerTag } from '../../hooks/use
import { useRoomCreators } from '../../hooks/useRoomCreators';
import { useCrossSigningActive } from '../../hooks/useCrossSigning';
import { MemberVerificationBadge } from '../../components/MemberVerificationBadge';
+import { useUserPresence } from '../../hooks/useUserPresence';
+import { PresenceBadge } from '../../components/presence';
type MemberDrawerHeaderProps = {
room: Room;
@@ -131,6 +133,7 @@ function MemberItem({
const avatarUrl = avatarMxcUrl
? mx.mxcUrlToHttp(avatarMxcUrl, 100, 100, 'crop', undefined, false, useAuthentication)
: undefined;
+ const presence = useUserPresence(member.userId);
return (