Skip to content

Add helper type QueryRef.ForQuery<TypedDocumentNode>#13012

Merged
phryneas merged 3 commits intorelease-4.1from
pr/queryref-forquery
Nov 14, 2025
Merged

Add helper type QueryRef.ForQuery<TypedDocumentNode>#13012
phryneas merged 3 commits intorelease-4.1from
pr/queryref-forquery

Conversation

@phryneas
Copy link
Copy Markdown
Member

@phryneas phryneas commented Nov 13, 2025

Another small one I came across writing a tutorial. In my demo codebase I find myself doing

import { gql } from "@apollo/client";
import { QueryRef } from "@apollo/client/react";
import { ScheduleScreenDocument } from "./ScheduleScreen.generated";
import { ScheduleList } from "./components/ScheduleList";
import { ResultOf, VariablesOf } from "@graphql-typed-document-node/core";

if (false) {
  // eslint-disable-next-line no-unused-expressions
  gql`
    query ScheduleScreen($eventId: String!) {
      ...ScheduleList_event
    }
  `;
}

ScheduleScreen.Query = ScheduleScreenDocument;

export function ScheduleScreen({
  queryRef,
  variables,
}: {
  queryRef: QueryRef<
    ResultOf<typeof ScheduleScreen.Query>,
    VariablesOf<typeof ScheduleScreen.Query>
  >;
  variables: VariablesOf<typeof ScheduleScreen.Query>;
}) {
  return (
    <ScheduleList
      event={"ROOT_QUERY" as any}
      queryRef={queryRef}
      variables={variables}
    />
  );
}

with this, it would change like:

import { gql } from "@apollo/client";
import { QueryRef } from "@apollo/client/react";
import { ScheduleScreenDocument } from "./ScheduleScreen.generated";
import { ScheduleList } from "./components/ScheduleList";
import { 
- ResultOf, 
  VariablesOf 
} from "@graphql-typed-document-node/core";

if (false) {
  // eslint-disable-next-line no-unused-expressions
  gql`
    query ScheduleScreen($eventId: String!) {
      ...ScheduleList_event
    }
  `;
}

ScheduleScreen.Query = ScheduleScreenDocument;

export function ScheduleScreen({
  queryRef,
  variables,
}: {
+ queryRef: QueryRef.ForQuery<typeof ScheduleScreen.Query>
-  queryRef: QueryRef<
-    ResultOf<typeof ScheduleScreen.Query>,
-    VariablesOf<typeof ScheduleScreen.Query>
-  >;
  variables: VariablesOf<typeof ScheduleScreen.Query>;
}) {
  return (
    <ScheduleList
      event={"ROOT_QUERY" as any}
      queryRef={queryRef}
      variables={variables}
    />
  );
}

It's not a world of difference, but a nice piece of DX and reduces mental overhead.

@changeset-bot
Copy link
Copy Markdown

changeset-bot bot commented Nov 13, 2025

🦋 Changeset detected

Latest commit: c51aae0

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

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

@phryneas phryneas requested a review from jerelmiller November 13, 2025 13:40
@pkg-pr-new
Copy link
Copy Markdown

pkg-pr-new bot commented Nov 13, 2025

npm i https://pkg.pr.new/apollographql/apollo-client/@apollo/client@13012

commit: c51aae0

Copy link
Copy Markdown
Member

@jerelmiller jerelmiller left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks great!

@github-actions github-actions bot added the auto-cleanup 🤖 label Nov 13, 2025
@phryneas
Copy link
Copy Markdown
Member Author

CI fails seem to be completely unrelated, merging.

@phryneas phryneas merged commit d85c9b9 into release-4.1 Nov 14, 2025
38 of 41 checks passed
jerelmiller pushed a commit that referenced this pull request Nov 17, 2025
* Add helper type `QueryRef.ForQuery<TypedDocumentNode>`

* chores
@jerelmiller jerelmiller deleted the pr/queryref-forquery branch November 17, 2025 18:16
@github-actions github-actions bot locked as resolved and limited conversation to collaborators Dec 18, 2025
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants