Fix report dialog flashing error state on open (#10099)

src/components/hooks/useDelayedLoading.ts

@@ -1,15 +1,14 @@
 import {useEffect, useState} from 'react'
 
-export function useDelayedLoading(delay: number, initialState: boolean = true) {
+export function useDelayedLoading(delay: number, isActuallyLoading: boolean) {
-  const [isLoading, setIsLoading] = useState(initialState)
+  const [isDelayActive, setIsDelayActive] = useState(isActuallyLoading)
 
   useEffect(() => {
-    let timeout: NodeJS.Timeout
+    if (!isDelayActive) return
-    // on initial load, show a loading spinner for a hot sec to prevent flash
-    if (isLoading) timeout = setTimeout(() => setIsLoading(false), delay)
 
-    return () => timeout && clearTimeout(timeout)
+    const timeout = setTimeout(() => setIsDelayActive(false), delay)
-  }, [isLoading, delay])
+    return () => clearTimeout(timeout)
+  }, [isDelayActive, delay])
 
-  return isLoading
+  return isDelayActive || isActuallyLoading
 }