From a44cefedcf8e10f20f832db2855efe300a2df156 Mon Sep 17 00:00:00 2001
From: Ajay Bura <32841439+ajbura@users.noreply.github.com>
Date: Sat, 9 Aug 2025 16:23:20 +0530
Subject: [PATCH] open profile view on left side in member drawer

---
 src/app/components/UserRoomProfileRenderer.tsx | 4 ++--
 src/app/features/room/MembersDrawer.tsx        | 2 +-
 src/app/state/hooks/userRoomProfile.ts         | 9 +++++----
 src/app/state/userRoomProfile.ts               | 3 ++-
 4 files changed, 10 insertions(+), 8 deletions(-)

diff --git a/src/app/components/UserRoomProfileRenderer.tsx b/src/app/components/UserRoomProfileRenderer.tsx
index c12a4bfc..ca7aa837 100644
--- a/src/app/components/UserRoomProfileRenderer.tsx
+++ b/src/app/components/UserRoomProfileRenderer.tsx
@@ -10,7 +10,7 @@ import { SpaceProvider } from '../hooks/useSpace';
 import { RoomProvider } from '../hooks/useRoom';
 
 function UserRoomProfileContextMenu({ state }: { state: UserRoomProfileState }) {
-  const { roomId, spaceId, userId, cords } = state;
+  const { roomId, spaceId, userId, cords, position } = state;
   const allJoinedRooms = useAllJoinedRoomsSet();
   const getRoom = useGetRoom(allJoinedRooms);
   const room = getRoom(roomId);
@@ -23,7 +23,7 @@ function UserRoomProfileContextMenu({ state }: { state: UserRoomProfileState })
   return (
     <PopOut
       anchor={cords}
-      position="Top"
+      position={position ?? 'Top'}
       align="Start"
       content={
         <FocusTrap
diff --git a/src/app/features/room/MembersDrawer.tsx b/src/app/features/room/MembersDrawer.tsx
index 96391f1d..bdb0eb3d 100644
--- a/src/app/features/room/MembersDrawer.tsx
+++ b/src/app/features/room/MembersDrawer.tsx
@@ -147,7 +147,7 @@ export function MembersDrawer({ room, members }: MembersDrawerProps) {
     const btn = evt.currentTarget as HTMLButtonElement;
     const userId = btn.getAttribute('data-user-id');
     if (!userId) return;
-    openUserRoomProfile(room.roomId, space?.roomId, userId, btn.getBoundingClientRect());
+    openUserRoomProfile(room.roomId, space?.roomId, userId, btn.getBoundingClientRect(), 'Left');
   };
 
   return (
diff --git a/src/app/state/hooks/userRoomProfile.ts b/src/app/state/hooks/userRoomProfile.ts
index 75275f2e..7fed0c08 100644
--- a/src/app/state/hooks/userRoomProfile.ts
+++ b/src/app/state/hooks/userRoomProfile.ts
@@ -1,6 +1,6 @@
 import { useCallback } from 'react';
 import { useAtomValue, useSetAtom } from 'jotai';
-import { RectCords } from 'folds';
+import { Position, RectCords } from 'folds';
 import { userRoomProfileAtom, UserRoomProfileState } from '../userRoomProfile';
 
 export const useUserRoomProfileState = (): UserRoomProfileState | undefined => {
@@ -24,14 +24,15 @@ type OpenCallback = (
   roomId: string,
   spaceId: string | undefined,
   userId: string,
-  cords: RectCords
+  cords: RectCords,
+  position?: Position
 ) => void;
 export const useOpenUserRoomProfile = (): OpenCallback => {
   const setUserRoomProfile = useSetAtom(userRoomProfileAtom);
 
   const open: OpenCallback = useCallback(
-    (roomId, spaceId, userId, cords) => {
-      setUserRoomProfile({ roomId, spaceId, userId, cords });
+    (roomId, spaceId, userId, cords, position) => {
+      setUserRoomProfile({ roomId, spaceId, userId, cords, position });
     },
     [setUserRoomProfile]
   );
diff --git a/src/app/state/userRoomProfile.ts b/src/app/state/userRoomProfile.ts
index bbad8f02..cf4e403a 100644
--- a/src/app/state/userRoomProfile.ts
+++ b/src/app/state/userRoomProfile.ts
@@ -1,4 +1,4 @@
-import { RectCords } from 'folds';
+import { Position, RectCords } from 'folds';
 import { atom } from 'jotai';
 
 export type UserRoomProfileState = {
@@ -6,6 +6,7 @@ export type UserRoomProfileState = {
   roomId: string;
   spaceId?: string;
   cords: RectCords;
+  position?: Position;
 };
 
 export const userRoomProfileAtom = atom<UserRoomProfileState | undefined>(undefined);