src/Feed/LoginFeed.ts

@@ -7,7 +7,8 @@ import EventKind from "Nostr/EventKind";
 import { Subscriptions } from "Nostr/Subscriptions";
 import { addDirectMessage, addNotifications, setFollows, setRelays } from "State/Login";
 import { RootState } from "State/Store";
-import { mapEventToProfile, MetadataCache,  find, put, bulkGet } from "State/Users";
+import { mapEventToProfile, MetadataCache  } from "State/Users";
+import db from "State/Users/Db";
 import useSubscription from "Feed/Subscription";
 import { getDisplayName } from "Element/ProfileImage";
 import { MentionRegex } from "Const";
@@ -80,9 +81,9 @@ export default function useLoginFeed() {
                 return acc;
             }, { created: 0, profile: <MetadataCache | null>null });
             if (maxProfile.profile) {
-                let existing = await find(maxProfile.profile.pubkey);
+                let existing = await db.find(maxProfile.profile.pubkey);
                 if ((existing?.created ?? 0) < maxProfile.created) {
-                    await put(maxProfile.profile);
+                    await db.put(maxProfile.profile);
                 }
             }
         })().catch(console.warn);
@@ -93,7 +94,7 @@ async function makeNotification(ev: TaggedRawEvent) {
     switch (ev.kind) {
         case EventKind.TextNote: {
             const pubkeys = new Set([ev.pubkey, ...ev.tags.filter(a => a[0] === "p").map(a => a[1]!)]);
-            const users = await bulkGet(Array.from(pubkeys))
+            const users = await db.bulkGet(Array.from(pubkeys))
             // @ts-ignore
             const fromUser = users.find(a => a?.pubkey === ev.pubkey);
             const name = getDisplayName(fromUser, ev.pubkey);

src/Nostr/System.ts

@@ -1,6 +1,7 @@
 import { HexKey, TaggedRawEvent } from "Nostr";
 import { ProfileCacheExpire } from "Const";
-import { mapEventToProfile, MetadataCache, add, bulkAdd, bulkGet, find, put, update, bulkPut } from "State/Users";
+import { mapEventToProfile, MetadataCache, } from "State/Users";
+import db from "State/Users/Db";
 import Connection, { RelaySettings } from "Nostr/Connection";
 import Event from "Nostr/Event";
 import EventKind from "Nostr/EventKind";
@@ -166,7 +167,7 @@ export class NostrSystem {
 
     async _FetchMetadata() {
         let missing = new Set<HexKey>();
-        let meta = await bulkGet(Array.from(this.WantsMetadata));
+        let meta = await db.bulkGet(Array.from(this.WantsMetadata));
         let expire = new Date().getTime() - ProfileCacheExpire;
         for (let pk of this.WantsMetadata) {
             let m = meta.find(a => a?.pubkey === pk);
@@ -189,18 +190,18 @@ export class NostrSystem {
             sub.OnEvent = async (e) => {
                 let profile = mapEventToProfile(e);
                 if (profile) {
-                    let existing = await find(profile.pubkey);
+                    let existing = await db.find(profile.pubkey);
                     if((existing?.created ?? 0) < profile.created) {
-                        await put(profile);
+                        await db.put(profile);
                     } else if(existing) {
-                        await update(profile.pubkey, { loaded: new Date().getTime() });
+                        await db.update(profile.pubkey, { loaded: new Date().getTime() });
                     }
                 }
             }
             let results = await this.RequestSubscription(sub);
             let couldNotFetch = Array.from(missing).filter(a => !results.some(b => b.pubkey === a));
             console.debug("No profiles: ", couldNotFetch);
-            await bulkPut(couldNotFetch.map(a => {
+            await db.bulkPut(couldNotFetch.map(a => {
                 return {
                     pubkey: a,
                     loaded: new Date().getTime()

src/State/Users.ts

@@ -1,8 +1,6 @@
 import { createSlice, PayloadAction } from '@reduxjs/toolkit'
 import { HexKey, TaggedRawEvent, UserMetadata } from "Nostr";
 import { hexToBech32 } from "../Util";
-import { db } from "Db";
-import store from "State/Store";
 
 export interface MetadataCache extends UserMetadata {
     /**
@@ -41,6 +39,18 @@ export function mapEventToProfile(ev: TaggedRawEvent) {
     }
 }
 
+export interface UsersDb {
+  isAvailable(): Promise<boolean>
+  query(str: string): Promise<MetadataCache[]>
+  find(key: HexKey): Promise<MetadataCache | undefined>
+  add(user: MetadataCache): Promise<any>
+  put(user: MetadataCache): Promise<any>
+  bulkAdd(users: MetadataCache[]): Promise<any>
+  bulkGet(keys: HexKey[]): Promise<MetadataCache[]>
+  bulkPut(users: MetadataCache[]): Promise<any>
+  update(key: HexKey, fields: Record<string, any>): Promise<any>
+}
+
 export interface UsersStore {
     /**
      * A list of seen users
@@ -60,87 +70,6 @@ const UsersSlice = createSlice({
     }
 });
 
-const { setUsers } = UsersSlice.actions
+export const { setUsers } = UsersSlice.actions
-
-function groupByPubkey(acc: Record<HexKey, MetadataCache>, user: MetadataCache) {
-  return { ...acc, [user.pubkey]: user }
-}
-
-export const add = async (user: MetadataCache) => {
-  try {
-    return await db.users.add(user)
-  } catch (error) {
-    const state = store.getState()
-    const { users } = state.users
-    store.dispatch(setUsers({...users, [user.pubkey]: user }))
-  }
-}
-
-export const bulkAdd = async (newUserProfiles: MetadataCache[]) => {
-  try {
-    return await db.users.bulkAdd(newUserProfiles)
-  } catch (error) {
-    const state = store.getState()
-    const { users } = state.users
-    const newUsers = newUserProfiles.reduce(groupByPubkey, {})
-    store.dispatch(setUsers({...users, ...newUsers }))
-  }
-}
-
-export const bulkGet = async (pubKeys: HexKey[]) => {
-  try {
-    const ret = await db.users.bulkGet(pubKeys);
-    return ret.filter(a => a !== undefined).map(a => a!);
-  } catch (error) {
-    const state = store.getState()
-    const { users } = state.users
-    const ids = new Set([...pubKeys])
-    return Object.values(users).filter(user => {
-      return ids.has(user.pubkey)
-    })
-  }
-}
-
-export const find = async (pubKey: HexKey) => {
-  try {
-    const user = await db.users.get(pubKey);
-    return user
-  } catch (error) {
-    const { users } = store.getState()
-    return users.users[pubKey]
-  }
-}
-
-export const put = async (user: MetadataCache) => {
-  try {
-    await db.users.put(user)
-  } catch (error) {
-    const state = store.getState()
-    const { users } = state.users
-    store.dispatch(setUsers({...users, [user.pubkey]: user }))
-  }
-}
-
-export const update = async (pubKey: HexKey, fields: Record<string, any>) => {
-  try {
-    await db.users.update(pubKey, fields)
-  } catch (error) {
-    const state = store.getState()
-    const { users } = state.users
-    const current = users[pubKey]
-    store.dispatch(setUsers({...users, [pubKey]: {...current, ...fields }}))
-  }
-}
-
-export const bulkPut = async (newUsers: MetadataCache[]) => {
-  try {
-    await db.users.bulkPut(newUsers)
-  } catch (error) {
-    const state = store.getState()
-    const { users } = state.users
-    const newProfiles = newUsers.reduce(groupByPubkey, {})
-    store.dispatch(setUsers({ ...users, ...newProfiles }))
-  }
-}
 
 export const reducer = UsersSlice.reducer;

src/State/Users/Db.ts

@@ -0,0 +1,137 @@
+import { HexKey } from "Nostr";
+import { db as idb } from "Db";
+
+import { UsersDb, MetadataCache, setUsers } from "State/Users";
+import store from "State/Store";
+
+class IndexedDb implements UsersDb {
+  async isAvailable() {
+    try {
+      const req = "indexedDb" in window && window.indexedDB.open('test', 1)
+      return Boolean(req)
+    } catch (error) {
+      return false
+    }
+  }
+
+  find(key: HexKey) {
+    return idb.users.get(key);
+  }
+
+  query(q: string) {
+    return idb.users
+            .where("npub").startsWithIgnoreCase(q)
+            .or("name").startsWithIgnoreCase(q)
+            .or("display_name").startsWithIgnoreCase(q)
+            .or("nip05").startsWithIgnoreCase(q)
+            .limit(5)
+            .toArray()
+  }
+
+  bulkGet(keys: HexKey[]) {
+    return idb.users.bulkGet(keys).then(ret => ret.filter(a => a !== undefined).map(a => a!));
+  }
+
+  add(user: MetadataCache) {
+    return idb.users.add(user)
+  }
+  
+  put(user: MetadataCache) {
+    return idb.users.put(user)
+  }
+
+  bulkAdd(users: MetadataCache[]) {
+    return idb.users.bulkAdd(users)
+  }
+
+  bulkPut(users: MetadataCache[]) {
+    return idb.users.bulkPut(users)
+  }
+
+  update(key: HexKey, fields: Record<string, any>) {
+    return idb.users.update(key, fields)
+  }
+}
+
+function groupByPubkey(acc: Record<HexKey, MetadataCache>, user: MetadataCache) {
+  return { ...acc, [user.pubkey]: user }
+}
+
+class ReduxUsersDb implements UsersDb {
+  async isAvailable() { return true }
+
+  async query(q: string) {
+    const state = store.getState()
+    const { users } = state.users
+    return Object.values(users).filter(user => {
+      const profile = user as MetadataCache
+      return profile.name?.includes(q)
+        || profile.npub?.includes(q)
+        || profile.display_name?.includes(q)
+        || profile.nip05?.includes(q)
+    })
+  }
+
+  async find(key: HexKey) {
+    const state = store.getState()
+    const { users } = state.users
+    return users[key]
+  }
+
+
+  async add(user: MetadataCache) {
+    const state = store.getState()
+    const { users } = state.users
+    store.dispatch(setUsers({...users, [user.pubkey]: user }))
+  }
+
+
+  async put(user: MetadataCache) {
+    const state = store.getState()
+    const { users } = state.users
+    store.dispatch(setUsers({...users, [user.pubkey]: user }))
+  }
+
+  async bulkAdd(newUserProfiles: MetadataCache[]) {
+    const state = store.getState()
+    const { users } = state.users
+    const newUsers = newUserProfiles.reduce(groupByPubkey, {})
+    store.dispatch(setUsers({...users, ...newUsers }))
+  }
+
+  async bulkGet(keys: HexKey[]) {
+    const state = store.getState()
+    const { users } = state.users
+    const ids = new Set([...keys])
+    return Object.values(users).filter(user => {
+      return ids.has(user.pubkey)
+    })
+  }
+
+  async update(key: HexKey, fields: Record<string, any>) {
+    const state = store.getState()
+    const { users } = state.users
+    const current = users[key]
+    const updated = {...current, ...fields }
+    store.dispatch(setUsers({...users, [key]: updated }))
+  }
+
+  async bulkPut(newUsers: MetadataCache[]) {
+    const state = store.getState()
+    const { users } = state.users
+    const newProfiles = newUsers.reduce(groupByPubkey, {})
+    store.dispatch(setUsers({ ...users, ...newProfiles }))
+  }
+}
+
+
+export const indexedDb = new IndexedDb()
+export const inMemoryDb = new ReduxUsersDb()
+
+let db: UsersDb = inMemoryDb
+indexedDb.isAvailable().then(() => {
+  console.debug('IndexedDB available')
+  db = indexedDb
+})
+
+export default db

src/State/Users/Hooks.ts

@@ -1,89 +1,51 @@
-import { useMemo } from "react";
-import { useSelector } from "react-redux";
 import { useLiveQuery } from "dexie-react-hooks";
-
-import { RootState } from "State/Store";
 import { MetadataCache } from "State/Users";
+import { indexedDb, inMemoryDb } from "State/Users/Db";
 import { HexKey } from "Nostr";
-import { db } from "Db";
 
 export function useQuery(query: string, limit: number = 5) {
-  const { users } = useSelector((state: RootState) => state.users)
-
-  const inMemoryUsers = useMemo(() => {
-    return Object.values(users).filter(user => {
-      const profile = user as MetadataCache
-      return profile.name?.includes(query)
-        || profile.npub?.includes(query)
-        || profile.display_name?.includes(query)
-        || profile.nip05?.includes(query)
-    })
-  }, [users, query])
-
   const allUsers = useLiveQuery(
-    () => db.users
+    () => indexedDb.query(query)
-          .where("npub").startsWithIgnoreCase(query)
-          .or("name").startsWithIgnoreCase(query)
-          .or("display_name").startsWithIgnoreCase(query)
-          .or("nip05").startsWithIgnoreCase(query)
-          .limit(5)
-          .toArray()
           .catch((err) => {
-            return inMemoryUsers
+            console.error(err)
+          }).then(() => {
+            return inMemoryDb.query(query)
           }),
-    [query, inMemoryUsers],
+    [query],
   )
 
   return allUsers
 }
 
 export function useKey(pubKey: HexKey) {
-  const { users } = useSelector((s: RootState) => s.users)
-
-  const inMemoryUser = useMemo(() => {
-    return users[pubKey]
-  }, [users, pubKey])
-
   const user = useLiveQuery(async () => {
       if (pubKey) {
         try {
-          return await db.users.get(pubKey);
+          return await indexedDb.find(pubKey);
         } catch (error) {
-          return inMemoryUser
+          console.error(error)
+          return await inMemoryDb.find(pubKey)
         }
       } 
-  }, [pubKey, inMemoryUser]);
+  }, [pubKey]);
 
   return user
 }
 
 export function useKeys(pubKeys: HexKey[]): Map<HexKey, MetadataCache> {
-  const { users } = useSelector((s: RootState) => s.users)
-
-  const inMemoryUsers = useMemo(() => {
-    const res = new Map()
-    Object.values(users).forEach(u => {
-      const profile = u as MetadataCache
-      if (pubKeys.includes(profile.pubkey)) {
-        res.set(profile.pubkey, profile)
-      }
-    })
-    return res
-  }, [users, pubKeys])
-
   const dbUsers = useLiveQuery(async () => {
       if (pubKeys) {
         try {
-          const ret = await db.users.bulkGet(pubKeys);
+          const ret = await indexedDb.bulkGet(pubKeys);
-          // @ts-ignore
           return new Map(ret.map(a => [a.pubkey, a]))
         } catch (error) {
-          return inMemoryUsers
+          console.error(error)
+          const ret = await inMemoryDb.bulkGet(pubKeys);
+          return new Map(ret.map(a => [a.pubkey, a]))
         }
       }
       return new Map()
-  }, [pubKeys, inMemoryUsers]);
+  }, [pubKeys]);
 
-  return dbUsers || inMemoryUsers
+  return dbUsers!
 }
-