Make queries reactive

When passing a query object to a component like this:

  const dataQuery = useQuery(() => ({
    queryKey: ['price'],
    queryFn: fetchStoragePrice,
  }))
// ...
     <Match when={dataQuery.isSuccess}>
        <StoragePriceDisplay
          {...{ capacityUnit, timeUnit }}
          storagePrice={dataQuery.data!}
          bzzPrice={bzzPrice}
          unit={() => `${currency()}/${capacityUnit()}-${timeUnit()}`}
        />

  const dataQuery = useQuery(() => ({
    queryKey: ['price'],
    queryFn: fetchStoragePrice,
  }))
// ...
     <Match when={dataQuery.isSuccess}>
        <StoragePriceDisplay
          {...{ capacityUnit, timeUnit }}
          storagePrice={dataQuery.data!}
          bzzPrice={bzzPrice}
          unit={() => `${currency()}/${capacityUnit()}-${timeUnit()}`}
        />

  const dataQuery = useQuery(() => ({
    queryKey: ['price'],
    queryFn: fetchStoragePrice,
  }))
// ...
     <Match when={dataQuery.isSuccess}>
        <StoragePriceDisplay
          {...{ capacityUnit, timeUnit }}
          storagePrice={dataQuery.data!}
          bzzPrice={bzzPrice}
          unit={() => `${currency()}/${capacityUnit()}-${timeUnit()}`}
        />

  const dataQuery = useQuery(() => ({
    queryKey: ['price'],
    queryFn: fetchStoragePrice,
  }))
// ...
     <Match when={dataQuery.isSuccess}>
        <StoragePriceDisplay
          {...{ capacityUnit, timeUnit }}
          storagePrice={dataQuery.data!}
          bzzPrice={bzzPrice}
          unit={() => `${currency()}/${capacityUnit()}-${timeUnit()}`}
        />

it doesn't react to changes of the data. passing the whole object doesn't work either. do i have to wrap every single query into a signal in order for components to react to changes?

Make queries reactive

Similar Threads

Similar Threads

Similar Threads