Mirror: The highly customizable and versatile GraphQL client with which you add on features like normalized caching as you grow.

fix(react-urql): Upgrade muted warning code for React 19 internals (#3769)

authored by kitten.sh and committed by

GitHub 0e20aad0 655502f9

+33 -17
+5
.changeset/rich-melons-play.md
··· 1 + --- 2 + 'urql': patch 3 + --- 4 + 5 + Upgrade false-positive circumvention for internal React warning to support React 19
+23 -15
packages/react-urql/src/hooks/state.ts
··· 1 - import * as React from 'react'; 1 + import type { Dispatch } from 'react'; 2 2 3 3 export const initialState = { 4 4 fetching: false, ··· 65 65 return false; 66 66 }; 67 67 68 - const reactSharedInternals = (React as any) 69 - .__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED; 68 + let isDispatching = false; 70 69 71 - export function deferDispatch<Dispatch extends React.Dispatch<any>>( 72 - setState: Dispatch, 73 - value: Dispatch extends React.Dispatch<infer State> ? State : void 74 - ) { 75 - if ( 76 - process.env.NODE_ENV !== 'production' && 77 - !!reactSharedInternals && 78 - !!reactSharedInternals.ReactCurrentOwner && 79 - !!reactSharedInternals.ReactCurrentOwner.current 80 - ) { 81 - Promise.resolve(value).then(setState); 70 + function deferDispatch<F extends Dispatch<any>>( 71 + setState: F, 72 + value: F extends Dispatch<infer State> ? State : void 73 + ): void; 74 + 75 + function deferDispatch<F extends Dispatch<any>>(setState: F): ReturnType<F>; 76 + 77 + function deferDispatch<F extends Dispatch<any>>( 78 + setState: F, 79 + value?: F extends Dispatch<infer State> ? State : void 80 + ): any { 81 + if (!isDispatching || value === undefined) { 82 + try { 83 + isDispatching = true; 84 + return setState(value); 85 + } finally { 86 + isDispatching = false; 87 + } 82 88 } else { 83 - setState(value); 89 + Promise.resolve(value).then(setState); 84 90 } 85 91 } 92 + 93 + export { deferDispatch };
+5 -2
packages/react-urql/src/hooks/useQuery.ts
··· 308 308 () => 309 309 [ 310 310 source, 311 - computeNextState(initialState, getSnapshot(source, suspense)), 311 + computeNextState( 312 + initialState, 313 + deferDispatch(() => getSnapshot(source, suspense)) 314 + ), 312 315 deps, 313 316 ] as const 314 317 ); ··· 319 322 source, 320 323 (currentResult = computeNextState( 321 324 state[1], 322 - getSnapshot(source, suspense) 325 + deferDispatch(() => getSnapshot(source, suspense)) 323 326 )), 324 327 deps, 325 328 ]);