Skip to content

fix(expo): synchronous QueryClient for React Native#8087

Open
chriscanin wants to merge 1 commit intomainfrom
chris/fix-query-client-rn
Open

fix(expo): synchronous QueryClient for React Native#8087
chriscanin wants to merge 1 commit intomainfrom
chris/fix-query-client-rn

Conversation

@chriscanin
Copy link
Member

@chriscanin chriscanin commented Mar 16, 2026

Summary

  • clerk-js lazily loads QueryClient from @tanstack/query-core via rspack's dynamic import('./query-core') code-splitting
  • On React Native, Metro bundles everything into a single file — rspack's chunk loading (l.e("675")) never resolves, so clerk.__internal_queryClient stays undefined
  • The useClerkQueryClient hook falls back to a no-op mock proxy when undefined, causing useOrganizationList, useSessionList, and other query-based hooks to silently return empty data
  • Fix: Object.defineProperty override in createClerkInstance.ts that synchronously creates a QueryClient via require('@tanstack/query-core') on first access, returning the expected { __tag: 'clerk-rq-client', client } shape

Reported by

Donovan (internal) — useOrganizationList returns empty data on React Native

Test plan

  • @clerk/expo builds successfully with the change
  • TypeScript declarations pass
  • Verify useOrganizationList returns data on React Native after fix
  • Verify other query-based hooks (useSessionList, etc.) work correctly

🤖 Generated with Claude Code

Summary by CodeRabbit

  • Bug Fixes
    • Fixed useOrganizationList and other query-based hooks returning empty data on React Native environments. Ensured proper initialization of internal query client for Expo applications.

…lity

clerk-js uses rspack code-splitting to lazily load QueryClient via
dynamic import('./query-core'). On React Native, Metro bundles everything
into a single file, so rspack's chunk loading never resolves and
__internal_queryClient stays undefined.

The useClerkQueryClient hook falls back to a no-op mock proxy when the
query client is undefined, causing hooks like useOrganizationList,
useSessionList, etc. to silently return empty data.

Fix: use Object.defineProperty to override the broken getter on the Clerk
instance with a synchronous version that creates a QueryClient via
require('@tanstack/query-core') on first access.
@changeset-bot
Copy link

changeset-bot bot commented Mar 16, 2026

🦋 Changeset detected

Latest commit: 8cc330d

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

This PR includes changesets to release 1 package
Name Type
@clerk/expo 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

@github-actions github-actions bot added the expo label Mar 16, 2026
@vercel
Copy link

vercel bot commented Mar 16, 2026

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
clerk-js-sandbox Ready Ready Preview, Comment Mar 16, 2026 4:39pm

Request Review

@pkg-pr-new
Copy link

pkg-pr-new bot commented Mar 16, 2026

Open in StackBlitz

@clerk/agent-toolkit

npm i https://pkg.pr.new/@clerk/agent-toolkit@8087

@clerk/astro

npm i https://pkg.pr.new/@clerk/astro@8087

@clerk/backend

npm i https://pkg.pr.new/@clerk/backend@8087

@clerk/chrome-extension

npm i https://pkg.pr.new/@clerk/chrome-extension@8087

@clerk/clerk-js

npm i https://pkg.pr.new/@clerk/clerk-js@8087

@clerk/dev-cli

npm i https://pkg.pr.new/@clerk/dev-cli@8087

@clerk/expo

npm i https://pkg.pr.new/@clerk/expo@8087

@clerk/expo-passkeys

npm i https://pkg.pr.new/@clerk/expo-passkeys@8087

@clerk/express

npm i https://pkg.pr.new/@clerk/express@8087

@clerk/fastify

npm i https://pkg.pr.new/@clerk/fastify@8087

@clerk/hono

npm i https://pkg.pr.new/@clerk/hono@8087

@clerk/localizations

npm i https://pkg.pr.new/@clerk/localizations@8087

@clerk/nextjs

npm i https://pkg.pr.new/@clerk/nextjs@8087

@clerk/nuxt

npm i https://pkg.pr.new/@clerk/nuxt@8087

@clerk/react

npm i https://pkg.pr.new/@clerk/react@8087

@clerk/react-router

npm i https://pkg.pr.new/@clerk/react-router@8087

@clerk/shared

npm i https://pkg.pr.new/@clerk/shared@8087

@clerk/tanstack-react-start

npm i https://pkg.pr.new/@clerk/tanstack-react-start@8087

@clerk/testing

npm i https://pkg.pr.new/@clerk/testing@8087

@clerk/ui

npm i https://pkg.pr.new/@clerk/ui@8087

@clerk/upgrade

npm i https://pkg.pr.new/@clerk/upgrade@8087

@clerk/vue

npm i https://pkg.pr.new/@clerk/vue@8087

commit: 8cc330d

@chriscanin chriscanin self-assigned this Mar 16, 2026
@coderabbitai
Copy link
Contributor

coderabbitai bot commented Mar 16, 2026

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration

Configuration used: Repository YAML (base), Organization UI (inherited)

Review profile: ASSERTIVE

Plan: Pro

Run ID: b5fba845-1d3d-457a-9a2e-aabe28a1ca32

📥 Commits

Reviewing files that changed from the base of the PR and between da2b239 and 8cc330d.

📒 Files selected for processing (2)
  • .changeset/fix-query-client-rn.md
  • packages/expo/src/provider/singleton/createClerkInstance.ts

📝 Walkthrough

Walkthrough

This pull request adds a changeset entry documenting a patch release and includes a runtime workaround for React Native environments. The change addresses an issue where query-based hooks, such as useOrganizationList, were returning empty data. The fix involves synchronously creating and providing a TanStack QueryClient instance in the Clerk instance initialization. Specifically, a lazy-initialized getter is added to ensure the QueryClient is available on first access, working around code-splitting and chunk loading issues that previously left the QueryClient undefined.

🚥 Pre-merge checks | ✅ 2 | ❌ 1

❌ Failed checks (1 warning)

Check name Status Explanation Resolution
Docstring Coverage ⚠️ Warning Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%. Write docstrings for the functions missing them to satisfy the coverage threshold.
✅ Passed checks (2 passed)
Check name Status Explanation
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check ✅ Passed The title 'fix(expo): synchronous QueryClient for React Native' clearly and concisely summarizes the main change: implementing a synchronous QueryClient for React Native environments in the expo package to fix the issue where query-based hooks return empty data.

✏️ Tip: You can configure your own custom pre-merge checks in the settings.

📝 Coding Plan
  • Generate coding plan for human review comments

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands and usage tips.

Tip

CodeRabbit can use your project's `biome` configuration to improve the quality of JS/TS/CSS/JSON code reviews.

Add a configuration file to your project to customize how CodeRabbit runs biome.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant