Backend/Diligent.WebAPI.Host/Controllers/ChatController.cs

@@ -46,8 +46,13 @@ namespace Diligent.WebAPI.Host.Controllers
             return rooms;
         }
 
+        [HttpGet("support-rooms")]
+        [Authorize(Roles = "Support")]
+        public async Task<ActionResult<List<Room>>> GetSupportRooms(string supportId) =>
+            await _roomService.GetRoomsForSupport(supportId);
+
         [HttpPost]
-        [Authorize(Roles = "Customer")]
+        [Authorize(Roles = "Support")]
         public async Task<IActionResult> CreateChat(Room room)
         {
             if(room == null)

Frontend/src/components/ChatList.js

@@ -7,7 +7,7 @@ import { FaSignInAlt } from "react-icons/fa";
 import { GiSandsOfTime } from "react-icons/gi";
 import { CgEnter } from "react-icons/cg";
 import Dialog from "./UI/Dialog";
-import { chatActions, fetchChatRoomsAsync } from "../store/chat-slice";
+import { chatActions, fetchChatRoomsAsync,fetchSupportRoomsAsync } from "../store/chat-slice";
 import { createChatRoomAsync } from "../store/chat-slice";
 import { createJoinRequestAsync, requestActions } from "../store/request-slice";
 import { fetchRequestsAsync } from "../store/request-slice";
@@ -46,6 +46,7 @@ const ChatList = () => {
   }, [user, dispatch, loadedNotification]);
 
   useEffect(() => {
+    (user !== null && user.roles.includes('Support')) ? dispatch(fetchSupportRoomsAsync(user.id)):
     (user !== null && dispatch(fetchChatRoomsAsync(user.id)))
     dispatch(fetchRequestsAsync());
   }, [dispatch]);
@@ -116,8 +117,6 @@ const ChatList = () => {
         // setMessages([]);
       });
 
-      // console.log(n);
-
       await connection.start();
       await connection.invoke("JoinRoom", {
         userId: user.id,
@@ -134,7 +133,6 @@ const ChatList = () => {
 
   const openModal = (n) => {
     setShowModal(true);
-    // console.log(n)
     dispatch(requestActions.chooseRoom(n));
   };
 
@@ -181,6 +179,23 @@ const ChatList = () => {
       }
     }
     return (
+      user !== null && user.roles.includes('Support') ? 
+      <div>
+        {rooms.map((room, index) => (
+          <div
+            className="border-bottom d-flex"
+            key={index}
+            onClick={() => joinRoom(room)}
+            >
+              <button
+                className="text-start w-100 py-3 px-3 btn btn-light h-100"
+                onClick={showRoomMessagesHandler.bind(this, room)}
+              >
+                {room.name}
+              </button>
+          </div>
+        ))}
+      </div>: 
       <div>
         {acceptedRequests.length > 0 && (
           <div>

Frontend/src/components/MiddleContainer.js

@@ -31,7 +31,6 @@ const MiddleContainer = ({ showTerm }) => {
     // });
 
     connection.on("Notify", (data) => {
-      console.log(data)
       if (data.m === "subscription") {
         dispatch(statusActions.addToActiveUsers(data.id));
       } else {

Frontend/src/contexts/userContext.js

@@ -16,7 +16,6 @@ export const UserProvider = (props) => {
     // that means the user probably shut the browser down without loging out
     if (localStorage.getItem("activeOnes")) {
       //  status.connection.stop();
-
       disconnect();
     }
   });
@@ -38,8 +37,6 @@ export const UserProvider = (props) => {
       .build();
 
     const fulfilled = () => {
-      console.log(user.id)
-      console.log(status.connection.connectionId)
       connection
         .send("Unsubscribe", {
           id: user.id,

Frontend/src/services/chatService.js

@@ -8,6 +8,7 @@ const responseBody = (response) => response.data;
 const methods = {
   getChats: (customerId) => axios.get(`/Chat/rooms-with-filtered-messages?customerId=${customerId}`).then(responseBody),
   createChat: (payload) => axios.post("/Chat", payload).then(responseBody),
+  getSupportRooms:(supportId) => axios.get(`/Chat/support-rooms?supportId=${supportId}`).then(responseBody)
 };
 
 export default methods;

Frontend/src/store/chat-slice.js

@@ -29,6 +29,17 @@ export const fetchChatRoomsAsync = createAsyncThunk(
   }
 );
 
+export const fetchSupportRoomsAsync = createAsyncThunk(
+  "chat/fetchSupportRooms",
+  async (payload,thunkAPI) => {
+    try{
+      return await chatService.getSupportRooms(payload);
+    }catch(error){
+      return thunkAPI.rejectWithValue({error})
+    }
+  }
+)
+
 export const createChatRoomAsync = createAsyncThunk(
   "chat/createChatRoomAsync",
   async (payload, thunkAPI) => {
@@ -173,6 +184,21 @@ const chatSlice = createSlice({
       state.error = "Fetch error" + action.payload;
     });
 
+    // fetch rooms that support created
+    builder.addCase(fetchSupportRoomsAsync.pending, (state) => {
+      state.status = "pendingFetchRooms";
+      state.error = null;
+    });
+    builder.addCase(fetchSupportRoomsAsync.fulfilled, (state, action) => {
+      state.rooms = action.payload;
+      state.status = "idle";
+      state.error = null;
+    });
+    builder.addCase(fetchSupportRoomsAsync.rejected, (state, action) => {
+      state.status = "idle";
+      state.error = "Fetch error" + action.payload;
+    });
+
     // Add chat room
     builder.addCase(createChatRoomAsync.pending, (state) => {
       state.status = "pendingAddRoom";