diff --git a/web/hooks/use-fold.ts b/web/hooks/use-fold.ts index ffb19615..2c0230c4 100644 --- a/web/hooks/use-fold.ts +++ b/web/hooks/use-fold.ts @@ -34,9 +34,12 @@ export const useFolds = () => { export const useFoldsWithTags = (tags: string[] | undefined) => { const [folds, setFolds] = useState() + const tagsKey = tags?.join(',') + useEffect(() => { if (tags && tags.length > 0) return listenForFoldsWithTags(tags, setFolds) - }, [tags]) + // eslint-disable-next-line react-hooks/exhaustive-deps + }, [tagsKey]) return folds } @@ -44,9 +47,12 @@ export const useFoldsWithTags = (tags: string[] | undefined) => { export const useFollowingFold = (fold: Fold, user: User | null | undefined) => { const [following, setFollowing] = useState() + const foldId = fold?.id + const userId = user?.id + useEffect(() => { - if (user) return listenForFollow(fold, user, setFollowing) - }, [fold, user]) + if (userId) return listenForFollow(foldId, userId, setFollowing) + }, [foldId, userId]) return following } diff --git a/web/lib/firebase/folds.ts b/web/lib/firebase/folds.ts index ffe2bdef..92dc5be0 100644 --- a/web/lib/firebase/folds.ts +++ b/web/lib/firebase/folds.ts @@ -148,11 +148,11 @@ export async function unfollowFoldFromSlug(slug: string, userId: string) { } export function listenForFollow( - fold: Fold, - user: User, + foldId: string, + userId: string, setFollow: (following: boolean) => void ) { - const followDoc = doc(foldCollection, fold.id, 'followers', user.id) + const followDoc = doc(foldCollection, foldId, 'followers', userId) return listenForValue(followDoc, (value) => { setFollow(!!value) })