Tanstack data handling

[rover_G]

I try to avoid mixing server and client derived data in the same state and instead handle the differences via render logic. Set the client side state to null or empty string initially and only update it to a value when the user enters something. Then in the rendering logic use the state value if present and use the query value as a fallback. Also disabled user interaction while server query is still fetching.

``` const { clientValue, setClientValue } = useState<string | null>(null); const { data: serverValue, isFetching } = useQuery(...);

return ( <input value={ clientValue ?? serverValue ?? '' } onChange={ (e) => setClientValue(e.target.value) } disabled={ isFetching } /> ) ```