From cae0d956d43f5fe40a75aabeb1f68732646e9417 Mon Sep 17 00:00:00 2001 From: Manuel Schiller Date: Fri, 3 Jan 2025 12:38:38 +0100 Subject: [PATCH 1/2] feat: add @urql/tanstack-react-router --- .changeset/afraid-colts-sort.md | 5 + docs/advanced/server-side-rendering.md | 55 ++- .../tanstack-react-router-urql/CHANGELOG.md | 1 + packages/tanstack-react-router-urql/README.md | 5 + packages/tanstack-react-router-urql/jsr.json | 15 + .../tanstack-react-router-urql/package.json | 52 +++ .../src/Provider.ts | 54 +++ .../tanstack-react-router-urql/src/index.ts | 3 + .../src/useQuery.ts | 216 ++++++++++ .../src/useUrqlValue.ts | 46 +++ .../tanstack-react-router-urql/tsconfig.json | 4 + .../vitest.config.ts | 4 + pnpm-lock.yaml | 375 +++++------------- 13 files changed, 548 insertions(+), 287 deletions(-) create mode 100644 .changeset/afraid-colts-sort.md create mode 100644 packages/tanstack-react-router-urql/CHANGELOG.md create mode 100644 packages/tanstack-react-router-urql/README.md create mode 100644 packages/tanstack-react-router-urql/jsr.json create mode 100644 packages/tanstack-react-router-urql/package.json create mode 100644 packages/tanstack-react-router-urql/src/Provider.ts create mode 100644 packages/tanstack-react-router-urql/src/index.ts create mode 100644 packages/tanstack-react-router-urql/src/useQuery.ts create mode 100644 packages/tanstack-react-router-urql/src/useUrqlValue.ts create mode 100644 packages/tanstack-react-router-urql/tsconfig.json create mode 100644 packages/tanstack-react-router-urql/vitest.config.ts diff --git a/.changeset/afraid-colts-sort.md b/.changeset/afraid-colts-sort.md new file mode 100644 index 0000000000..acfa2a6632 --- /dev/null +++ b/.changeset/afraid-colts-sort.md @@ -0,0 +1,5 @@ +--- +'@urql/tanstack-react-router': major +--- + +initial implementation of TanStack Router / Start Integration diff --git a/docs/advanced/server-side-rendering.md b/docs/advanced/server-side-rendering.md index 7112ad4b68..48942cc6c5 100644 --- a/docs/advanced/server-side-rendering.md +++ b/docs/advanced/server-side-rendering.md @@ -111,13 +111,7 @@ Next, we'll modify our server-side code and add `react-ssr-prepass` in front of import { renderToString } from 'react-dom/server'; import prepass from 'react-ssr-prepass'; -import { - Client, - cacheExchange, - fetchExchange, - ssrExchange, - Provider, -} from 'urql'; +import { Client, cacheExchange, fetchExchange, ssrExchange, Provider } from 'urql'; const handleRequest = async (req, res) => { // ... @@ -126,7 +120,7 @@ const handleRequest = async (req, res) => { const client = new Client({ url: 'https://??', suspense: true, // This activates urql's Suspense mode on the server-side - exchanges: [cacheExchange, ssr, fetchExchange] + exchanges: [cacheExchange, ssr, fetchExchange], }); const element = ( @@ -577,6 +571,51 @@ is an uncommon scenario, and we consider it "unsafe" so evaluate this carefully When this does seem like the appropriate solution any component wrapped with `withUrqlClient` will receive the `resetUrqlClient` property, when invoked this will create a new top-level client and reset all prior operations. +## TanStack Router / TanStack Start + +If you're using SSR with [TanStack Router](https://tanstack.com/router) or [TanStack Start](https://tanstack.com/start) you can use the `@urql/tanstack-react-router` package. + +To set up `@urql/tanstack-react-router`, first we'll install `@urql/tanstack-react-router` and `urql`: + +```sh +pnpm add @urql/tanstack-react-router urql graphql +# or +npm install --save @urql/tanstack-react-router urql graphql +``` + +Then instantiate a client with a SSR Exchange and make sure the `UrqlProvider` is rendered around the routes: + +```tsx +// router.tsx +import { createRouter } from '@tanstack/react-router'; + +import { + UrqlProvider, + ssrExchange, + cacheExchange, + fetchExchange, + createClient, +} from '@urql/tanstack-react-router'; + +const ssr = ssrExchange(); +const client = createClient({ + url: 'https://trygql.formidable.dev/graphql/basic-pokedex', + exchanges: [cacheExchange, ssr, fetchExchange], + suspense: true, +}); + +const router = createRouter({ + routeTree, + Wrap: ({ children }) => ( + + {children} + + ), +}); +``` + +Then in your React components use the `useQuery` from `@urql/tanstack-react-router`. + ## Vue Suspense In Vue 3 a [new feature was introduced](https://vuedose.tips/go-async-in-vue-3-with-suspense/) that diff --git a/packages/tanstack-react-router-urql/CHANGELOG.md b/packages/tanstack-react-router-urql/CHANGELOG.md new file mode 100644 index 0000000000..825c32f0d0 --- /dev/null +++ b/packages/tanstack-react-router-urql/CHANGELOG.md @@ -0,0 +1 @@ +# Changelog diff --git a/packages/tanstack-react-router-urql/README.md b/packages/tanstack-react-router-urql/README.md new file mode 100644 index 0000000000..48db1e7ea4 --- /dev/null +++ b/packages/tanstack-react-router-urql/README.md @@ -0,0 +1,5 @@ +## `tanstack-react-router-urql` + +A set of convenience utilities for using `urql` with SSR and `@tanstack/react-router` / `@tanstack/start`. + +More documentation is available at https://urql.dev/goto/docs/advanced/server-side-rendering/#tanstack--router-tanstack-start diff --git a/packages/tanstack-react-router-urql/jsr.json b/packages/tanstack-react-router-urql/jsr.json new file mode 100644 index 0000000000..1b32e7c787 --- /dev/null +++ b/packages/tanstack-react-router-urql/jsr.json @@ -0,0 +1,15 @@ +{ + "name": "@urql/tanstack-react-router", + "version": "1.0.0", + "exports": { + ".": "./src/index.ts" + }, + "exclude": [ + "node_modules", + "cypress", + "**/*.test.*", + "**/*.spec.*", + "**/*.test.*.snap", + "**/*.spec.*.snap" + ] +} diff --git a/packages/tanstack-react-router-urql/package.json b/packages/tanstack-react-router-urql/package.json new file mode 100644 index 0000000000..a0e47818e0 --- /dev/null +++ b/packages/tanstack-react-router-urql/package.json @@ -0,0 +1,52 @@ +{ + "name": "@urql/tanstack-react-router", + "version": "1.0.0", + "description": "Convenience wrappers for using urql with SSR in @tanstack/react-router and @tanstack/start", + "sideEffects": false, + "homepage": "https://formidable.com/open-source/urql/docs/", + "bugs": "https://github.com/urql-graphql/urql/issues", + "license": "MIT", + "author": "Manuel Schiller", + "repository": { + "type": "git", + "url": "https://github.com/urql-graphql/urql.git", + "directory": "packages/tanstack-react-router-urql" + }, + "main": "dist/urql-tanstack-react-router.js", + "module": "dist/urql-tanstack-react-router.es.js", + "types": "dist/urql-tanstack-react-router.d.ts", + "source": "src/index.ts", + "files": [ + "LICENSE", + "CHANGELOG.md", + "README.md", + "dist/" + ], + "scripts": { + "clean": "rimraf dist", + "check": "tsc --noEmit", + "lint": "eslint --ext=js,jsx,ts,tsx .", + "build": "rollup -c ../../scripts/rollup/config.mjs", + "prepare": "node ../../scripts/prepare/index.js", + "prepublishOnly": "run-s clean build" + }, + "devDependencies": { + "@urql/core": "workspace:*", + "urql": "workspace:*", + "@types/react": "^18.3.8", + "@types/react-dom": "^18.3.0", + "graphql": "^16.0.0", + "@tanstack/react-router": "^1.94.1", + "react": "^18.0.0", + "react-dom": "^18.0.0" + }, + "peerDependencies": { + "@tanstack/react-router": ">=1.94.1", + "react": ">=18.0.0", + "urql": "^4.0.0" + }, + "publishConfig": { + "access": "public", + "provenance": true + } +} diff --git a/packages/tanstack-react-router-urql/src/Provider.ts b/packages/tanstack-react-router-urql/src/Provider.ts new file mode 100644 index 0000000000..40b61d753c --- /dev/null +++ b/packages/tanstack-react-router-urql/src/Provider.ts @@ -0,0 +1,54 @@ +import * as React from 'react'; +import type { SSRExchange, Client } from 'urql'; +import { Provider } from 'urql'; + +export const SSRContext = React.createContext( + undefined +); + +/** Provider for `@urql/tanstack-react-router`. + * + * @remarks + * `Provider` accepts a {@link Client} and provides it to all GraphQL hooks, it + * also accepts an {@link SSRExchange} to distribute data when re-hydrating + * on the client. + * + * @example + * ```tsx + * import { + * UrqlProvider, + * ssrExchange, + * cacheExchange, + * fetchExchange, + * createClient, + * } from '@urql/tanstack-react-router'; + * + * const ssr = ssrExchange(); + * const client = createClient({ + * url: 'https://trygql.formidable.dev/graphql/basic-pokedex', + * exchanges: [cacheExchange, ssr, fetchExchange], + * suspense: true, + * }); + * + * const router = createRouter ({ + * routeTree, + * Wrap: ({ children }) => {children}, + * }); + * } + * + * ``` + */ +export function UrqlProvider({ + children, + ssr, + client, +}: React.PropsWithChildren<{ + ssr: SSRExchange; + client: Client; +}>) { + return React.createElement( + Provider, + { value: client }, + React.createElement(SSRContext.Provider, { value: ssr }, children) + ); +} diff --git a/packages/tanstack-react-router-urql/src/index.ts b/packages/tanstack-react-router-urql/src/index.ts new file mode 100644 index 0000000000..81c025c4ca --- /dev/null +++ b/packages/tanstack-react-router-urql/src/index.ts @@ -0,0 +1,3 @@ +export * from 'urql'; +export { useQuery } from './useQuery'; +export { UrqlProvider, SSRContext } from './Provider'; diff --git a/packages/tanstack-react-router-urql/src/useQuery.ts b/packages/tanstack-react-router-urql/src/useQuery.ts new file mode 100644 index 0000000000..bd72a52ecd --- /dev/null +++ b/packages/tanstack-react-router-urql/src/useQuery.ts @@ -0,0 +1,216 @@ +import type { + AnyVariables, + CombinedError, + GraphQLRequestParams, + Operation, + OperationContext, + RequestPolicy, +} from 'urql'; +import { createRequest, useQuery as orig_useQuery } from 'urql'; +import { useGetStreamedUrqlValue, useStreamUrqlValue } from './useUrqlValue'; + +/** Input arguments for the {@link useQuery} hook. + * + * @param query - The GraphQL query that `useQuery` executes. + * @param variables - The variables for the GraphQL query that `useQuery` executes. + */ +export type UseQueryArgs< + Variables extends AnyVariables = AnyVariables, + Data = any, +> = { + /** Updates the {@link RequestPolicy} for the executed GraphQL query operation. + * + * @remarks + * `requestPolicy` modifies the {@link RequestPolicy} of the GraphQL query operation + * that `useQuery` executes, and indicates a caching strategy for cache exchanges. + * + * For example, when set to `'cache-and-network'`, {@link useQuery} will + * receive a cached result with `stale: true` and an API request will be + * sent in the background. + * + * @see {@link OperationContext.requestPolicy} for where this value is set. + */ + requestPolicy?: RequestPolicy; + /** Updates the {@link OperationContext} for the executed GraphQL query operation. + * + * @remarks + * `context` may be passed to {@link useQuery}, to update the {@link OperationContext} + * of a query operation. This may be used to update the `context` that exchanges + * will receive for a single hook. + * + * Hint: This should be wrapped in a `useMemo` hook, to make sure that your + * component doesn’t infinitely update. + * + * @example + * ```ts + * const [result, reexecute] = useQuery({ + * query, + * context: useMemo(() => ({ + * additionalTypenames: ['Item'], + * }), []) + * }); + * ``` + */ + context?: Partial; + /** Prevents {@link useQuery} from automatically executing GraphQL query operations. + * + * @remarks + * `pause` may be set to `true` to stop {@link useQuery} from executing + * automatically. The hook will stop receiving updates from the {@link Client} + * and won’t execute the query operation, until either it’s set to `false` + * or the {@link UseQueryExecute} function is called. + * + * @see {@link https://urql.dev/goto/docs/basics/react-preact/#pausing-usequery} for + * documentation on the `pause` option. + */ + pause?: boolean; +} & GraphQLRequestParams; + +/** State of the current query, your {@link useQuery} hook is executing. + * + * @remarks + * `UseQueryState` is returned (in a tuple) by {@link useQuery} and + * gives you the updating {@link OperationResult} of GraphQL queries. + * + * Even when the query and variables passed to {@link useQuery} change, + * this state preserves the prior state and sets the `fetching` flag to + * `true`. + * This allows you to display the previous state, while implementing + * a separate loading indicator separately. + */ +export interface UseQueryState< + Data = any, + Variables extends AnyVariables = AnyVariables, +> { + /** Indicates whether `useQuery` is waiting for a new result. + * + * @remarks + * When `useQuery` is passed a new query and/or variables, it will + * start executing the new query operation and `fetching` is set to + * `true` until a result arrives. + * + * Hint: This is subtly different than whether the query is actually + * fetching, and doesn’t indicate whether a query is being re-executed + * in the background. For this, see {@link UseQueryState.stale}. + */ + fetching: boolean; + /** Indicates that the state is not fresh and a new result will follow. + * + * @remarks + * The `stale` flag is set to `true` when a new result for the query + * is expected and `useQuery` is waiting for it. This may indicate that + * a new request is being requested in the background. + * + * @see {@link OperationResult.stale} for the source of this value. + */ + stale: boolean; + /** The {@link OperationResult.data} for the executed query. */ + data?: Data; + /** The {@link OperationResult.error} for the executed query. */ + error?: CombinedError; + /** The {@link OperationResult.hasNext} for the executed query. */ + hasNext: boolean; + /** The {@link OperationResult.extensions} for the executed query. */ + extensions?: Record; + /** The {@link Operation} that the current state is for. + * + * @remarks + * This is the {@link Operation} that is currently being executed. + * When {@link UseQueryState.fetching} is `true`, this is the + * last `Operation` that the current state was for. + */ + operation?: Operation; +} + +/** Triggers {@link useQuery} to execute a new GraphQL query operation. + * + * @param opts - optionally, context options that will be merged with the hook's + * {@link UseQueryArgs.context} options and the `Client`’s options. + * + * @remarks + * When called, {@link useQuery} will re-execute the GraphQL query operation + * it currently holds, even if {@link UseQueryArgs.pause} is set to `true`. + * + * This is useful for executing a paused query or re-executing a query + * and get a new network result, by passing a new request policy. + * + * ```ts + * const [result, reexecuteQuery] = useQuery({ query }); + * + * const refresh = () => { + * // Re-execute the query with a network-only policy, skipping the cache + * reexecuteQuery({ requestPolicy: 'network-only' }); + * }; + * ``` + */ +export type UseQueryExecute = (opts?: Partial) => void; + +/** Result tuple returned by the {@link useQuery} hook. + * + * @remarks + * Similarly to a `useState` hook’s return value, + * the first element is the {@link useQuery}’s result and state, + * a {@link UseQueryState} object, + * and the second is used to imperatively re-execute the query + * via a {@link UseQueryExecute} function. + */ +export type UseQueryResponse< + Data = any, + Variables extends AnyVariables = AnyVariables, +> = [UseQueryState, UseQueryExecute]; + +/** Hook to run a GraphQL query and get updated GraphQL results. + * + * @param args - a {@link UseQueryArgs} object, to pass a `query`, `variables`, and options. + * @returns a {@link UseQueryResponse} tuple of a {@link UseQueryState} result, and re-execute function. + * + * @remarks + * `useQuery` allows GraphQL queries to be defined and executed. + * Given {@link UseQueryArgs.query}, it executes the GraphQL query with the + * context’s {@link Client}. + * + * The returned result updates when the `Client` has new results + * for the query, and changes when your input `args` change. + * + * Additionally, if the `suspense` option is enabled on the `Client`, + * the `useQuery` hook will suspend instead of indicating that it’s + * waiting for a result via {@link UseQueryState.fetching}. + * + * @see {@link https://urql.dev/goto/urql/docs/basics/react-preact/#queries} for `useQuery` docs. + * + * @example + * ```ts + * import { gql } from 'urql'; + * import { useQuery } from '@urql/tanstack-react-router'; + * + * const TodosQuery = gql` + * query { todos { id, title } } + * `; + * + * const Todos = () => { + * const [result, reexecuteQuery] = useQuery({ + * query: TodosQuery, + * variables: {}, + * }); + * // ... + * }; + * ``` + */ +export function useQuery< + Data = any, + Variables extends AnyVariables = AnyVariables, +>( + args: UseQueryArgs +): UseQueryResponse { + const request = createRequest( + args.query, + (args.variables || {}) as AnyVariables + ); + useGetStreamedUrqlValue(request.key); + + const [result, execute] = orig_useQuery(args); + + useStreamUrqlValue(request.key); + + return [result, execute]; +} diff --git a/packages/tanstack-react-router-urql/src/useUrqlValue.ts b/packages/tanstack-react-router-urql/src/useUrqlValue.ts new file mode 100644 index 0000000000..241799b2d0 --- /dev/null +++ b/packages/tanstack-react-router-urql/src/useUrqlValue.ts @@ -0,0 +1,46 @@ +import * as React from 'react'; +import { SSRContext } from './Provider'; +import { useRouter } from '@tanstack/react-router'; +import type { SerializedResult } from 'urql'; + +function getStreamKey(operationKey: number) { + return `__URQL__${operationKey}`; +} + +function useSsrExchange() { + const ssrExchange = React.useContext(SSRContext); + + if (!ssrExchange) { + throw new Error( + 'Missing "UrqlProvider" component as a parent or did not pass in an "ssrExchange" to the Provider.' + ); + } + return ssrExchange; +} + +export function useStreamUrqlValue(operationKey: number): void { + const ssrExchange = useSsrExchange(); + const router = useRouter(); + if (typeof window === 'undefined') { + const data = ssrExchange.extractData(); + if (data[operationKey]) { + router.streamValue(getStreamKey(operationKey), data[operationKey]); + } + } +} + +export function useGetStreamedUrqlValue(operationKey: number): void { + const ssrExchange = useSsrExchange(); + const router = useRouter(); + + if (typeof window !== 'undefined') { + const result = router.getStreamedValue( + getStreamKey(operationKey) + ) as SerializedResult; + if (result) { + ssrExchange.restoreData({ + [operationKey]: result, + }); + } + } +} diff --git a/packages/tanstack-react-router-urql/tsconfig.json b/packages/tanstack-react-router-urql/tsconfig.json new file mode 100644 index 0000000000..596e2cf729 --- /dev/null +++ b/packages/tanstack-react-router-urql/tsconfig.json @@ -0,0 +1,4 @@ +{ + "extends": "../../tsconfig.json", + "include": ["src"] +} diff --git a/packages/tanstack-react-router-urql/vitest.config.ts b/packages/tanstack-react-router-urql/vitest.config.ts new file mode 100644 index 0000000000..6561524839 --- /dev/null +++ b/packages/tanstack-react-router-urql/vitest.config.ts @@ -0,0 +1,4 @@ +import { mergeConfig } from 'vitest/config'; +import baseConfig from '../../vitest.config'; + +export default mergeConfig(baseConfig, {}); diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index c2d93c6129..9f0203ab69 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -603,6 +603,33 @@ importers: specifier: ^3.20.0 version: 3.37.0 + packages/tanstack-react-router-urql: + devDependencies: + '@tanstack/react-router': + specifier: ^1.94.1 + version: 1.94.1(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + '@types/react': + specifier: ^18.3.8 + version: 18.3.8 + '@types/react-dom': + specifier: ^18.3.0 + version: 18.3.0 + '@urql/core': + specifier: workspace:* + version: link:../core + graphql: + specifier: ^16.6.0 + version: 16.9.0 + react: + specifier: ^18.0.0 + version: 18.3.1 + react-dom: + specifier: ^18.0.0 + version: 18.3.1(react@18.3.1) + urql: + specifier: workspace:* + version: link:../react-urql + packages/vue-urql: dependencies: '@urql/core': @@ -1730,12 +1757,6 @@ packages: cpu: [arm64] os: [android] - '@esbuild/android-arm@0.15.18': - resolution: {integrity: sha512-5GT+kcs2WVGjVs7+boataCkO5Fg0y4kCjzkB5bAip7H4jfnOS3dA6KPiww9W1OEKTKeAcUVhdZGvgI65OXmUnw==} - engines: {node: '>=12'} - cpu: [arm] - os: [android] - '@esbuild/android-arm@0.21.5': resolution: {integrity: sha512-vCPvzSjpPHEi1siZdlvAlsPxXl7WbOVUBBAowWug4rJHb68Ox8KualB+1ocNvT5fjv6wpkX6o/iEpbDrf68zcg==} engines: {node: '>=12'} @@ -1790,12 +1811,6 @@ packages: cpu: [ia32] os: [linux] - '@esbuild/linux-loong64@0.15.18': - resolution: {integrity: sha512-L4jVKS82XVhw2nvzLg/19ClLWg0y27ulRwuP7lcyL6AbUWB5aPglXY3M21mauDQMDfRLs8cQmeT03r/+X3cZYQ==} - engines: {node: '>=12'} - cpu: [loong64] - os: [linux] - '@esbuild/linux-loong64@0.21.5': resolution: {integrity: sha512-uHf1BmMG8qEvzdrzAqg2SIG/02+4/DHB6a9Kbya0XDvwDEKCoC8ZRWI5JJvNdUjtciBGFQ5PuBlpEOXQj+JQSg==} engines: {node: '>=12'} @@ -2259,8 +2274,8 @@ packages: '@reach/router@1.3.4': resolution: {integrity: sha512-+mtn9wjlB9NN2CNnnC/BRYtwdKBfSyyasPYraNAyvaV1occr/5NnB4CVzjEZipNHwYebQwcndGUmpFzxAUoqSA==} peerDependencies: - react: ^17.0.2 - react-dom: ^17.0.2 + react: 15.x || 16.x || 16.4.0-alpha.0911da3 + react-dom: 15.x || 16.x || 16.4.0-alpha.0911da3 '@react-native-async-storage/async-storage@1.21.0': resolution: {integrity: sha512-JL0w36KuFHFCvnbOXRekqVAUplmOyT/OuCQkogo6X98MtpSaJOKEAeZnYO8JB0U/RIEixZaGI5px73YbRm/oag==} @@ -2564,6 +2579,26 @@ packages: '@swc/helpers@0.5.2': resolution: {integrity: sha512-E4KcWTpoLHqwPHLxidpOqQbcrZVgi0rsmmZXUle1jXmJfuIf/UWpczUJ7MZZ5tlxytgJXyp0w4PGkkeLiuIdZw==} + '@tanstack/history@1.90.0': + resolution: {integrity: sha512-riNhDGm+fAwxgZRJ0J/36IZis1UDHsDCNIxfEodbw6BgTWJr0ah+G20V4HT91uBXiCqYFvX3somlfTLhS5yHDA==} + engines: {node: '>=12'} + + '@tanstack/react-router@1.94.1': + resolution: {integrity: sha512-48dGuj9wEz/CHYPDd4WSfhYrGDFs/5vWTFkGBeO3z7AnmhgAdOR7N4GDbebo0fNNS4fNOWrbg7u09uknINEN6Q==} + engines: {node: '>=12'} + peerDependencies: + react: '>=18' + react-dom: '>=18' + + '@tanstack/react-store@0.7.0': + resolution: {integrity: sha512-S/Rq17HaGOk+tQHV/yrePMnG1xbsKZIl/VsNWnNXt4XW+tTY8dTlvpJH2ZQ3GRALsusG5K6Q3unAGJ2pd9W/Ng==} + peerDependencies: + react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0 + react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0 + + '@tanstack/store@0.7.0': + resolution: {integrity: sha512-CNIhdoUsmD2NolYuaIs8VfWM467RK6oIBAW4nPEKZhg1smZ+/CwtCdpURgp7nxSqOaV9oKkzdWD80+bC66F/Jg==} + '@testing-library/dom@10.1.0': resolution: {integrity: sha512-wdsYKy5zupPyLCW2Je5DLHSxSfbIp6h80WoHOQc+RPtmPGA52O9x5MJEkv92Sjonpq+poOAtUKhh1kBGAXBrNA==} engines: {node: '>=18'} @@ -4717,131 +4752,6 @@ packages: resolution: {integrity: sha512-QCOllgZJtaUo9miYBcLChTUaHNjJF3PYs1VidD7AwiEj1kYxKeQTctLAezAOH5ZKRH0g2IgPn6KwB4IT8iRpvA==} engines: {node: '>= 0.4'} - esbuild-android-64@0.15.18: - resolution: {integrity: sha512-wnpt3OXRhcjfIDSZu9bnzT4/TNTDsOUvip0foZOUBG7QbSt//w3QV4FInVJxNhKc/ErhUxc5z4QjHtMi7/TbgA==} - engines: {node: '>=12'} - cpu: [x64] - os: [android] - - esbuild-android-arm64@0.15.18: - resolution: {integrity: sha512-G4xu89B8FCzav9XU8EjsXacCKSG2FT7wW9J6hOc18soEHJdtWu03L3TQDGf0geNxfLTtxENKBzMSq9LlbjS8OQ==} - engines: {node: '>=12'} - cpu: [arm64] - os: [android] - - esbuild-darwin-64@0.15.18: - resolution: {integrity: sha512-2WAvs95uPnVJPuYKP0Eqx+Dl/jaYseZEUUT1sjg97TJa4oBtbAKnPnl3b5M9l51/nbx7+QAEtuummJZW0sBEmg==} - engines: {node: '>=12'} - cpu: [x64] - os: [darwin] - - esbuild-darwin-arm64@0.15.18: - resolution: {integrity: sha512-tKPSxcTJ5OmNb1btVikATJ8NftlyNlc8BVNtyT/UAr62JFOhwHlnoPrhYWz09akBLHI9nElFVfWSTSRsrZiDUA==} - engines: {node: '>=12'} - cpu: [arm64] - os: [darwin] - - esbuild-freebsd-64@0.15.18: - resolution: {integrity: sha512-TT3uBUxkteAjR1QbsmvSsjpKjOX6UkCstr8nMr+q7zi3NuZ1oIpa8U41Y8I8dJH2fJgdC3Dj3CXO5biLQpfdZA==} - engines: {node: '>=12'} - cpu: [x64] - os: [freebsd] - - esbuild-freebsd-arm64@0.15.18: - resolution: {integrity: sha512-R/oVr+X3Tkh+S0+tL41wRMbdWtpWB8hEAMsOXDumSSa6qJR89U0S/PpLXrGF7Wk/JykfpWNokERUpCeHDl47wA==} - engines: {node: '>=12'} - cpu: [arm64] - os: [freebsd] - - esbuild-linux-32@0.15.18: - resolution: {integrity: sha512-lphF3HiCSYtaa9p1DtXndiQEeQDKPl9eN/XNoBf2amEghugNuqXNZA/ZovthNE2aa4EN43WroO0B85xVSjYkbg==} - engines: {node: '>=12'} - cpu: [ia32] - os: [linux] - - esbuild-linux-64@0.15.18: - resolution: {integrity: sha512-hNSeP97IviD7oxLKFuii5sDPJ+QHeiFTFLoLm7NZQligur8poNOWGIgpQ7Qf8Balb69hptMZzyOBIPtY09GZYw==} - engines: {node: '>=12'} - cpu: [x64] - os: [linux] - - esbuild-linux-arm64@0.15.18: - resolution: {integrity: sha512-54qr8kg/6ilcxd+0V3h9rjT4qmjc0CccMVWrjOEM/pEcUzt8X62HfBSeZfT2ECpM7104mk4yfQXkosY8Quptug==} - engines: {node: '>=12'} - cpu: [arm64] - os: [linux] - - esbuild-linux-arm@0.15.18: - resolution: {integrity: sha512-UH779gstRblS4aoS2qpMl3wjg7U0j+ygu3GjIeTonCcN79ZvpPee12Qun3vcdxX+37O5LFxz39XeW2I9bybMVA==} - engines: {node: '>=12'} - cpu: [arm] - os: [linux] - - esbuild-linux-mips64le@0.15.18: - resolution: {integrity: sha512-Mk6Ppwzzz3YbMl/ZZL2P0q1tnYqh/trYZ1VfNP47C31yT0K8t9s7Z077QrDA/guU60tGNp2GOwCQnp+DYv7bxQ==} - engines: {node: '>=12'} - cpu: [mips64el] - os: [linux] - - esbuild-linux-ppc64le@0.15.18: - resolution: {integrity: sha512-b0XkN4pL9WUulPTa/VKHx2wLCgvIAbgwABGnKMY19WhKZPT+8BxhZdqz6EgkqCLld7X5qiCY2F/bfpUUlnFZ9w==} - engines: {node: '>=12'} - cpu: [ppc64] - os: [linux] - - esbuild-linux-riscv64@0.15.18: - resolution: {integrity: sha512-ba2COaoF5wL6VLZWn04k+ACZjZ6NYniMSQStodFKH/Pu6RxzQqzsmjR1t9QC89VYJxBeyVPTaHuBMCejl3O/xg==} - engines: {node: '>=12'} - cpu: [riscv64] - os: [linux] - - esbuild-linux-s390x@0.15.18: - resolution: {integrity: sha512-VbpGuXEl5FCs1wDVp93O8UIzl3ZrglgnSQ+Hu79g7hZu6te6/YHgVJxCM2SqfIila0J3k0csfnf8VD2W7u2kzQ==} - engines: {node: '>=12'} - cpu: [s390x] - os: [linux] - - esbuild-netbsd-64@0.15.18: - resolution: {integrity: sha512-98ukeCdvdX7wr1vUYQzKo4kQ0N2p27H7I11maINv73fVEXt2kyh4K4m9f35U1K43Xc2QGXlzAw0K9yoU7JUjOg==} - engines: {node: '>=12'} - cpu: [x64] - os: [netbsd] - - esbuild-openbsd-64@0.15.18: - resolution: {integrity: sha512-yK5NCcH31Uae076AyQAXeJzt/vxIo9+omZRKj1pauhk3ITuADzuOx5N2fdHrAKPxN+zH3w96uFKlY7yIn490xQ==} - engines: {node: '>=12'} - cpu: [x64] - os: [openbsd] - - esbuild-sunos-64@0.15.18: - resolution: {integrity: sha512-On22LLFlBeLNj/YF3FT+cXcyKPEI263nflYlAhz5crxtp3yRG1Ugfr7ITyxmCmjm4vbN/dGrb/B7w7U8yJR9yw==} - engines: {node: '>=12'} - cpu: [x64] - os: [sunos] - - esbuild-windows-32@0.15.18: - resolution: {integrity: sha512-o+eyLu2MjVny/nt+E0uPnBxYuJHBvho8vWsC2lV61A7wwTWC3jkN2w36jtA+yv1UgYkHRihPuQsL23hsCYGcOQ==} - engines: {node: '>=12'} - cpu: [ia32] - os: [win32] - - esbuild-windows-64@0.15.18: - resolution: {integrity: sha512-qinug1iTTaIIrCorAUjR0fcBk24fjzEedFYhhispP8Oc7SFvs+XeW3YpAKiKp8dRpizl4YYAhxMjlftAMJiaUw==} - engines: {node: '>=12'} - cpu: [x64] - os: [win32] - - esbuild-windows-arm64@0.15.18: - resolution: {integrity: sha512-q9bsYzegpZcLziq0zgUi5KqGVtfhjxGbnksaBFYmWLxeV/S1fK4OLdq2DFYnXcLMjlZw2L0jLsk1eGoB522WXQ==} - engines: {node: '>=12'} - cpu: [arm64] - os: [win32] - - esbuild@0.15.18: - resolution: {integrity: sha512-x/R72SmW3sSFRm5zrrIjAhCeQSAWoni3CmHEqfQrZIQTM3lVCdehdwuIqaOtfC2slvpdlLa62GYoN8SxT23m6Q==} - engines: {node: '>=12'} - hasBin: true - esbuild@0.21.5: resolution: {integrity: sha512-mg3OPMV4hXywwpoDxu3Qda5xCKQi+vCTZq8S9J/EpkhB2HzKXq4SNFZE3+NK93JYxc8VMSep+lOUSC/RVKaBqw==} engines: {node: '>=12'} @@ -6430,6 +6340,11 @@ packages: engines: {node: '>=4'} hasBin: true + jsesc@3.1.0: + resolution: {integrity: sha512-/sM3dO2FOzXjKQhJuo0Q173wf2KOo8t4I8vHy6lF9poUp7bKT0/NHE8fPX23PwfhnykfqnC2xRxOnVw5XuGIaA==} + engines: {node: '>=6'} + hasBin: true + json-buffer@3.0.0: resolution: {integrity: sha512-CuUqjv0FUZIdXkHPI8MezCnFCdaTAacej1TZYulLoAg1h/PhwkdXFN4V/gzY4g+fMBCOV2xF+rp7t2XD2ns/NQ==} @@ -8659,11 +8574,6 @@ packages: rollup: optional: true - rollup@2.79.2: - resolution: {integrity: sha512-fS6iqSPZDs3dr/y7Od6y5nha8dW1YnbgtsyotCVvoFGKbERG++CVRFv1meyGDE1SNItQA8BrnCw7ScdAhRJ3XQ==} - engines: {node: '>=10.0.0'} - hasBin: true - rollup@3.29.4: resolution: {integrity: sha512-oWzmBZwvYrU0iJHtDmhsm662rC15FRXmcjCk1xD771dFDx5jJ02ufAQQTn0etB2emNk4J9EZg/yWKpsn9BWGRw==} engines: {node: '>=14.18.0', npm: '>=8.0.0'} @@ -9299,6 +9209,7 @@ packages: sudo-prompt@9.2.1: resolution: {integrity: sha512-Mu7R0g4ig9TUuGSxJavny5Rv0egCEtpZRNMrZaYS1vxkiIxGiGUwoezU3LazIQ+KE04hTrTfNPgxU5gzi7F5Pw==} + deprecated: Package no longer supported. Contact Support at https://www.npmjs.com/support for more info. supports-color@5.5.0: resolution: {integrity: sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==} @@ -9442,6 +9353,9 @@ packages: tiny-invariant@1.1.0: resolution: {integrity: sha512-ytxQvrb1cPc9WBEI/HSeYYoGD0kWnGEOR8RY6KomWLBVhqz0RgTwVO9dLrGz7dC+nN9llyI7OKAgRq8Vq4ZBSw==} + tiny-invariant@1.3.3: + resolution: {integrity: sha512-+FbBPE1o9QAYvviau/qC5SE3caw21q3xkvWKBtja5vgqOWIHHJ3ioaq1VPfn/Szqctz2bU/oYeKd9/z5BL+PVg==} + tiny-warning@1.0.3: resolution: {integrity: sha512-lBN9zLN/oAf68o3zNXYrdCt1kP8WsiGW8Oo2ka41b2IM5JL/S1CTyX1rW0mb/zSuJun0ZUrDxx4sqvYS2FWzPA==} @@ -9895,6 +9809,11 @@ packages: url@0.11.0: resolution: {integrity: sha512-kbailJa29QrtXnxgq+DdCEGlbTeYM2eJUxsz6vjZavrCYPMIFHMKQmSKYAIuUK2i7hgPm28a8piX5NTUtM/LKQ==} + use-sync-external-store@1.4.0: + resolution: {integrity: sha512-9WXSPC5fMv61vaupRkCKCxsPxBocVnwakBEkMIHHpkTTg6icbJtg6jzgtLDm4bl3cSHAca52rYWih0k4K3PfHw==} + peerDependencies: + react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0 + use@3.1.1: resolution: {integrity: sha512-cwESVXlO3url9YWlFW/TA9cshCEhtu7IKJ/p5soJ/gGpj7vbvFrAY/eIioQ6Dw23KjZhYgiIo8HOs1nQ2vr/oQ==} engines: {node: '>=0.10.0'} @@ -9992,31 +9911,6 @@ packages: vite: optional: true - vite@3.2.11: - resolution: {integrity: sha512-K/jGKL/PgbIgKCiJo5QbASQhFiV02X9Jh+Qq0AKCRCRKZtOTVi4t6wh75FDpGf2N9rYOnzH87OEFQNaFy6pdxQ==} - engines: {node: ^14.18.0 || >=16.0.0} - hasBin: true - peerDependencies: - '@types/node': '>= 14' - less: '*' - sass: '*' - stylus: '*' - sugarss: '*' - terser: ^5.4.0 - peerDependenciesMeta: - '@types/node': - optional: true - less: - optional: true - sass: - optional: true - stylus: - optional: true - sugarss: - optional: true - terser: - optional: true - vite@5.4.7: resolution: {integrity: sha512-5l2zxqMEPVENgvzTuBpHer2awaetimj2BGkhBPdnwKbPNOlHsODU+oiazEZzLK7KhAnOrO+XGYJYn4ZlUhDtDQ==} engines: {node: ^18.0.0 || >=20.0.0} @@ -12673,9 +12567,6 @@ snapshots: '@esbuild/android-arm64@0.21.5': optional: true - '@esbuild/android-arm@0.15.18': - optional: true - '@esbuild/android-arm@0.21.5': optional: true @@ -12703,9 +12594,6 @@ snapshots: '@esbuild/linux-ia32@0.21.5': optional: true - '@esbuild/linux-loong64@0.15.18': - optional: true - '@esbuild/linux-loong64@0.21.5': optional: true @@ -13729,6 +13617,27 @@ snapshots: dependencies: tslib: 2.7.0 + '@tanstack/history@1.90.0': {} + + '@tanstack/react-router@1.94.1(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': + dependencies: + '@tanstack/history': 1.90.0 + '@tanstack/react-store': 0.7.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + jsesc: 3.1.0 + react: 18.3.1 + react-dom: 18.3.1(react@18.3.1) + tiny-invariant: 1.3.3 + tiny-warning: 1.0.3 + + '@tanstack/react-store@0.7.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': + dependencies: + '@tanstack/store': 0.7.0 + react: 18.3.1 + react-dom: 18.3.1(react@18.3.1) + use-sync-external-store: 1.4.0(react@18.3.1) + + '@tanstack/store@0.7.0': {} + '@testing-library/dom@10.1.0': dependencies: '@babel/code-frame': 7.24.7 @@ -14018,13 +13927,13 @@ snapshots: chai: 5.1.1 tinyrainbow: 1.2.0 - '@vitest/mocker@2.1.1(@vitest/spy@2.1.1)(vite@3.2.11(@types/node@18.19.50)(terser@5.32.0))': + '@vitest/mocker@2.1.1(@vitest/spy@2.1.1)(vite@5.4.7(@types/node@18.19.50)(terser@5.32.0))': dependencies: '@vitest/spy': 2.1.1 estree-walker: 3.0.3 magic-string: 0.30.11 optionalDependencies: - vite: 3.2.11(@types/node@18.19.50)(terser@5.32.0) + vite: 5.4.7(@types/node@18.19.50)(terser@5.32.0) '@vitest/pretty-format@2.1.1': dependencies: @@ -16476,91 +16385,6 @@ snapshots: is-date-object: 1.0.5 is-symbol: 1.0.4 - esbuild-android-64@0.15.18: - optional: true - - esbuild-android-arm64@0.15.18: - optional: true - - esbuild-darwin-64@0.15.18: - optional: true - - esbuild-darwin-arm64@0.15.18: - optional: true - - esbuild-freebsd-64@0.15.18: - optional: true - - esbuild-freebsd-arm64@0.15.18: - optional: true - - esbuild-linux-32@0.15.18: - optional: true - - esbuild-linux-64@0.15.18: - optional: true - - esbuild-linux-arm64@0.15.18: - optional: true - - esbuild-linux-arm@0.15.18: - optional: true - - esbuild-linux-mips64le@0.15.18: - optional: true - - esbuild-linux-ppc64le@0.15.18: - optional: true - - esbuild-linux-riscv64@0.15.18: - optional: true - - esbuild-linux-s390x@0.15.18: - optional: true - - esbuild-netbsd-64@0.15.18: - optional: true - - esbuild-openbsd-64@0.15.18: - optional: true - - esbuild-sunos-64@0.15.18: - optional: true - - esbuild-windows-32@0.15.18: - optional: true - - esbuild-windows-64@0.15.18: - optional: true - - esbuild-windows-arm64@0.15.18: - optional: true - - esbuild@0.15.18: - optionalDependencies: - '@esbuild/android-arm': 0.15.18 - '@esbuild/linux-loong64': 0.15.18 - esbuild-android-64: 0.15.18 - esbuild-android-arm64: 0.15.18 - esbuild-darwin-64: 0.15.18 - esbuild-darwin-arm64: 0.15.18 - esbuild-freebsd-64: 0.15.18 - esbuild-freebsd-arm64: 0.15.18 - esbuild-linux-32: 0.15.18 - esbuild-linux-64: 0.15.18 - esbuild-linux-arm: 0.15.18 - esbuild-linux-arm64: 0.15.18 - esbuild-linux-mips64le: 0.15.18 - esbuild-linux-ppc64le: 0.15.18 - esbuild-linux-riscv64: 0.15.18 - esbuild-linux-s390x: 0.15.18 - esbuild-netbsd-64: 0.15.18 - esbuild-openbsd-64: 0.15.18 - esbuild-sunos-64: 0.15.18 - esbuild-windows-32: 0.15.18 - esbuild-windows-64: 0.15.18 - esbuild-windows-arm64: 0.15.18 - esbuild@0.21.5: optionalDependencies: '@esbuild/aix-ppc64': 0.21.5 @@ -18443,6 +18267,8 @@ snapshots: jsesc@2.5.2: {} + jsesc@3.1.0: {} + json-buffer@3.0.0: {} json-buffer@3.0.1: {} @@ -21181,10 +21007,6 @@ snapshots: optionalDependencies: rollup: 3.29.4 - rollup@2.79.2: - optionalDependencies: - fsevents: 2.3.3 - rollup@3.29.4: optionalDependencies: fsevents: 2.3.3 @@ -22207,6 +22029,8 @@ snapshots: tiny-invariant@1.1.0: {} + tiny-invariant@1.3.3: {} + tiny-warning@1.0.3: {} tinybench@2.9.0: {} @@ -22647,6 +22471,10 @@ snapshots: punycode: 1.3.2 querystring: 0.2.0 + use-sync-external-store@1.4.0(react@18.3.1): + dependencies: + react: 18.3.1 + use@3.1.1: {} util-deprecate@1.0.2: {} @@ -22761,17 +22589,6 @@ snapshots: - supports-color - typescript - vite@3.2.11(@types/node@18.19.50)(terser@5.32.0): - dependencies: - esbuild: 0.15.18 - postcss: 8.4.45 - resolve: 1.22.8 - rollup: 2.79.2 - optionalDependencies: - '@types/node': 18.19.50 - fsevents: 2.3.3 - terser: 5.32.0 - vite@5.4.7(@types/node@18.19.50)(terser@5.32.0): dependencies: esbuild: 0.21.5 @@ -22799,7 +22616,7 @@ snapshots: vitest@2.1.1(@types/node@18.19.50)(jsdom@25.0.0)(terser@5.32.0): dependencies: '@vitest/expect': 2.1.1 - '@vitest/mocker': 2.1.1(@vitest/spy@2.1.1)(vite@3.2.11(@types/node@18.19.50)(terser@5.32.0)) + '@vitest/mocker': 2.1.1(@vitest/spy@2.1.1)(vite@5.4.7(@types/node@18.19.50)(terser@5.32.0)) '@vitest/pretty-format': 2.1.1 '@vitest/runner': 2.1.1 '@vitest/snapshot': 2.1.1 @@ -22814,7 +22631,7 @@ snapshots: tinyexec: 0.3.0 tinypool: 1.0.1 tinyrainbow: 1.2.0 - vite: 3.2.11(@types/node@18.19.50)(terser@5.32.0) + vite: 5.4.7(@types/node@18.19.50)(terser@5.32.0) vite-node: 2.1.1(@types/node@18.19.50)(terser@5.32.0) why-is-node-running: 2.3.0 optionalDependencies: From 0ab9c3110637d8e43a8ef1951f28caedf1d462ab Mon Sep 17 00:00:00 2001 From: Manuel Schiller Date: Sun, 12 Jan 2025 21:56:50 +0100 Subject: [PATCH 2/2] fix review comments --- .changeset/afraid-colts-sort.md | 2 +- packages/tanstack-react-router-urql/CHANGELOG.md | 1 - packages/tanstack-react-router-urql/jsr.json | 11 ++--------- packages/tanstack-react-router-urql/package.json | 6 +++--- packages/tanstack-react-router-urql/src/useQuery.ts | 6 +++--- .../tanstack-react-router-urql/src/useUrqlValue.ts | 4 ++-- 6 files changed, 11 insertions(+), 19 deletions(-) delete mode 100644 packages/tanstack-react-router-urql/CHANGELOG.md diff --git a/.changeset/afraid-colts-sort.md b/.changeset/afraid-colts-sort.md index acfa2a6632..62f343060c 100644 --- a/.changeset/afraid-colts-sort.md +++ b/.changeset/afraid-colts-sort.md @@ -1,5 +1,5 @@ --- -'@urql/tanstack-react-router': major +'@urql/tanstack-react-router': minor --- initial implementation of TanStack Router / Start Integration diff --git a/packages/tanstack-react-router-urql/CHANGELOG.md b/packages/tanstack-react-router-urql/CHANGELOG.md deleted file mode 100644 index 825c32f0d0..0000000000 --- a/packages/tanstack-react-router-urql/CHANGELOG.md +++ /dev/null @@ -1 +0,0 @@ -# Changelog diff --git a/packages/tanstack-react-router-urql/jsr.json b/packages/tanstack-react-router-urql/jsr.json index 1b32e7c787..2474144e05 100644 --- a/packages/tanstack-react-router-urql/jsr.json +++ b/packages/tanstack-react-router-urql/jsr.json @@ -1,15 +1,8 @@ { "name": "@urql/tanstack-react-router", - "version": "1.0.0", + "version": "0.0.0", "exports": { ".": "./src/index.ts" }, - "exclude": [ - "node_modules", - "cypress", - "**/*.test.*", - "**/*.spec.*", - "**/*.test.*.snap", - "**/*.spec.*.snap" - ] + "exclude": ["node_modules"] } diff --git a/packages/tanstack-react-router-urql/package.json b/packages/tanstack-react-router-urql/package.json index a0e47818e0..9735189090 100644 --- a/packages/tanstack-react-router-urql/package.json +++ b/packages/tanstack-react-router-urql/package.json @@ -1,12 +1,12 @@ { "name": "@urql/tanstack-react-router", - "version": "1.0.0", + "version": "0.0.0", "description": "Convenience wrappers for using urql with SSR in @tanstack/react-router and @tanstack/start", "sideEffects": false, "homepage": "https://formidable.com/open-source/urql/docs/", "bugs": "https://github.com/urql-graphql/urql/issues", "license": "MIT", - "author": "Manuel Schiller", + "author": "urql GraphQL Contributors", "repository": { "type": "git", "url": "https://github.com/urql-graphql/urql.git", @@ -41,7 +41,7 @@ "react-dom": "^18.0.0" }, "peerDependencies": { - "@tanstack/react-router": ">=1.94.1", + "@tanstack/react-router": ">=1.43.2", "react": ">=18.0.0", "urql": "^4.0.0" }, diff --git a/packages/tanstack-react-router-urql/src/useQuery.ts b/packages/tanstack-react-router-urql/src/useQuery.ts index bd72a52ecd..edc4c6f96e 100644 --- a/packages/tanstack-react-router-urql/src/useQuery.ts +++ b/packages/tanstack-react-router-urql/src/useQuery.ts @@ -7,7 +7,7 @@ import type { RequestPolicy, } from 'urql'; import { createRequest, useQuery as orig_useQuery } from 'urql'; -import { useGetStreamedUrqlValue, useStreamUrqlValue } from './useUrqlValue'; +import { useStreamedValue, useStreamValue } from './useUrqlValue'; /** Input arguments for the {@link useQuery} hook. * @@ -206,11 +206,11 @@ export function useQuery< args.query, (args.variables || {}) as AnyVariables ); - useGetStreamedUrqlValue(request.key); + useStreamedValue(request.key); const [result, execute] = orig_useQuery(args); - useStreamUrqlValue(request.key); + useStreamValue(request.key); return [result, execute]; } diff --git a/packages/tanstack-react-router-urql/src/useUrqlValue.ts b/packages/tanstack-react-router-urql/src/useUrqlValue.ts index 241799b2d0..06e1abb59e 100644 --- a/packages/tanstack-react-router-urql/src/useUrqlValue.ts +++ b/packages/tanstack-react-router-urql/src/useUrqlValue.ts @@ -18,7 +18,7 @@ function useSsrExchange() { return ssrExchange; } -export function useStreamUrqlValue(operationKey: number): void { +export function useStreamValue(operationKey: number): void { const ssrExchange = useSsrExchange(); const router = useRouter(); if (typeof window === 'undefined') { @@ -29,7 +29,7 @@ export function useStreamUrqlValue(operationKey: number): void { } } -export function useGetStreamedUrqlValue(operationKey: number): void { +export function useStreamedValue(operationKey: number): void { const ssrExchange = useSsrExchange(); const router = useRouter();