Skip to content

[doc] online manager documentation seems wrong #8631

@fredericrous

Description

@fredericrous

Describe the bug

The documentation is I believe misleading for onlineManager

import { onlineManager } from '@tanstack/react-query'
import * as Network from 'expo-network'

onlineManager.setEventListener((setOnline) => {
  //
  // according to typescript typings and according to the test file, we should return a function
  // but here we return the object { remove: () => void }
  //
  return Network.addNetworkStateListener((state) => {
    setOnline(state.isConnected)
  })
})

link to documentation https://tanstack.com/query/latest/docs/framework/react/react-native#online-status-management

Your minimal, reproducible example

npx create-expo-app@latest

Steps to reproduce

apply code from https://tanstack.com/query/latest/docs/framework/react/react-native#online-status-management to your Expo project

configure tsconfig like so

{
  "extends": "expo/tsconfig.base",
  "compilerOptions": {
    "composite": true,
    "moduleResolution": "bundler",
    "strict": true,
    "noEmit": false
  },
  "include": [
    "**/*.ts",
    "**/*.tsx",
    ".expo/types/**/*.ts",
    "expo-env.d.ts"
  ]
}

Expected behavior

I believe the NetworkStateListener won't ever be removed if we follow the example. so expected behavior is both, no typescript throws and no memory leak

How often does this bug happen?

Every time

Screenshots or Videos

the example when I copy paste it in my code

Image

it throws on two spots:

  • addNetworkStateListener returns an object but a function is expected
  • isConnected can be undefined but setOnline argument definition is boolean

Looking at the tests, https://github.com/TanStack/query/blob/8f9f183f11df3709a1a38c4efce1452788041f88/packages/query-core/src/__tests__/onlineManager.test.tsx#L53C42-L53C52

I believe the documentation should be changed for:

onlineManager.setEventListener((setOnline) => {
   const eventsubscribtion = Network.addNetworkStateListener((state) => {
    setOnline(!!state.isConnected)
  })
  
  return eventsubscribtion.remove
})

Platform

  • VSCode: 1.96.4

Tanstack Query adapter

None

TanStack Query version

5.66.0

TypeScript version

5.3.3

Additional context

No response

Metadata

Metadata

Assignees

No one assigned

    Labels

    documentationImprovements or additions to documentation

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions