open.source/manifold
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Cache with react query instead of memoize

Browse Source
This commit is contained in:
Sinclair Chen 2022-09-08 12:47:44 -07:00
parent cc8de39eff
commit 07c1693eaf
2 changed files with 11 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
web/components/editor/mention-suggestion.ts
View File

@ -1,16 +1,13 @@
import type { MentionOptions } from '@tiptap/extension-mention' import type { MentionOptions } from '@tiptap/extension-mention'
import { ReactRenderer } from '@tiptap/react' import { ReactRenderer } from '@tiptap/react'
import { searchInAny } from 'common/util/parse' import { searchInAny } from 'common/util/parse'
import { memoize, orderBy } from 'lodash' import { orderBy } from 'lodash'
import tippy from 'tippy.js' import tippy from 'tippy.js'
import { getUsers } from 'web/lib/firebase/users' import { getCachedUsers } from 'web/hooks/use-users'
import { MentionList } from './mention-list' import { MentionList } from './mention-list'
type Suggestion = MentionOptions['suggestion'] type Suggestion = MentionOptions['suggestion']
const users = memoize(getUsers)
users() // prefetch
const beginsWith = (text: string, query: string) => const beginsWith = (text: string, query: string) =>
text.toLocaleLowerCase().startsWith(query.toLocaleLowerCase()) text.toLocaleLowerCase().startsWith(query.toLocaleLowerCase())
@ -18,7 +15,9 @@ const beginsWith = (text: string, query: string) =>
export const mentionSuggestion: Suggestion = { export const mentionSuggestion: Suggestion = {
items: async ({ query }) => items: async ({ query }) =>
orderBy( orderBy(
(await users()).filter((u) => searchInAny(query, u.username, u.name)), (await getCachedUsers()).filter((u) =>
searchInAny(query, u.username, u.name)
),
[ [
(u) => [u.name, u.username].some((s) => beginsWith(s, query)), (u) => [u.name, u.username].some((s) => beginsWith(s, query)),
'followerCountCached', 'followerCountCached',

7
web/hooks/use-users.ts
View File

@ -6,7 +6,8 @@ import { useFollows } from './use-follows'
import { useUser } from './use-user' import { useUser } from './use-user'
import { useFirestoreQueryData } from '@react-query-firebase/firestore' import { useFirestoreQueryData } from '@react-query-firebase/firestore'
import { DocumentData } from 'firebase/firestore' import { DocumentData } from 'firebase/firestore'
import { users, privateUsers } from 'web/lib/firebase/users' import { users, privateUsers, getUsers } from 'web/lib/firebase/users'
import { QueryClient } from 'react-query'
export const useUsers = () => { export const useUsers = () => {
const result = useFirestoreQueryData<DocumentData, User[]>(['users'], users, { const result = useFirestoreQueryData<DocumentData, User[]>(['users'], users, {
@ -16,6 +17,10 @@ export const useUsers = () => {
return result.data ?? [] return result.data ?? []
} }
const q = new QueryClient()
export const getCachedUsers = async () =>
q.fetchQuery(['users'], getUsers, { staleTime: Infinity })
export const usePrivateUsers = () => { export const usePrivateUsers = () => {
const result = useFirestoreQueryData<DocumentData, PrivateUser[]>( const result = useFirestoreQueryData<DocumentData, PrivateUser[]>(
['private users'], ['private users'],