diff --git a/client/src/components/ChatWindow/index.css b/client/src/components/ChatWindow/index.css
index b7e6439..37127a5 100644
--- a/client/src/components/ChatWindow/index.css
+++ b/client/src/components/ChatWindow/index.css
@@ -4,6 +4,10 @@
position: relative;
}
+.hide-chatWindow-container {
+ display: none !important;
+}
+
.loading-chatWindow {
background-color: #2f343d;
position: absolute;
diff --git a/client/src/components/ChatWindow/index.js b/client/src/components/ChatWindow/index.js
index 2372d9f..68d00f3 100644
--- a/client/src/components/ChatWindow/index.js
+++ b/client/src/components/ChatWindow/index.js
@@ -7,7 +7,7 @@ export default function ChatWindow(props) {
useEffect(() => {
document.getElementsByTagName(
"iframe"
- )[0].src = `${rcApiDomain}${pathname}/?layout=embedded`;
+ )[0].src = `${rcApiDomain}${pathname}?layout=embedded`;
// eslint-disable-next-line
}, []);
useEffect(() => {
@@ -18,7 +18,12 @@ export default function ChatWindow(props) {
);
}, [pathname]);
return (
-
+
- );
+ const { community, community_name } = props;
+ return (
+
+
{community_name}
+ {Object.keys(community).map((roomId) => {
+ let room = community[roomId];
+ if (room.open || room.open === undefined)
+ // Here the second condition holds when new room is created as the response from server doesn't return open field on creation
+ return
;
+ return null;
+ })}
+
+ );
}
diff --git a/client/src/components/CreateChannel/index.js b/client/src/components/CreateChannel/index.js
index b21c7e5..d0a550f 100644
--- a/client/src/components/CreateChannel/index.js
+++ b/client/src/components/CreateChannel/index.js
@@ -55,7 +55,7 @@ export default class CreateChannel extends Component {
let communityChannels = [],
communityMember = [];
- communityChannels = rooms
+ communityChannels = Object.keys(rooms).map((roomId) => rooms[roomId])
.filter((room) => {
return room.name.endsWith("_community");
})
diff --git a/client/src/components/MainLayout/index.js b/client/src/components/MainLayout/index.js
index 169673a..f787b43 100644
--- a/client/src/components/MainLayout/index.js
+++ b/client/src/components/MainLayout/index.js
@@ -42,40 +42,23 @@ export default function MainLayout(props) {
const {authState, stats} = props;
return (
-
- custom field (not repo)
- //abcd (without repo) -> custom field (not repo)
- path={["/direct", "(.*)_community"]}
- render={(props) => {
- return (
-
-
-
- );
- }}
- />
- {
- return (
-
-
-
-
- );
- }}
- />
- {
- return (
-
- );
- }}
- />
-
+
+
+
+ {
+ return ;
+ }}
+ />
+ {
+ return ;
+ }}
+ />
+
+
);
}
diff --git a/client/src/components/RoomItem/index.css b/client/src/components/RoomItem/index.css
index fbc1cf5..dd6469e 100644
--- a/client/src/components/RoomItem/index.css
+++ b/client/src/components/RoomItem/index.css
@@ -29,4 +29,8 @@
.active-room {
background-color: #41464f;
+}
+
+.highlight-room {
+ color: white !important;
}
\ No newline at end of file
diff --git a/client/src/components/RoomItem/index.js b/client/src/components/RoomItem/index.js
index cba6ed4..34ba51d 100644
--- a/client/src/components/RoomItem/index.js
+++ b/client/src/components/RoomItem/index.js
@@ -10,7 +10,7 @@ export default function RoomItem({room}) {
to={`/${
room["t"] === "c" ? "channel" : room["t"] === "p" ? "group" : "direct"
}/${room.username || room.name}`}
- className="room-wrapper"
+ className={`room-wrapper ${room.alert && "highlight-room"}`}
activeClassName="active-room"
>
![]()
)}
- {room.name.split(/_(.+)/)[1] && room["t"] !== "d"
- ? room.name.split(/_(.+)/)[1]
- : room.name}
- {room.username ? ` (${room.username})` : null}
+ {(room.fname && (room.fname.split(/_(.+)/)[1] || room.fname)) ||
+ room.name ||
+ room.username}
);
diff --git a/client/src/components/SignedLeftSidebar/index.js b/client/src/components/SignedLeftSidebar/index.js
index 7f0a305..7bb1f4f 100644
--- a/client/src/components/SignedLeftSidebar/index.js
+++ b/client/src/components/SignedLeftSidebar/index.js
@@ -31,18 +31,25 @@ export default function SignedLeftSidebar(props) {
const [snackbarOpen, setSnackbarOpen] = useState(false);
const [snackbarSeverity, setSnackbarSeverity] = useState("success");
const [snackbarText, setSnackbarText] = useState("");
- const [rooms, setRooms] = useState([]);
- const [communities, setCommunities] = useState({});
- const [directMessages, setDirectMessages] = useState([]);
+ const [rooms, setRooms] = useState({
+ conversations: {},
+ communities: {},
+ directMessages: {},
+ });
const [showSearch, setShowSearch] = useState(false);
const [sortAnchorEl, setSortAnchorEl] = useState(null);
const [groupByCommunity, setGroupByCommunity] = useState(true);
- const sortRoomsAlphabetically = () => {
- let chatRooms = rooms;
+ const sortRoomsAlphabetically = (conversations) => {
+ let chatRooms = [];
+ for (let roomId in conversations) {
+ chatRooms.push(conversations[roomId]);
+ }
chatRooms.sort((a, b) => {
- let roomAname = a.name.split(/_(.+)/)[1] || a.name;
- let roomBname = b.name.split(/_(.+)/)[1] || b.name;
+ let roomAname =
+ (a.fname && (a.fname.split(/_(.+)/)[1] || a.fname)) || a.name;
+ let roomBname =
+ (b.fname && (b.fname.split(/_(.+)/)[1] || b.fname)) || b.name;
roomAname = roomAname.toUpperCase();
roomBname = roomBname.toUpperCase();
if (roomAname < roomBname) {
@@ -53,44 +60,49 @@ export default function SignedLeftSidebar(props) {
}
return 0;
});
- setChatRooms(chatRooms);
+ formatAndSetRooms(chatRooms);
};
- const setChatRooms = (rooms) => {
+ const formatAndSetRooms = (rooms) => {
let communities = {};
- let directMessages = [];
+ let directMessages = {};
+ let conversations = {};
rooms.forEach((room) => {
+ conversations[room._id] = room;
if (room["t"] === "c" || room["t"] === "p") {
let community_name = room.name.split(/_(.+)/)[0];
- if (!communities[community_name]) communities[community_name] = [];
- communities[community_name].push(room);
+ if (!communities[community_name]) communities[community_name] = {};
+ communities[community_name][room._id] = room;
} else {
- directMessages.push(room);
+ directMessages[room._id] = room;
}
});
- setRooms(rooms);
- setCommunities(communities);
- setDirectMessages(directMessages);
+ setRooms({
+ conversations,
+ communities,
+ directMessages,
+ });
};
const addRoom = (room) => {
- setRooms([...rooms, room]);
+ let newRooms = rooms;
+ newRooms["conversations"][room._id] = room;
+ if (document.getElementById("alpha-sort").checked) {
+ return sortRoomsAlphabetically(newRooms["conversations"]);
+ }
if (room["t"] === "c" || room["t"] === "p") {
- let newCommnunities = { ...communities };
let community_name = room.name.split(/_(.+)/)[0];
- if (!newCommnunities[community_name])
- newCommnunities[community_name] = [];
- newCommnunities[community_name].push(room);
- setCommunities(newCommnunities);
+ if (!newRooms["communities"][community_name])
+ newRooms["communities"][community_name] = {};
+ newRooms["communities"][community_name][room._id] = room;
} else {
- setDirectMessages([...directMessages, room]);
+ newRooms["directMessages"][room._id] = room;
}
+ setRooms(newRooms);
};
useEffect(() => {
- const url = `${rcApiDomain}/api/v1/users.info?userId=${Cookies.get(
- "rc_uid"
- )}&fields={"userRooms": 1}`;
+ const url = `${rcApiDomain}/api/v1/subscriptions.get`;
fetch(url, {
headers: {
"X-Auth-Token": Cookies.get("rc_token"),
@@ -101,13 +113,33 @@ export default function SignedLeftSidebar(props) {
})
.then((response) => response.json())
.then((data) => {
- setChatRooms(data.user.rooms);
+ formatAndSetRooms(data.update);
})
.catch((err) => {
console.log("Error Fetching Rooms from server --->", err);
});
}, []);
+ window.addEventListener("message", function (e) {
+ if (
+ e.data.eventName === "unread-changed-by-subscription" &&
+ rooms["conversations"][e.data.data._id] &&
+ rooms["conversations"][e.data.data._id].alert !== e.data.data.alert
+ ) {
+ let newRooms = rooms;
+ newRooms["conversations"][e.data.data._id]["alert"] = e.data.data.alert;
+ if (e.data.data.t === "d") {
+ newRooms["directMessages"][e.data.data._id]["alert"] =
+ e.data.data.alert;
+ } else {
+ newRooms["communities"][e.data.data.name.split(/_(.+)/)[0]][
+ e.data.data._id
+ ]["alert"] = e.data.data.alert;
+ }
+ setRooms({ ...newRooms });
+ }
+ });
+
const handleEndCreateCommunity = () => {
setStartCreateCommunity(false);
};
@@ -180,7 +212,9 @@ export default function SignedLeftSidebar(props) {
{ externalCommand: "logout" },
`${rcApiDomain}`
);
- document.getElementsByClassName("loading-chatWindow")[0].classList.remove("hide-chatWindow");
+ document
+ .getElementsByClassName("loading-chatWindow")[0]
+ .classList.remove("hide-chatWindow");
}
const loadingIcon = document.getElementById("logout-loading-icon");
const logoutButton = document.getElementById("logout-menu-item");
@@ -311,7 +345,9 @@ export default function SignedLeftSidebar(props) {
{
+ sortRoomsAlphabetically(rooms["conversations"]);
+ }}
/>
@@ -392,7 +428,7 @@ export default function SignedLeftSidebar(props) {
organizations={organizations}
setSnackbar={setSnackbar}
addRoom={addRoom}
- rooms={rooms}
+ rooms={rooms["conversations"]}
/>
)}