Press n or j to go to the next uncovered block, b, p or k for the previous block.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 | 30x 30x 30x 30x 30x 30x 30x 3205x 3205x 3205x 527x 5x 18x 3205x 428x 3205x 3201x 99x 99x 3205x 4121x 3946x 228x 3205x 3946x 3946x 3764x 3549x 3205x 3205x 3205x 3381x 3205x 30x 1928x 1928x | import { userKey } from "features/queryKeys"; import { userStaleTime } from "features/userQueries/constants"; import { User } from "proto/api_pb"; import { useCallback, useEffect, useRef } from "react"; import { useQueries, useQueryClient } from "react-query"; import { service } from "service"; import { arrayEq } from "utils/arrayEq"; export default function useUsers( ids: (number | undefined)[], invalidate = false ) { const queryClient = useQueryClient(); const idsRef = useRef(ids); const handleInvalidation = useCallback(() => { if (invalidate) { queryClient.invalidateQueries({ predicate: (query) => query.queryKey[0] === userKey() && !!idsRef.current.includes(query.queryKey[1] as number), }); } }, [invalidate, queryClient]); useEffect(() => { handleInvalidation(); }, [handleInvalidation]); //arrays use reference equality, so you can't use ids in useEffect directly useEffect(() => { if (!arrayEq(idsRef.current, ids)) { idsRef.current = ids; handleInvalidation(); } }); const queries = useQueries<User.AsObject, Error>( ids .filter((id): id is number => !!id) .map((id) => ({ queryFn: () => service.user.getUser(id.toString()), queryKey: userKey(id), staleTime: userStaleTime, })) ); const errors = queries .map((query) => query.error?.message) .filter((e): e is string => typeof e === "string"); const isLoading = queries.some((query) => query.isLoading); const isFetching = queries.some((query) => query.isFetching); // If at least one user query is not loading (i.e. has data loaded before), whilst // some other (likely new) queries are fetching, then it's a refetch const isRefetching = !queries.every((query) => query.isLoading) && isFetching; const isError = !!errors.length; const usersById = isLoading ? undefined : new Map(queries.map((q, index) => [ids[index], q.data])); return { data: usersById, errors, isError, isFetching, isLoading, isRefetching, }; } export function useUser(id: number | undefined, invalidate = false) { const result = useUsers([id], invalidate); return { data: result.data?.get(id), error: result.errors.join("\n"), isError: result.isError, isFetching: result.isFetching, isLoading: result.isLoading, }; } |