caching relevant users for my disposal and starting to render content

packages/web/recoil/MainRecoilDataHandler.tsx

@@ -15,15 +15,18 @@ import {
 } from "firebase/firestore";
 import { useEffect } from "react";
 import toast from "react-hot-toast";
-import { useRecoilState } from "recoil";
+import { useRecoilState, useSetRecoilState } from "recoil";
 import { useAuth } from "../contexts/authContext";
 import {
+  allRelevantContactsAtom,
   allRelevantConversationsAtom,
   allUsersConversationsAtom,
+  cachedRelevantContactsSelector,
   nirvanaUserDataAtom,
 } from "./main";
 
 import { firestoreDb as db } from "../services/firebaseService";
+import { userService } from "@nirvana/common/services";
 
 export default function MainRecoilDataHandler() {
   const { currUser } = useAuth();
@@ -34,6 +37,8 @@ export default function MainRecoilDataHandler() {
     allRelevantConversationsAtom
   );
 
+  const [relContacts, setRelContacts] = useRecoilState(allRelevantContactsAtom);
+
   useEffect(() => {
     const unsubs: Unsubscribe[] = [] as Unsubscribe[];
 
@@ -120,6 +125,40 @@ export default function MainRecoilDataHandler() {
             }
           });
 
+          // build user's cache
+          let allUsersToCache: string[] = [] as string[];
+
+          arrayConvos.forEach((currconvo) => {
+            allUsersToCache = [...allUsersToCache, ...currconvo.activeMembers];
+          });
+
+          console.log(
+            "going to try caching a bunch of users...maybe some duplicates",
+            allUsersToCache
+          );
+
+          // if this userId is in the contacts map, then cool
+          // otherwise fetch with userService
+
+          allUsersToCache.map(async (oUser) => {
+            if (
+              relContacts.has(oUser) &&
+              relContacts.get(oUser) instanceof User
+            ) {
+              // do nothing
+
+              console.log("user already cached, no need to re-cache");
+            } else {
+              // otherwise, fetch document from firestore and then set the cache
+              const retrievedUser = await userService.getUser(oUser);
+              console.log("fetching user to add to cache");
+
+              if (retrievedUser) {
+                setRelContacts(new Map(relContacts.set(oUser, retrievedUser)));
+              }
+            }
+          });
+
           // add to the main convos atom, by modifying the current map
           setRelevantConvos((prevConvosMap) => {
             const newMap = new Map(prevConvosMap);

packages/web/recoil/main.tsx

@@ -5,8 +5,9 @@ import Conversation, {
   Link,
 } from "@nirvana/common/models/conversation";
 import { User as NirvanaUser } from "@nirvana/common/models/user";
+import { userService } from "@nirvana/common/services";
 
-import { atom, selector, selectorFamily } from "recoil";
+import { atom, DefaultValue, selector, selectorFamily } from "recoil";
 
 export enum RecoilActions {
   TEST = "TEST",
@@ -110,11 +111,18 @@ export const allRelevantContactsAtom = atom<Map<string, NirvanaUser>>({
 
 // todo: useful selector where a component can pass in a list of users
 // and return their full information
-export const cachedRelevantContactsSelector = selector<NirvanaUser[]>({
+export const cachedRelevantContactsSelector = selector<string[]>({
   key: RecoilActions.RELEVANT_CONTACTS_SELECTOR_CACHE,
   get: async ({ get }) => {
-    const currContacts: Map<string, NirvanaUser> = get(allRelevantContactsAtom);
     return [];
   },
   // selector set (pass in a user and build cache if somethings not in the cache already)
+  set: async ({ set, get }, listUserIdsToCache: string[]) => {
+    if (listUserIdsToCache instanceof DefaultValue) {
+      // set(newUserToCache)
+      return;
+    }
+
+    const contactsMap = get(allRelevantContactsAtom);
+  },
 });