Disabled query should invalidate result

[WangLarry]

Duplicates

• [X] I have searched the existing issues

Latest version

• [X] I have tested the latest version

Current behavior 😯

fix: toolpad-core/useDataQuery.ts

export async function execDataSourceQuery(
  dataUrl: string,
  queryId: string,
  params: any,
  enabled = true,
) {
  if (!enabled) {
    return {};
  }

  ...
}

export function useDataQuery(
  dataUrl: string,
  queryId: string | null,
  params: any,
  {
    enabled = false,
    ...options
  }: Pick<
    UseQueryOptions<any, unknown, unknown, any[]>,
    'enabled' | 'refetchOnWindowFocus' | 'refetchOnReconnect' | 'refetchInterval'
  >,
): UseDataQuery {
  const {
    isLoading,
    isFetching,
    error,
    data: responseData = EMPTY_OBJECT,
    refetch,
  } = useQuery(
    [dataUrl, queryId, params, enabled],
    () => queryId && execDataSourceQuery(dataUrl, queryId, params, !!queryId && enabled),
    {
      ...options,
      enabled: !!queryId,
    },
  );
  ...

Expected behavior 🤔

after:

https://user-images.githubusercontent.com/5869244/193463385-5d251798-ca71-45cd-a960-cf9d7b40efa8.mov

Steps to reproduce 🕹

Steps:

Context 🔦

No response

Your environment 🌎

No response

[Janpot]

@WangLarry please fill out the issue template and describe the issue in terms of reproduction steps, expected behavior and actual behavior. Once we understand the root of your problem we can think of an appropriate fix.

[WangLarry]

If query's 'enabled' attribute value bind an expression, which can turn on/off this query. But when disabled(turn off) it, the result still show previous data(not show: no rows)

[Janpot]

turning off the "enabled" option prevents the query from making fetches. If it has cached data it will still show it. If that's not what you want, perhaps you could update the binding to something like queryEnabledCondition ? query. data : [].

We'll be working on cache control in the future: https://github.com/mui/mui-toolpad/issues/1093