useSuspenseQuery when offline

What is the correct way to use useSuspenseQuery when offline?
I am using the

experimental_createPersister

experimental_createPersister

experimental_createPersister

experimental_createPersister so the network mode is set to

offlineFirst

offlineFirst

offlineFirst

offlineFirst. Whenever I render this when offline, and no data is persisted yet, the suspense fallback (

LoadingComponent

LoadingComponent

LoadingComponent

LoadingComponent) keeps showing. Instead I want a placeholder to tell the user they are offline and they should retry when online.

      <QueryErrorResetBoundary>
        {({ reset }) => (
          <ErrorBoundary
            onReset={reset}
            FallbackComponent={GenericFallback}
          >
            <Suspense fallback={<LoadingComponent />}>
              // some code using const { data } = useSuspenseQuery(...)
            </Suspense>
          </ErrorBoundary>
        )}
      </QueryErrorResetBoundary>

      <QueryErrorResetBoundary>
        {({ reset }) => (
          <ErrorBoundary
            onReset={reset}
            FallbackComponent={GenericFallback}
          >
            <Suspense fallback={<LoadingComponent />}>
              // some code using const { data } = useSuspenseQuery(...)
            </Suspense>
          </ErrorBoundary>
        )}
      </QueryErrorResetBoundary>

      <QueryErrorResetBoundary>
        {({ reset }) => (
          <ErrorBoundary
            onReset={reset}
            FallbackComponent={GenericFallback}
          >
            <Suspense fallback={<LoadingComponent />}>
              // some code using const { data } = useSuspenseQuery(...)
            </Suspense>
          </ErrorBoundary>
        )}
      </QueryErrorResetBoundary>

      <QueryErrorResetBoundary>
        {({ reset }) => (
          <ErrorBoundary
            onReset={reset}
            FallbackComponent={GenericFallback}
          >
            <Suspense fallback={<LoadingComponent />}>
              // some code using const { data } = useSuspenseQuery(...)
            </Suspense>
          </ErrorBoundary>
        )}
      </QueryErrorResetBoundary>

No replies yetBe the first to reply to this messageJoin

useSuspenseQuery when offline

Similar Threads

Similar Threads

Similar Threads