TanStackT
TanStack5mo ago
2 replies
urgent-maroon

How can I get the returned type from select

hey folks, I have this parent component which call a useQuery
const bucketsOption = ({ accountId }: { accountId: string }) => {
  return queryOptions({
    queryKey: trafficRepartitionKeys.buckets(),
    queryFn: () => apiClient.featureExp.buckets.list({ accountId }),
    placeholderData: keepPreviousData,
    retry: false,
    select: (data) => ({
      ...data,
      items: data.items.map((item) => ({
        ...item,
        count_campaigns_per_status: {
          ...item.count_campaigns_per_status,
          total: Object.values(item.count_campaigns_per_status ?? {}).reduce((acc, curr) => acc + curr, 0),
        },
      })),
    }),
  });
};

export const useBuckets = () => {
  const accountId = useCurrentFlagshipAccountId();

  return useQuery(bucketsOption({ accountId }));
};


export const BucketList = () => {
  const buckets = useBuckets();

  return (
    <div>
      {buckets.data?.items.map((item) => (
        <BucketTable key={item.id} bucket={item} />
      ))}
    </div>
  );
};

I wanted to type the props in the BucketTable component, how can I do that (notice that there is a select which add a property in the useQuery data

export const BucketTable = ({ bucket }: { bucket: ??? }) => {
Was this page helpful?