Add TypeScript examples to all subscriptions page code blocks

jerelmiller commented 2 months ago

Closes https://github.com/apollographql/apollo-client/issues/10184

Adds TypeScript examples to all code blocks on the subscriptions page. You'll note that some <MultiCodeBlock /> components only specify TS and others specify both. The ones that only specify TS will compile and add a JS block as well, but I found some bugs in some places with formatting and spacing so some code blocks specify both TS and JS code blocks to avoid the auto-compilation.

This change assumes that we want TypedDocumentNode as the predominant pattern for declaring types on query documents. The original issue mentions using the generic argument syntax for subscribeToMore, but I left that out in favor of the typed document node instead.

changeset-bot[bot] commented 2 months ago

⚠️ No Changeset found

Latest commit: 2798024dc909e521e33a39f31b040047b23d8d97

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

github-actions[bot] commented 2 months ago

size-limit report 📦

Path	Size
dist/apollo-client.min.cjs	39.22 KB (0%)
import { ApolloClient, InMemoryCache, HttpLink } from "dist/main.cjs"	47.88 KB (0%)
import { ApolloClient, InMemoryCache, HttpLink } from "dist/main.cjs" (production)	45.45 KB (0%)
import { ApolloClient, InMemoryCache, HttpLink } from "dist/index.js"	34.31 KB (0%)
import { ApolloClient, InMemoryCache, HttpLink } from "dist/index.js" (production)	32.2 KB (0%)
import { ApolloProvider } from "dist/react/index.js"	1.26 KB (0%)
import { ApolloProvider } from "dist/react/index.js" (production)	1.24 KB (0%)
import { useQuery } from "dist/react/index.js"	5.21 KB (0%)
import { useQuery } from "dist/react/index.js" (production)	4.3 KB (0%)
import { useLazyQuery } from "dist/react/index.js"	5.69 KB (0%)
import { useLazyQuery } from "dist/react/index.js" (production)	4.77 KB (0%)
import { useMutation } from "dist/react/index.js"	3.62 KB (0%)
import { useMutation } from "dist/react/index.js" (production)	2.84 KB (0%)
import { useSubscription } from "dist/react/index.js"	4.41 KB (0%)
import { useSubscription } from "dist/react/index.js" (production)	3.46 KB (0%)
import { useSuspenseQuery } from "dist/react/index.js"	5.49 KB (0%)
import { useSuspenseQuery } from "dist/react/index.js" (production)	4.15 KB (0%)
import { useBackgroundQuery } from "dist/react/index.js"	4.99 KB (0%)
import { useBackgroundQuery } from "dist/react/index.js" (production)	3.64 KB (0%)
import { useLoadableQuery } from "dist/react/index.js"	5.07 KB (0%)
import { useLoadableQuery } from "dist/react/index.js" (production)	3.72 KB (0%)
import { useReadQuery } from "dist/react/index.js"	3.39 KB (0%)
import { useReadQuery } from "dist/react/index.js" (production)	3.33 KB (0%)
import { useFragment } from "dist/react/index.js"	2.32 KB (0%)
import { useFragment } from "dist/react/index.js" (production)	2.27 KB (0%)

netlify[bot] commented 2 months ago

Deploy Preview for apollo-client-docs ready!

Name	Link
Latest commit	e7418991e111e3784f1a027535303f554e737944
Latest deploy log	https://app.netlify.com/sites/apollo-client-docs/deploys/66a295971668a40008f4a5fb
Deploy Preview	https://deploy-preview-11977--apollo-client-docs.netlify.app
Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

netlify[bot] commented 2 months ago

Deploy Preview for apollo-client-docs ready!

Name	Link
Latest commit	e7418991e111e3784f1a027535303f554e737944
Latest deploy log	https://app.netlify.com/sites/apollo-client-docs/deploys/66a296d5d948750008d47060
Deploy Preview	https://deploy-preview-11977--apollo-client-docs.netlify.app
Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

apollographql / apollo-client