| return rooms; | return rooms; | ||||
| } | } | ||||
| [HttpGet("support-rooms")] | |||||
| [Authorize(Roles = "Support")] | |||||
| public async Task<ActionResult<List<Room>>> GetSupportRooms(string supportId) => | |||||
| await _roomService.GetRoomsForSupport(supportId); | |||||
| [HttpPost] | [HttpPost] | ||||
| [Authorize(Roles = "Customer")] | |||||
| [Authorize(Roles = "Support")] | |||||
| public async Task<IActionResult> CreateChat(Room room) | public async Task<IActionResult> CreateChat(Room room) | ||||
| { | { | ||||
| if(room == null) | if(room == null) |
| import { GiSandsOfTime } from "react-icons/gi"; | import { GiSandsOfTime } from "react-icons/gi"; | ||||
| import { CgEnter } from "react-icons/cg"; | import { CgEnter } from "react-icons/cg"; | ||||
| import Dialog from "./UI/Dialog"; | 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 { createChatRoomAsync } from "../store/chat-slice"; | ||||
| import { createJoinRequestAsync, requestActions } from "../store/request-slice"; | import { createJoinRequestAsync, requestActions } from "../store/request-slice"; | ||||
| import { fetchRequestsAsync } from "../store/request-slice"; | import { fetchRequestsAsync } from "../store/request-slice"; | ||||
| }, [user, dispatch, loadedNotification]); | }, [user, dispatch, loadedNotification]); | ||||
| useEffect(() => { | useEffect(() => { | ||||
| (user !== null && user.roles.includes('Support')) ? dispatch(fetchSupportRoomsAsync(user.id)): | |||||
| (user !== null && dispatch(fetchChatRoomsAsync(user.id))) | (user !== null && dispatch(fetchChatRoomsAsync(user.id))) | ||||
| dispatch(fetchRequestsAsync()); | dispatch(fetchRequestsAsync()); | ||||
| }, [dispatch]); | }, [dispatch]); | ||||
| // setMessages([]); | // setMessages([]); | ||||
| }); | }); | ||||
| // console.log(n); | |||||
| await connection.start(); | await connection.start(); | ||||
| await connection.invoke("JoinRoom", { | await connection.invoke("JoinRoom", { | ||||
| userId: user.id, | userId: user.id, | ||||
| const openModal = (n) => { | const openModal = (n) => { | ||||
| setShowModal(true); | setShowModal(true); | ||||
| // console.log(n) | |||||
| dispatch(requestActions.chooseRoom(n)); | dispatch(requestActions.chooseRoom(n)); | ||||
| }; | }; | ||||
| } | } | ||||
| } | } | ||||
| return ( | 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> | <div> | ||||
| {acceptedRequests.length > 0 && ( | {acceptedRequests.length > 0 && ( | ||||
| <div> | <div> |
| // }); | // }); | ||||
| connection.on("Notify", (data) => { | connection.on("Notify", (data) => { | ||||
| console.log(data) | |||||
| if (data.m === "subscription") { | if (data.m === "subscription") { | ||||
| dispatch(statusActions.addToActiveUsers(data.id)); | dispatch(statusActions.addToActiveUsers(data.id)); | ||||
| } else { | } else { |
| // that means the user probably shut the browser down without loging out | // that means the user probably shut the browser down without loging out | ||||
| if (localStorage.getItem("activeOnes")) { | if (localStorage.getItem("activeOnes")) { | ||||
| // status.connection.stop(); | // status.connection.stop(); | ||||
| disconnect(); | disconnect(); | ||||
| } | } | ||||
| }); | }); | ||||
| .build(); | .build(); | ||||
| const fulfilled = () => { | const fulfilled = () => { | ||||
| console.log(user.id) | |||||
| console.log(status.connection.connectionId) | |||||
| connection | connection | ||||
| .send("Unsubscribe", { | .send("Unsubscribe", { | ||||
| id: user.id, | id: user.id, |
| const methods = { | const methods = { | ||||
| getChats: (customerId) => axios.get(`/Chat/rooms-with-filtered-messages?customerId=${customerId}`).then(responseBody), | getChats: (customerId) => axios.get(`/Chat/rooms-with-filtered-messages?customerId=${customerId}`).then(responseBody), | ||||
| createChat: (payload) => axios.post("/Chat", payload).then(responseBody), | createChat: (payload) => axios.post("/Chat", payload).then(responseBody), | ||||
| getSupportRooms:(supportId) => axios.get(`/Chat/support-rooms?supportId=${supportId}`).then(responseBody) | |||||
| }; | }; | ||||
| export default methods; | export default methods; |
| } | } | ||||
| ); | ); | ||||
| 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( | export const createChatRoomAsync = createAsyncThunk( | ||||
| "chat/createChatRoomAsync", | "chat/createChatRoomAsync", | ||||
| async (payload, thunkAPI) => { | async (payload, thunkAPI) => { | ||||
| state.error = "Fetch error" + action.payload; | 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 | // Add chat room | ||||
| builder.addCase(createChatRoomAsync.pending, (state) => { | builder.addCase(createChatRoomAsync.pending, (state) => { | ||||
| state.status = "pendingAddRoom"; | state.status = "pendingAddRoom"; |