Fix offline transactions for React Native #1137

kevin-dp · 2026-01-15T13:54:29Z

Fix `@tanstack/offline-transactions` for React Native / Expo

This PR fixes #1013

Problem

The DefaultOnlineDetector attempted to use browser-specific APIs (window.addEventListener('online'), document.addEventListener('visibilitychange')) which don't exist in React Native. This caused errors when using the package in RN/Expo environments.

Solution

Introduced platform-specific OnlineDetector implementations:

WebOnlineDetector - Uses browser APIs (window.online/offline, document.visibilitychange)
ReactNativeOnlineDetector - Uses RN primitives (@react-native-community/netinfo for network status, AppState for foreground/background)

The RN implementation is exposed via a separate entrypoint to avoid bundling RN modules for web users.

Usage

Web (unchanged):

import { startOfflineExecutor } from '@tanstack/offline-transactions'

React Native / Expo:

import { startOfflineExecutor } from '@tanstack/offline-transactions/react-native'

The RN entrypoint automatically uses ReactNativeOnlineDetector. All other APIs remain the same.

Peer Dependencies (for RN users)

npm install @react-native-community/netinfo

The package declares react-native and @react-native-community/netinfo as optional peer dependencies.

changeset-bot · 2026-01-15T13:54:33Z

🦋 Changeset detected

Latest commit: 619bec1

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 2 packages

Name	Type
@tanstack/offline-transactions	Patch
offline-transactions-react-native	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

pkg-pr-new · 2026-01-15T13:58:46Z

More templates

@tanstack/angular-db

npm i https://pkg.pr.new/@tanstack/angular-db@1137

@tanstack/db

npm i https://pkg.pr.new/@tanstack/db@1137

@tanstack/db-ivm

npm i https://pkg.pr.new/@tanstack/db-ivm@1137

@tanstack/electric-db-collection

npm i https://pkg.pr.new/@tanstack/electric-db-collection@1137

@tanstack/offline-transactions

npm i https://pkg.pr.new/@tanstack/offline-transactions@1137

@tanstack/powersync-db-collection

npm i https://pkg.pr.new/@tanstack/powersync-db-collection@1137

@tanstack/query-db-collection

npm i https://pkg.pr.new/@tanstack/query-db-collection@1137

@tanstack/react-db

npm i https://pkg.pr.new/@tanstack/react-db@1137

@tanstack/rxdb-db-collection

npm i https://pkg.pr.new/@tanstack/rxdb-db-collection@1137

@tanstack/solid-db

npm i https://pkg.pr.new/@tanstack/solid-db@1137

@tanstack/svelte-db

npm i https://pkg.pr.new/@tanstack/svelte-db@1137

@tanstack/trailbase-db-collection

npm i https://pkg.pr.new/@tanstack/trailbase-db-collection@1137

@tanstack/vue-db

npm i https://pkg.pr.new/@tanstack/vue-db@1137

commit: 07980ca

github-actions · 2026-01-15T13:59:23Z

Size Change: 0 B

Total Size: 90.5 kB

ℹ️ View Unchanged

