const convex = useConvex();

    const fetchScores = async (pageParam: string | null) => {
        const response = await convex.query(api.scorecards.getScorecards, {
            tier: tier,
            paginationOpts: {
                numItems: 5,
                cursor: pageParam,
            },
        });

        return response
    };

    const { data: infinite, fetchNextPage } = useInfiniteQuery({
        queryKey: [`scorecard-${tier}`],
        queryFn: ({ pageParam }: { pageParam?: string | null }) => fetchScores(pageParam ?? null),
        getNextPageParam: (lastPage) => {
            return lastPage.isDone ? undefined : lastPage.continueCursor;
        },
        initialPageParam: null,
        // refetchInterval: 10000
    })

    const convex = useConvex();

    const fetchScores = async (pageParam: string | null) => {
        const response = await convex.query(api.scorecards.getScorecards, {
            tier: tier,
            paginationOpts: {
                numItems: 5,
                cursor: pageParam,
            },
        });

        return response
    };

    const { data: infinite, fetchNextPage } = useInfiniteQuery({
        queryKey: [`scorecard-${tier}`],
        queryFn: ({ pageParam }: { pageParam?: string | null }) => fetchScores(pageParam ?? null),
        getNextPageParam: (lastPage) => {
            return lastPage.isDone ? undefined : lastPage.continueCursor;
        },
        initialPageParam: null,
        // refetchInterval: 10000
    })

const { data, isPending, error } = useQuery({
  ...convexQuery(api.functions.myQuery, { id: 123 }),
  initialData: [], // use an empty list if no data is available yet
  gcTime: 10000, // stay subscribed for 10 seconds after this component unmounts
});

const { data, isPending, error } = useQuery({
  ...convexQuery(api.functions.myQuery, { id: 123 }),
  initialData: [], // use an empty list if no data is available yet
  gcTime: 10000, // stay subscribed for 10 seconds after this component unmounts
});