diff --git a/packages/web/components/MainTabsOrPages/Conversations.tsx b/packages/web/components/MainTabsOrPages/Conversations.tsx
index 00a228a..cbf6ef4 100644
--- a/packages/web/components/MainTabsOrPages/Conversations.tsx
+++ b/packages/web/components/MainTabsOrPages/Conversations.tsx
@@ -16,10 +16,14 @@ import {
import { Routes } from "@nirvana/common/helpers/routes";
import LiveRoom from "../Conversations/LiveRoom";
import Conversation from "@nirvana/common/models/conversation";
+import { useRecoilValue } from "recoil";
+import { liveRoomsSelector } from "../../recoil/main";
export default function Conversations() {
const router = useRouter();
+ const liveRooms = useRecoilValue(liveRoomsSelector);
+
const handleViewConversationDetails = (convoId) => {
router.push({
pathname: Routes.home,
@@ -29,18 +33,23 @@ export default function Conversations() {
return (
<>
-
-
-
- Live
-
-
+ {liveRooms?.length > 0 && (
+ <>
+
+
+
+ Live
+
+
- {/* row of live room cards */}
-
- {/* engineering liveroom */}
- {/* */}
-
+ {/* row of live room cards */}
+
+ {liveRooms.map((lRoom) => (
+
+ ))}
+
+ >
+ )}
{/* Today */}
diff --git a/packages/web/recoil/main.tsx b/packages/web/recoil/main.tsx
index 0b13ed0..17a2abc 100644
--- a/packages/web/recoil/main.tsx
+++ b/packages/web/recoil/main.tsx
@@ -6,7 +6,7 @@ import Conversation, {
} from "@nirvana/common/models/conversation";
import { User as NirvanaUser } from "@nirvana/common/models/user";
-import { atom } from "recoil";
+import { atom, selector } from "recoil";
export enum RecoilActions {
TEST = "TEST",
@@ -17,6 +17,9 @@ export enum RecoilActions {
ALL_USERS_CONVERSATION_RELATIONSHIPS = "ALL_USERS_CONVERSATION_RELATIONSHIPS",
ALL_RELEVANT_CONVERSATIONS = "ALL_RELEVANT_CONVERSATIONS",
+ SORTED_CONVERSATIONS = "SORTED_CONVERSATIONS",
+ LIVE_ROOMS = "LIVE_ROOMS",
+
USER_DATA = "USER_DATA",
}
@@ -84,3 +87,41 @@ export const allRelevantConversations = atom({
key: RecoilActions.ALL_RELEVANT_CONVERSATIONS,
default: new Map(),
});
+
+export const sortedRoomSelector = selector({
+ key: RecoilActions.SORTED_CONVERSATIONS,
+ get: ({ get }) => {
+ const relConvos = get(allRelevantConversations);
+ const convosArr: Conversation[] = Array.from(relConvos.values());
+
+ convosArr.sort((a, b) => {
+ if (!a.lastActivityDate) {
+ return -1;
+ }
+ if (!b.lastActivityDate) {
+ return 1;
+ }
+
+ if (a.lastActivityDate > b.lastActivityDate) {
+ return 1;
+ }
+
+ return -1;
+ });
+
+ return convosArr;
+ },
+});
+
+// get all rooms with active members in the room, and
+export const liveRoomsSelector = selector({
+ key: RecoilActions.LIVE_ROOMS,
+ get: ({ get }) => {
+ const sortedConvos = get(sortedRoomSelector);
+ const liveRooms = sortedConvos.filter(
+ (conv) => conv.membersInLiveRoom?.length > 0
+ );
+
+ return liveRooms;
+ },
+});