Filename	Size
`./packages/db/dist/esm/collection/change-events.js`	1.39 kB
`./packages/db/dist/esm/collection/changes.js`	1.19 kB
`./packages/db/dist/esm/collection/events.js`	388 B
`./packages/db/dist/esm/collection/index.js`	3.32 kB
`./packages/db/dist/esm/collection/indexes.js`	1.1 kB
`./packages/db/dist/esm/collection/lifecycle.js`	1.67 kB
`./packages/db/dist/esm/collection/mutations.js`	2.34 kB
`./packages/db/dist/esm/collection/state.js`	3.46 kB
`./packages/db/dist/esm/collection/subscription.js`	3.62 kB
`./packages/db/dist/esm/collection/sync.js`	2.38 kB
`./packages/db/dist/esm/deferred.js`	207 B
`./packages/db/dist/esm/errors.js`	4.49 kB
`./packages/db/dist/esm/event-emitter.js`	748 B
`./packages/db/dist/esm/index.js`	2.69 kB
`./packages/db/dist/esm/indexes/auto-index.js`	742 B
`./packages/db/dist/esm/indexes/base-index.js`	766 B
`./packages/db/dist/esm/indexes/btree-index.js`	1.93 kB
`./packages/db/dist/esm/indexes/lazy-index.js`	1.1 kB
`./packages/db/dist/esm/indexes/reverse-index.js`	513 B
`./packages/db/dist/esm/local-only.js`	837 B
`./packages/db/dist/esm/local-storage.js`	2.1 kB
`./packages/db/dist/esm/optimistic-action.js`	359 B
`./packages/db/dist/esm/paced-mutations.js`	496 B
`./packages/db/dist/esm/proxy.js`	3.75 kB
`./packages/db/dist/esm/query/builder/functions.js`	733 B
`./packages/db/dist/esm/query/builder/index.js`	4.08 kB
`./packages/db/dist/esm/query/builder/ref-proxy.js`	1.05 kB
`./packages/db/dist/esm/query/compiler/evaluators.js`	1.42 kB
`./packages/db/dist/esm/query/compiler/expressions.js`	430 B
`./packages/db/dist/esm/query/compiler/group-by.js`	1.87 kB
`./packages/db/dist/esm/query/compiler/index.js`	1.96 kB
`./packages/db/dist/esm/query/compiler/joins.js`	2 kB
`./packages/db/dist/esm/query/compiler/order-by.js`	1.45 kB
`./packages/db/dist/esm/query/compiler/select.js`	1.06 kB
`./packages/db/dist/esm/query/expression-helpers.js`	1.43 kB
`./packages/db/dist/esm/query/ir.js`	673 B
`./packages/db/dist/esm/query/live-query-collection.js`	360 B
`./packages/db/dist/esm/query/live/collection-config-builder.js`	5.4 kB
`./packages/db/dist/esm/query/live/collection-registry.js`	264 B
`./packages/db/dist/esm/query/live/collection-subscriber.js`	1.93 kB
`./packages/db/dist/esm/query/live/internal.js`	145 B
`./packages/db/dist/esm/query/optimizer.js`	2.56 kB
`./packages/db/dist/esm/query/predicate-utils.js`	2.97 kB
`./packages/db/dist/esm/query/subset-dedupe.js`	921 B
`./packages/db/dist/esm/scheduler.js`	1.3 kB
`./packages/db/dist/esm/SortedMap.js`	1.3 kB
`./packages/db/dist/esm/strategies/debounceStrategy.js`	247 B
`./packages/db/dist/esm/strategies/queueStrategy.js`	428 B
`./packages/db/dist/esm/strategies/throttleStrategy.js`	246 B
`./packages/db/dist/esm/transactions.js`	2.9 kB
`./packages/db/dist/esm/utils.js`	924 B
`./packages/db/dist/esm/utils/browser-polyfills.js`	304 B
`./packages/db/dist/esm/utils/btree.js`	5.61 kB
`./packages/db/dist/esm/utils/comparison.js`	852 B
`./packages/db/dist/esm/utils/cursor.js`	457 B
`./packages/db/dist/esm/utils/index-optimization.js`	1.51 kB
`./packages/db/dist/esm/utils/type-guards.js`	157 B

_{compressed-size-action::db-package-size}

github-actions · 2026-01-15T13:59:59Z

Size Change: 0 B

Total Size: 3.47 kB

ℹ️ View Unchanged

Filename	Size
`./packages/react-db/dist/esm/index.js`	225 B
`./packages/react-db/dist/esm/useLiveInfiniteQuery.js`	1.17 kB
`./packages/react-db/dist/esm/useLiveQuery.js`	1.12 kB
`./packages/react-db/dist/esm/useLiveSuspenseQuery.js`	559 B
`./packages/react-db/dist/esm/usePacedMutations.js`	401 B

_{compressed-size-action::react-db-package-size}

KyleAMathews · 2026-01-15T14:44:12Z

Can we document this in the readme?

kevin-dp · 2026-01-15T16:19:06Z

@claude update the readme of the @tanstack/offline-transactions package to explain how to use that package for web vs for React Native as i did in this PR description.

claude · 2026-01-15T16:19:30Z

Claude finished @kevin-dp's task in 1m 22s —— View job

Documentation updated successfully

Tasks completed

Read current README to understand structure
Update README with platform-specific usage instructions (web vs React Native)
Commit and push changes

Summary

I've updated the @tanstack/offline-transactions README to document the platform-specific usage for web vs React Native. The changes include:

Installation Section

Split into separate sections for Web and React Native/Expo
Documented the required @react-native-community/netinfo peer dependency for React Native

Platform Support Section (new)

Explained the different underlying APIs used:
- Web: Browser APIs (window.online/offline, document.visibilitychange)
- React Native: React Native primitives (@react-native-community/netinfo, AppState)

Quick Start Section

Split into separate examples for Web and React Native
Showed the different import paths:
- Web: import { ... } from '@tanstack/offline-transactions'
- React Native: import { ... } from '@tanstack/offline-transactions/react-native'
Emphasized that all other APIs remain identical between platforms

Platform Support Section (bottom)

