[data] useQuery hangs forever instead of returning network error on bad URL

[einar-hjortdal]

I am trying to use data. ~~It seems like useQuery hangs until timeout if the server api object contains a fetch call. ~~ ~~The API endpoint receives no requests, as if fetch was not called.~~

// On the server
const api = {
    // retrieveAdmin: () => fetch(`${config.apiUrl}/euxenite/auth`) // this hangs the server
    retrieveAdmin: () => fetch(`https://google.com`) // this works
    // retrieveAdmin: () => new Promise((resolve) => { // this works fine
    //  setTimeout(() => {
    //    resolve(testObject)
    //  }, 1000)
    // })
  }
}

// In the component
const res = useQuery('adminData', api.retrieveAdmin)

~~I am on Bun, Bun does support fetch, and it shouldn't be the cause of the issue. Is the server implementation of data supposed to work differently?~~

It looks like the problem is not fetch. The api url I provided was bad, but I did not expect useQuery to hang forever, I expected a network error to be returned

I noticed that the server waits the 1s timeout I set before it returns the response to the browser (of course). In testing, with the api on the same machine, there shouldn't be much wait time. But in production, what happens if a data source doesn't respond quickly enough? Because useQuery uses the api object that has the same type on server and browser, is it impossible to useQuery on browser only for some api properties? Or maybe a way to use useQuery on the browser only, despite a SSR setup?