@apollo/client-ai-apps 0.7.1 → 0.7.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (41) hide show
  1. package/.github/workflows/pr.yaml +35 -0
  2. package/.github/workflows/prep-release.yml +4 -3
  3. package/.github/workflows/release.yaml +8 -5
  4. package/.github/workflows/verify-changeset.yml +4 -4
  5. package/CHANGELOG.md +16 -0
  6. package/dist/utilities/getToolNamesFromDocument.d.ts +1 -1
  7. package/dist/utilities/getToolNamesFromDocument.d.ts.map +1 -1
  8. package/dist/utilities/getToolNamesFromDocument.js +14 -5
  9. package/dist/utilities/getToolNamesFromDocument.js.map +1 -1
  10. package/dist/vite/apolloClientAiApps.d.ts.map +1 -1
  11. package/dist/vite/apolloClientAiApps.js +8 -2
  12. package/dist/vite/apolloClientAiApps.js.map +1 -1
  13. package/integration-tests/docker-compose.yml +30 -0
  14. package/integration-tests/global-teardown.js +9 -0
  15. package/integration-tests/graphql-server/Dockerfile +12 -0
  16. package/integration-tests/graphql-server/package.json +10 -0
  17. package/integration-tests/graphql-server/server.ts +22 -0
  18. package/integration-tests/mcp-config.yaml +29 -0
  19. package/integration-tests/mock-app/index.html +12 -0
  20. package/integration-tests/mock-app/package.json +24 -0
  21. package/integration-tests/mock-app/src/App.tsx +23 -0
  22. package/integration-tests/mock-app/src/main.tsx +22 -0
  23. package/integration-tests/mock-app/src/tools/Echo.tsx +33 -0
  24. package/integration-tests/mock-app/src/tools/Hello.tsx +19 -0
  25. package/integration-tests/mock-app/src/tools/Private.tsx +34 -0
  26. package/integration-tests/mock-app/src/tools/SemiPrivate.tsx +34 -0
  27. package/integration-tests/mock-app/tsconfig.json +25 -0
  28. package/integration-tests/mock-app/vite.config.ts +22 -0
  29. package/integration-tests/package-lock.json +5749 -0
  30. package/integration-tests/package.json +20 -0
  31. package/integration-tests/playwright.config.ts +23 -0
  32. package/integration-tests/schema.graphql +10 -0
  33. package/integration-tests/tests/hello.spec.ts +11 -0
  34. package/integration-tests/tests/privateDirective.spec.ts +73 -0
  35. package/integration-tests/tests/variables.spec.ts +24 -0
  36. package/package.json +3 -2
  37. package/src/react/__tests__/createHydrationUtils.test.tsx +62 -0
  38. package/src/utilities/getToolNamesFromDocument.ts +19 -7
  39. package/src/vite/__tests__/apolloClientAiApps.test.ts +51 -2
  40. package/src/vite/apolloClientAiApps.ts +8 -2
  41. package/vitest.config.ts +2 -1
