## Summary Fixes #57 — the `@dev-plugins/apollo-client` plugin throws / stops reporting queries and mutations under Apollo Client v4. Two internals the plugin relied on changed shape in v4: - `getOperationName` moved from `@apollo/client/utilities` to `@apollo/client/utilities/internal` (this is what the linked issue comment flagged). - The private `client.queryManager.queries` `Map` is gone in v4, replaced by `obsQueries` (not equivalent), and `ObservableQuery.queryId` was removed. Rather than branching on the installed version, this switches to APIs that are public and stable across both majors: - Inlines the (trivial) `getOperationName` lookup instead of importing it, so it's no longer tied to either import path. - Replaces `client.queryManager.queries` with the public `client.getObservableQueries()` (a `Map` in v3, a `Set` in v4 — normalized into an array). - Reads `document`/`variables`/`queryName` directly off each `ObservableQuery` (public in both versions) instead of the private `QueryInfo` map entry, and uses `getCurrentResult().data` for cached data instead of the private `diff`/`lastDiff`. - Falls back to a generated id when `ObservableQuery.queryId` isn't present (v4). - `ApolloClientType` is now a small duck-typed interface instead of `ApolloClient<NormalizedCacheObject>`, since the `ApolloClient` class generic was removed entirely in v4 and the old type couldn't compile against both majors at once. - Declares `@apollo/client` as a `peerDependencies` range (`^3.8.0 || ^4.0.0`) — it was previously undeclared. `client.queryManager.mutationStore` is unchanged in shape between v3 and v4, so the mutations path didn't need changes. ## Test plan - [x] `tsc --noEmit` passes with `@apollo/[email protected]` installed - [x] `tsc --noEmit` passes with `@apollo/[email protected]` installed - [x] Added `src/__tests__/utils.test.ts` covering the new `getOperationName` lookup and the `Map`/`Set` normalization; passes under the package's existing jest preset - [ ] Manual check in the example app against both `@apollo/client` v3 and v4 (queries + a mutation) — happy to do this if useful before merge --------- Co-authored-by: Vojtech Novak <[email protected]> Co-authored-by: Claude Fable 5.1 <[email protected]>
Expo DevTools Plugins
- A collection of Expo DevTools Plugins.
- The repository here is a Proof-Of-Concept for Expo DevTools Plugins and showing the migration effort for moving Flipper Plugins to Expo DevTools Plugins.
Awesome Plugins
-
@dev-plugins/apollo-client: Plugin for Apollo Client- Credit: Most code is forked from react-query-apollo-devtools
-
@dev-plugins/react-query: Plugin for TanStack Query- Credit: Most code is forked from react-query-native-devtools
-
@dev-plugins/async-storage: Plugin for @react-native-async-storage/async-storage- Credit: Originally contributed by jthoward64
-
@dev-plugins/react-native-mmkv: Plugin for react-native-mmkv- Credit: Originally contributed by cyrilbo
-
redux-devtools-expo-dev-plugin: A plugin for redux with the full Redux DevTools (from the Chrome extension)- Credit: Matt Oakes and based Redux DevTools
-
file-explorer-expo-dev-plugin: Plugin for debugging expo-file-system operations- Credit: Dmytro Kulahin
-
@bam.tech/react-navigation-visualizer-dev-plugin: Plugin for React Navigation- Credit: Most code is forked from @react-navigation/devtools and the Flipper plugin frontend
Contributions
Due to the current bandwidth limitations of our team, we are unable to accept new plugin pull requests in this repository. We recommend developers to create and maintain their plugins in their own npm accounts.
However, we understand the value of community contributions and would love to showcase your work. This repository serves as a gallery for awesome plugins. If you have created a plugin and would like to share it with the community, you are welcome to submit a pull request to introduce your plugin in this README.
When submitting a pull request, please include the following:
- Name of the plugin
- Brief description of what the plugin does
- Link to the plugin's repository
We appreciate your understanding and look forward to your contributions!
Example App
The example app is an Expo Router app that provides test cases for plugins
- Expo Router is based on React Navigation, so you can just test
@dev-plugins/react-navigationfrom visiting different screens from the app. Apollo Client: Apollo Client example forked from https://www.apollographql.com/docs/react/get-started/React Query: React Query example forked from https://github.com/TanStack/query/tree/5b9be1e299257e32c4c294796711f5d82f968530/examples/react/react-nativeReact Query Time: React Query example forked from https://github.com/bgaleotti/react-query-native-devtools/tree/799efff17b08e9793ab27d5a93457c5d5510233c/apps/Time
How to run the example app
$ git clone https://github.com/expo/dev-plugins.git
$ cd dev-plugins
$ cd apps/example
$ bun run ios
$ bun run android