Updated from "Browser Support" to "Platform Support"
Added React Native/Expo version requirements and storage details

The documentation now clearly guides users on how to use the package in both web and React Native environments, matching the implementation details from this PR.

--- •

packages/offline-transactions/README.md

… (issue #1013)

- Added separate installation instructions for web and React Native - Documented platform-specific OnlineDetector implementations - Clarified import path differences between platforms - Added React Native platform support details Co-authored-by: Kevin <[email protected]>

* test: assert DefaultOnlineDetector works in React Native environments (issue #1013) * OnlineDetector for RN * ci: apply automated fixes * Changeset * Offline transactions demo app for RN * Remove .expo folder from tracking * Updated .gitignore to ignore .expo cache * Add screencast to readme * ci: apply automated fixes * Fix versioning problems * Sherif fix package versions --------- Co-authored-by: autofix-ci[bot] <114827586+autofix-ci[bot]@users.noreply.github.com>

github-actions · 2026-01-19T17:13:18Z

🎉 This PR has been released!

@tanstack/[email protected]

Thank you for your contribution!

kevin-dp mentioned this pull request Jan 15, 2026

Example React Native app with offline transactions #1138

Merged

kevin-dp moved this to Ready for review in TanStack DB 1.0.0 release Jan 15, 2026

kevin-dp added this to TanStack DB 1.0.0 release Jan 15, 2026

kevin-dp commented Jan 15, 2026

View reviewed changes

packages/offline-transactions/README.md Show resolved Hide resolved

kevin-dp and others added 6 commits January 19, 2026 10:28

test: assert DefaultOnlineDetector works in React Native environments…

9e6d0ee

… (issue #1013)

OnlineDetector for RN

a5b1cd5

ci: apply automated fixes

a345d7a

Changeset

1e00a41

Fix readme

4a74163

kevin-dp force-pushed the ai/issue-1013-fix branch from 2118cbd to 4a74163 Compare January 19, 2026 09:29

ci: apply automated fixes

07980ca

kevin-dp requested a review from KyleAMathews January 19, 2026 09:36

KyleAMathews approved these changes Jan 19, 2026

View reviewed changes

kevin-dp merged commit d5254d1 into main Jan 19, 2026

kevin-dp deleted the ai/issue-1013-fix branch January 19, 2026 14:16

github-actions bot mentioned this pull request Jan 19, 2026

ci: Version Packages #1158

Merged

KyleAMathews moved this from Ready for review to Done in TanStack DB 1.0.0 release Jan 19, 2026

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

Fix offline transactions for React Native #1137

Fix offline transactions for React Native #1137

Uh oh!

kevin-dp commented Jan 15, 2026

Uh oh!

changeset-bot bot commented Jan 15, 2026 •

edited

Loading

Uh oh!

pkg-pr-new bot commented Jan 15, 2026 •

edited

Loading

Uh oh!

github-actions bot commented Jan 15, 2026 •

edited

Loading

Uh oh!

github-actions bot commented Jan 15, 2026 •

edited

Loading

Uh oh!

KyleAMathews commented Jan 15, 2026

Uh oh!

kevin-dp commented Jan 15, 2026

Uh oh!

claude bot commented Jan 15, 2026 •

edited

Loading

Uh oh!

Uh oh!

github-actions bot commented Jan 19, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

Fix offline transactions for React Native #1137

Fix offline transactions for React Native #1137

Uh oh!

Conversation

kevin-dp commented Jan 15, 2026

Fix @tanstack/offline-transactions for React Native / Expo

Problem

Solution

Usage

Peer Dependencies (for RN users)

Uh oh!

changeset-bot bot commented Jan 15, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

🦋 Changeset detected

Uh oh!

pkg-pr-new bot commented Jan 15, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

github-actions bot commented Jan 15, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

github-actions bot commented Jan 15, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

KyleAMathews commented Jan 15, 2026

Uh oh!

kevin-dp commented Jan 15, 2026

Uh oh!

claude bot commented Jan 15, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Documentation updated successfully

Tasks completed

Summary

Installation Section

Platform Support Section (new)

Quick Start Section

Platform Support Section (bottom)

Uh oh!

Uh oh!

github-actions bot commented Jan 19, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

Fix `@tanstack/offline-transactions` for React Native / Expo

changeset-bot bot commented Jan 15, 2026 •

edited

Loading

pkg-pr-new bot commented Jan 15, 2026 •

edited

Loading

github-actions bot commented Jan 15, 2026 •

edited

Loading

github-actions bot commented Jan 15, 2026 •

edited

Loading

claude bot commented Jan 15, 2026 •

edited

Loading