diff --git a/.api-reports/api-report-react.api.md b/.api-reports/api-report-react.api.md index 33cc0914821..dabdf2dbd1d 100644 --- a/.api-reports/api-report-react.api.md +++ b/.api-reports/api-report-react.api.md @@ -2228,7 +2228,7 @@ export interface UseReadQueryResult { // @public export function useSubscription(subscription: DocumentNode | TypedDocumentNode, options?: SubscriptionHookOptions, NoInfer_2>): { - restart(): void; + restart: () => void; loading: boolean; data?: TData | undefined; error?: ApolloError; diff --git a/.api-reports/api-report-react_hooks.api.md b/.api-reports/api-report-react_hooks.api.md index eb378482a4c..610a95212d8 100644 --- a/.api-reports/api-report-react_hooks.api.md +++ b/.api-reports/api-report-react_hooks.api.md @@ -2061,7 +2061,7 @@ export interface UseReadQueryResult { // // @public export function useSubscription(subscription: DocumentNode | TypedDocumentNode, options?: SubscriptionHookOptions, NoInfer_2>): { - restart(): void; + restart: () => void; loading: boolean; data?: TData | undefined; error?: ApolloError; diff --git a/.api-reports/api-report.api.md b/.api-reports/api-report.api.md index f995e1f4bdd..20848b2c922 100644 --- a/.api-reports/api-report.api.md +++ b/.api-reports/api-report.api.md @@ -2889,7 +2889,7 @@ export interface UseReadQueryResult { // @public export function useSubscription(subscription: DocumentNode | TypedDocumentNode, options?: SubscriptionHookOptions, NoInfer_2>): { - restart(): void; + restart: () => void; loading: boolean; data?: TData | undefined; error?: ApolloError; diff --git a/.changeset/old-ghosts-agree.md b/.changeset/old-ghosts-agree.md new file mode 100644 index 00000000000..b224b7afad8 --- /dev/null +++ b/.changeset/old-ghosts-agree.md @@ -0,0 +1,5 @@ +--- +"@apollo/client": patch +--- + +Cache the `useSubscription` hook's `restart` function definition between re-renders. diff --git a/.size-limits.json b/.size-limits.json index 7b0839e8f80..3cafe22147e 100644 --- a/.size-limits.json +++ b/.size-limits.json @@ -1,4 +1,4 @@ { - "dist/apollo-client.min.cjs": 40242, + "dist/apollo-client.min.cjs": 40249, "import { ApolloClient, InMemoryCache, HttpLink } from \"dist/index.js\" (production)": 33058 } diff --git a/src/react/hooks/useSubscription.ts b/src/react/hooks/useSubscription.ts index 94037c319bd..cf6c31ebabe 100644 --- a/src/react/hooks/useSubscription.ts +++ b/src/react/hooks/useSubscription.ts @@ -304,19 +304,16 @@ export function useSubscription< : fallbackResult, () => fallbackResult ); - return React.useMemo( - () => ({ - ...ret, - restart() { - invariant( - !optionsRef.current.skip, - "A subscription that is skipped cannot be restarted." - ); - setObservable(recreateRef.current()); - }, - }), - [ret] - ); + + const restart = React.useCallback(() => { + invariant( + !optionsRef.current.skip, + "A subscription that is skipped cannot be restarted." + ); + setObservable(recreateRef.current()); + }, [optionsRef, recreateRef]); + + return React.useMemo(() => ({ ...ret, restart }), [ret, restart]); } function createSubscription<