package/integration-tests/mcp-config.yaml ADDED
@@ -0,0 +1,29 @@
1
+ endpoint: http://graphql:4000/
2
+
3
+ schema:
4
+ source: local
5
+ path: /data/schema.graphql
6
+
7
+ introspection:
8
+ introspect:
9
+ enabled: true
10
+ execute:
11
+ enabled: true
12
+
13
+ transport:
14
+ type: streamable_http
15
+ port: 8000
16
+
17
+ health_check:
18
+ enabled: true
19
+ path: /health
20
+
21
+ cors:
22
+ enabled: true
23
+ allow_any_origin: true
24
+
25
+ logging:
26
+ level: info
27
+
28
+ overrides:
29
+ mutation_mode: all
package/integration-tests/mock-app/index.html ADDED
@@ -0,0 +1,12 @@
1
+ <!doctype html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8" />
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0" />
6
+ <title>Mock App</title>
7
+ </head>
8
+ <body>
9
+ <div id="root"></div>
10
+ <script type="module" src="/src/main.tsx"></script>
11
+ </body>
12
+ </html>
package/integration-tests/mock-app/package.json ADDED
@@ -0,0 +1,24 @@
1
+ {
2
+ "name": "mock-app",
3
+ "private": true,
4
+ "type": "module",
5
+ "version": "0.0.0",
6
+ "scripts": {
7
+ "build": "vite build"
8
+ },
9
+ "dependencies": {
10
+ "@apollo/client": "^4.1.7",
11
+ "@apollo/client-ai-apps": "file:../..",
12
+ "@modelcontextprotocol/ext-apps": "^1.1.0",
13
+ "react": "^19.1.1",
14
+ "react-dom": "^19.1.1"
15
+ },
16
+ "devDependencies": {
17
+ "@types/react": "^19.1.16",
18
+ "@types/react-dom": "^19.1.9",
19
+ "@vitejs/plugin-react": "^5.0.4",
20
+ "typescript": "~5.9.3",
21
+ "vite": "^7.3.2",
22
+ "vite-plugin-singlefile": "^2.3.0"
23
+ }
24
+ }
package/integration-tests/mock-app/src/App.tsx ADDED
@@ -0,0 +1,23 @@
1
+ import { useToolInfo } from "@apollo/client-ai-apps/react";
2
+ import { Hello } from "./tools/Hello";
3
+ import { Echo } from "./tools/Echo";
4
+ import { Private } from "./tools/Private";
5
+ import { SemiPrivate } from "./tools/SemiPrivate";
6
+
7
+ export function App() {
8
+ const toolInfo = useToolInfo();
9
+
10
+ switch (toolInfo?.toolName) {
11
+ case "Hello":
12
+ return <Hello />;
13
+ case "Echo":
14
+ return <Echo />;
15
+ case "Private":
16
+ return <Private />;
17
+ case "SemiPrivate":
18
+ return <SemiPrivate />;
19
+ default:
20
+ // @ts-expect-error type should be never
21
+ throw new Error(`Unknown tool: ${toolInfo?.toolName}`);
22
+ }
23
+ }
package/integration-tests/mock-app/src/main.tsx ADDED
@@ -0,0 +1,22 @@
1
+ import { StrictMode, Suspense } from "react";
2
+ import { createRoot } from "react-dom/client";
3
+ import { InMemoryCache } from "@apollo/client";
4
+ import { ApolloClient } from "@apollo/client-ai-apps";
5
+ import { ApolloProvider } from "@apollo/client-ai-apps/react";
6
+ import manifest from "../.application-manifest.json";
7
+ import { App } from "./App.tsx";
8
+
9
+ const client = new ApolloClient({
10
+ cache: new InMemoryCache(),
11
+ manifest,
12
+ });
13
+
14
+ createRoot(document.getElementById("root")!).render(
15
+ <StrictMode>
16
+ <Suspense fallback={<p>Loading…</p>}>
17
+ <ApolloProvider client={client}>
18
+ <App />
19
+ </ApolloProvider>
20
+ </Suspense>
21
+ </StrictMode>
22
+ );
package/integration-tests/mock-app/src/tools/Echo.tsx ADDED
@@ -0,0 +1,33 @@
1
+ import { gql, type TypedDocumentNode } from "@apollo/client";
2
+ import { useQuery } from "@apollo/client/react";
3
+ import { createHydrationUtils } from "@apollo/client-ai-apps/react";
4
+
5
+ interface Data {
6
+ echo: string;
7
+ }
8
+
9
+ interface Variables {
10
+ message: string;
11
+ }
12
+
13
+ const ECHO_QUERY: TypedDocumentNode<Data, Variables> = gql`
14
+ "Echos the message back to the user"
15
+ query Echo($message: String!) @tool(name: "Echo") {
16
+ echo(message: $message)
17
+ }
18
+ `;
19
+
20
+ const { useHydratedVariables } = createHydrationUtils(ECHO_QUERY);
21
+
22
+ export function Echo() {
23
+ const [variables] = useHydratedVariables({
24
+ message: "This should be unused",
25
+ });
26
+ const { data, dataState } = useQuery(ECHO_QUERY, { variables });
27
+
28
+ if (dataState !== "complete") {
29
+ return <div>Loading...</div>;
30
+ }
31
+
32
+ return <div data-testid="echo">{data.echo}</div>;
33
+ }
package/integration-tests/mock-app/src/tools/Hello.tsx ADDED
@@ -0,0 +1,19 @@
1
+ import { gql, type TypedDocumentNode } from "@apollo/client";
2
+ import { useQuery } from "@apollo/client/react";
3
+
4
+ interface HelloQueryData {
5
+ hello: string;
6
+ }
7
+
8
+ const HELLO_QUERY: TypedDocumentNode<HelloQueryData> = gql`
9
+ "Returns a greeting"
10
+ query Hello @tool {
11
+ hello
12
+ }
13
+ `;
14
+
15
+ export function Hello() {
16
+ const { data } = useQuery(HELLO_QUERY);
17
+
18
+ return <h1 data-testid="greeting">{data?.hello}</h1>;
19
+ }
package/integration-tests/mock-app/src/tools/Private.tsx ADDED
@@ -0,0 +1,34 @@
1
+ import { gql, type TypedDocumentNode } from "@apollo/client";
2
+ import { useQuery } from "@apollo/client/react";
3
+
4
+ interface Data {
5
+ user: {
6
+ address: string;
7
+ fullName: string;
8
+ };
9
+ }
10
+
11
+ const PRIVATE_QUERY: TypedDocumentNode<Data, Record<string, never>> = gql`
12
+ "Returns private user information"
13
+ query Private @tool {
14
+ user @private {
15
+ fullName
16
+ address
17
+ }
18
+ }
19
+ `;
20
+
21
+ export function Private() {
22
+ const { data, dataState } = useQuery(PRIVATE_QUERY);
23
+
24
+ if (dataState !== "complete") {
25
+ return <div>Loading...</div>;
26
+ }
27
+
28
+ return (
29
+ <div>
30
+ <div data-testid="fullName">{data.user.fullName}</div>
31
+ <div data-testid="address">{data.user.address}</div>
32
+ </div>
33
+ );
34
+ }
package/integration-tests/mock-app/src/tools/SemiPrivate.tsx ADDED
@@ -0,0 +1,34 @@
1
+ import { gql, type TypedDocumentNode } from "@apollo/client";
2
+ import { useQuery } from "@apollo/client/react";
3
+
4
+ interface Data {
5
+ user: {
6
+ address: string;
7
+ fullName: string;
8
+ };
9
+ }
10
+
11
+ const SEMI_PRIVATE_QUERY: TypedDocumentNode<Data, Record<string, never>> = gql`
12
+ "Returns user information with a private field"
13
+ query SemiPrivate @tool {
14
+ user {
15
+ fullName
16
+ address @private
17
+ }
18
+ }
19
+ `;
20
+
21
+ export function SemiPrivate() {
22
+ const { data, dataState } = useQuery(SEMI_PRIVATE_QUERY);
23
+
24
+ if (dataState !== "complete") {
25
+ return <div>Loading...</div>;
26
+ }
27
+
28
+ return (
29
+ <div>
30
+ <div data-testid="fullName">{data.user.fullName}</div>
31
+ <div data-testid="address">{data.user.address}</div>
32
+ </div>
33
+ );
34
+ }
package/integration-tests/mock-app/tsconfig.json ADDED
@@ -0,0 +1,25 @@
1
+ {
2
+ "extends": "@apollo/client-ai-apps/tsconfig/core",
3
+ "compilerOptions": {
4
+ "target": "ES2022",
5
+ "lib": ["ES2022", "DOM", "DOM.Iterable"],
6
+ "module": "ESNext",
7
+ "moduleResolution": "bundler",
8
+ "jsx": "react-jsx",
9
+ "strict": true,
10
+ "skipLibCheck": true,
11
+ "noEmit": true,
12
+ "allowImportingTsExtensions": true,
13
+ "verbatimModuleSyntax": true,
14
+ "types": ["vite/client"],
15
+ "baseUrl": ".",
16
+ "paths": {
17
+ /* Prevent in-editor TypeScript issues by using the types from the root installed version */
18
+ "@apollo/client": ["../node_modules/@apollo/client"],
19
+ "@apollo/client/*": ["../node_modules/@apollo/client/*"],
20
+ "vite": ["../node_modules/vite"],
21
+ "vite/*": ["../node_modules/vite/*"]
22
+ }
23
+ },
24
+ "include": ["src", "vite.config.ts", ".apollo-client-ai-apps/types"]
25
+ }
package/integration-tests/mock-app/vite.config.ts ADDED
@@ -0,0 +1,22 @@
1
+ import { defineConfig } from "vite";
2
+ import react from "@vitejs/plugin-react";
3
+ import { viteSingleFile } from "vite-plugin-singlefile";
4
+ import { apolloClientAiApps } from "@apollo/client-ai-apps/vite";
5
+
6
+ export default defineConfig({
7
+ build: {
8
+ emptyOutDir: true,
9
+ },
10
+ resolve: {
11
+ dedupe: ["react", "react-dom", "@apollo/client"],
12
+ },
13
+ plugins: [
14
+ apolloClientAiApps({
15
+ targets: ["mcp"],
16
+ appsOutDir: "../apps",
17
+ schema: "../schema.graphql",
18
+ }),
19
+ react(),
20
+ viteSingleFile(),
21
+ ],
22
+ });