feat: enhance room management and UI with join/leave functionality

- Added GraphQL mutations and subscriptions for joining and leaving rooms
- Implemented room member tracking and display in room list
- Added leave room confirmation and error handling in chat room
- Updated room list and chat room components with new interaction features
- Improved UI with member badges, join/leave buttons, and error messages
- Enhanced room query to include member information

apps/api/src/resolvers/room.ts

@@ -6,6 +6,7 @@ const prisma = new PrismaClient();
 const pubsub = new PubSub();
 
 export const ROOM_ADDED = 'ROOM_ADDED';
+export const ROOM_UPDATED = 'ROOM_UPDATED';
 
 export const roomResolvers = {
   Query: {
@@ -81,14 +82,20 @@ export const roomResolvers = {
         return room;
       }
 
-      return prisma.room.update({
+      const updatedRoom = await prisma.room.update({
         where: { id: roomId },
         data: {
           members: {
             connect: { id: context.userId },
           },
         },
+        include: { members: true },
       });
+
+      // Publish room updated event
+      pubsub.publish(ROOM_UPDATED, { roomUpdated: updatedRoom });
+
+      return updatedRoom;
     },
     leaveRoom: async (_: any, { roomId }: { roomId: string }, context: any) => {
       if (!context.userId) {
@@ -117,15 +124,19 @@ export const roomResolvers = {
         throw new ForbiddenError('You cannot leave a room you own');
       }
 
-      await prisma.room.update({
+      const updatedRoom = await prisma.room.update({
         where: { id: roomId },
         data: {
           members: {
             disconnect: { id: context.userId },
           },
         },
+        include: { members: true },
       });
 
+      // Publish room updated event
+      pubsub.publish(ROOM_UPDATED, { roomUpdated: updatedRoom });
+
       return true;
     },
   },
@@ -133,6 +144,9 @@ export const roomResolvers = {
     roomAdded: {
       subscribe: () => pubsub.asyncIterator([ROOM_ADDED]),
     },
+    roomUpdated: {
+      subscribe: () => pubsub.asyncIterator([ROOM_UPDATED]),
+    },
   },
   Room: {
     messages: async (parent: any) => {

apps/api/src/schema/typeDefs.ts

@@ -59,5 +59,6 @@ export const typeDefs = gql`
   type Subscription {
     messageAdded(roomId: ID!): Message!
     roomAdded: Room!
+    roomUpdated: Room!
   }
 `;