#434

frontend/src/pages/CountsResourcePage.tsx

@@ -91,8 +91,8 @@ const CountsResourceContent = (
   const [exporting, setExporting] = useState (false)
   const exportInFlight = useRef (false)
   const [exportError, setExportError] = useState (false)
-  const { data, dataUpdatedAt, isFetching, isPending, isError,
-      isPlaceholderData } = useQuery ({
+  const { data, dataUpdatedAt, isFetching: fetching, isPending: pending, isError: errorFlg,
+      isPlaceholderData: placeholder } = useQuery ({
       enabled: definition != null && params.has ('timezone') && !running,
       staleTime: params.has ('execution_at') ? 5 * 60 * 1000 : 0,
       queryKey: countsKeys.index (resource, cacheParams.toString (), locale),
@@ -104,7 +104,7 @@ const CountsResourceContent = (
 
   useEffect (() => {
     applied.current = params
-    if (data != null && !isPlaceholderData && !isError) retainedParams.current = params
+    if (data != null && !placeholder && !errorFlg) retainedParams.current = params
     const pending = pendingRun.current
     if (pending == null) return
     if (pending.target === canonical)
@@ -118,7 +118,7 @@ const CountsResourceContent = (
       void queryClient.cancelQueries ({ queryKey: pending.key, exact: true })
       setRunning (false)
     }
-  }, [canonical, data, isError, isPlaceholderData, params, queryClient, requestKey])
+  }, [canonical, data, errorFlg, placeholder, params, queryClient, requestKey])
 
   useEffect (() => {
     setRunning (false)
@@ -132,7 +132,7 @@ const CountsResourceContent = (
   }, [locale, queryClient, resource])
 
   useEffect (() => {
-    if (running || data == null || isPlaceholderData || isFetching || isError
+    if (running || data == null || placeholder || fetching || errorFlg
         || !params.has ('timezone')) return
     const next = new URLSearchParams (canonical)
     if (data.executionAt != null && !params.has ('execution_at'))
@@ -145,7 +145,7 @@ const CountsResourceContent = (
     }
     if (source.toString () !== next.toString ())
       setParams (next, { replace: true, preventScrollReset: true })
-  }, [canonical, data, dataUpdatedAt, isError, isFetching, isPlaceholderData,
+  }, [canonical, data, dataUpdatedAt, errorFlg, fetching, placeholder,
       locale, params, queryClient, resource, running, setParams, source])
 
 
@@ -206,11 +206,11 @@ const CountsResourceContent = (
       setRunError (true)
     }
   }
-  const resultParams = isPlaceholderData ? retainedParams.current : params
+  const resultParams = placeholder ? retainedParams.current : params
   const resultMode = resultParams.get ('mode') ?? 'summary'
   const waiting = running || (!definitionError && (definition == null
-      || isPending || isFetching || isPlaceholderData
-      || (!params.has ('execution_at') && !isError)))
+      || pending || fetching || placeholder
+      || (!params.has ('execution_at') && !errorFlg)))
 
 
   const update = (key: string, value: string, extra?: Record<string, string>) => {
@@ -324,7 +324,7 @@ const CountsResourceContent = (
 		style={{ minHeight: definition == null ? controlsHeight : undefined }}>
 	      {definition != null && <CountsControls key={`${resource}:${params.get ('definition')}`}
 		  resource={resource} applied={params}
-		  pending={running || isFetching || !params.has ('execution_at')}
+		  pending={running || fetching || !params.has ('execution_at')}
 		  open={open} setOpen={setOpen}
 		  reorder={value => update ('order', value)}
 		  displayJSON={enabled => update ('nested_json', enabled ? '1' : '0')}
@@ -338,15 +338,15 @@ const CountsResourceContent = (
 		  actions={<div className="ml-auto flex shrink-0 items-center gap-2">
 		    {(['csv', 'json'] as const).map (format => <Button key={format}
 			type="button" variant="outline" size="sm"
-			disabled={data == null || isError || isPlaceholderData
-			    || running || isFetching || exporting || !params.get ('execution_at')}
+			disabled={data == null || errorFlg || placeholder
+			    || running || fetching || exporting || !params.get ('execution_at')}
 			onClick={() => void download (format)}>
 		      {label (`exportFormats.${format}`)}</Button>)}
 		  </div>}/>}
 
 	      {exportError && <p role="alert">{label ('common:fetchError')}</p>}
 	    </div>
-	    {(definitionError || isError || runError) && <p role="alert">{label ('common:fetchError')}</p>}
+	    {(definitionError || errorFlg || runError) && <p role="alert">{label ('common:fetchError')}</p>}
 	    <div className="relative flex min-h-0 flex-1 flex-col overflow-hidden"
 		aria-busy={waiting}>
 	      <div inert={waiting} className="flex min-h-0 flex-1 flex-col">
@@ -382,11 +382,11 @@ const CountsResourceContent = (
 
 
 const CountsResourcePage = ({ resource }: { resource: CountsResource }) => {
-  const { data, isError } = useQuery ({
+  const { data, isError: errorFlg } = useQuery ({
       queryKey: countsKeys.definition (resource),
       queryFn: () => fetchCountsDefinition (resource), staleTime: Infinity })
   return <CountsDefinitionContext.Provider value={data ?? null}>
-    <CountsResourceContent resource={resource} definition={data} definitionError={isError}/>
+    <CountsResourceContent resource={resource} definition={data} definitionError={errorFlg}/>
   </CountsDefinitionContext.Provider>
 }