Extract GraphiQL server to @shopify/cli-kit#7379
Draft
gonzaloriestra wants to merge 1 commit intomainfrom
Draft
Conversation
This was referenced Apr 23, 2026
Contributor
Author
This stack of pull requests is managed by Graphite. Learn more about stacking. |
4 tasks
Move the GraphiQL HTTP proxy and its templates/assets out of @shopify/app and into @shopify/cli-kit so other packages (notably @shopify/store) can reuse it. This commit is purely mechanical: - Files moved to packages/cli-kit/src/public/node/graphiql/ and packages/cli-kit/assets/graphiql/. - Imports inside the moved server now use relative paths to other cli-kit modules instead of cross-package @shopify/cli-kit/* imports. - Asset resolution switched to @shopify/cli-kit/assets/graphiql/*. - @shopify/app consumers updated to import from @shopify/cli-kit/node/graphiql/server. - cli-kit package.json gains h3, @shopify/polaris, @shopify/polaris-icons, and react-dom (with @types/react-dom in devDependencies). Behavior is unchanged. Existing graphiql server.test.ts and utilities.test.ts move alongside the source.
2cf7228 to
9fd0733
Compare
Contributor
Differences in type declarationsWe detected differences in the type declarations generated by Typescript for this branch compared to the baseline ('main' branch). Please, review them to ensure they are backward-compatible. Here are some important things to keep in mind:
New type declarationspackages/cli-kit/dist/public/node/graphiql/server.d.tsimport { Server } from 'http';
import { Writable } from 'stream';
/**
* Derives a deterministic GraphiQL authentication key from the app's API secret and store FQDN.
* The key is stable across dev server restarts (so browser tabs survive restarts)
* but is not guessable without the app secret.
*
* @param apiSecret - The Partners app's client secret used as the HMAC key.
* @param storeFqdn - The myshopify.com domain the GraphiQL session targets.
* @returns A 64-character hex string suitable for use as the `?key=` query param.
*/
export declare function deriveGraphiQLKey(apiSecret: string, storeFqdn: string): string;
/**
* Resolves the GraphiQL authentication key. Uses the explicitly provided key
* if non-empty, otherwise derives one deterministically from the app secret.
*
* @param providedKey - An explicit key supplied by the caller; takes precedence when non-empty.
* @param apiSecret - The Partners app's client secret, used to derive a stable key as a fallback.
* @param storeFqdn - The myshopify.com domain the GraphiQL session targets.
* @returns The resolved key.
*/
export declare function resolveGraphiQLKey(providedKey: string | undefined, apiSecret: string, storeFqdn: string): string;
interface SetupGraphiQLServerOptions {
stdout: Writable;
port: number;
appName: string;
appUrl: string;
apiKey: string;
apiSecret: string;
key?: string;
storeFqdn: string;
}
/**
* Starts a local HTTP server that hosts the GraphiQL UI and proxies requests to the
* Admin API for the configured store. The server uses the OAuth `client_credentials`
* grant with the supplied `apiKey` / `apiSecret` to mint and refresh access tokens
* on the fly.
*
* @param options - Configuration for the server, including the target store, the
* Partners app credentials, and the local port to bind to.
* @returns The underlying Node `http.Server` instance, already listening on `options.port`.
*/
export declare function setupGraphiQLServer(options: SetupGraphiQLServerOptions): Server;
export {};
packages/cli-kit/dist/public/node/graphiql/utilities.d.ts/**
* Filters request headers to extract only custom headers that are safe to forward.
* Blocked headers and non-string values are excluded.
*
* @param headers - The raw incoming request headers.
* @returns The subset of headers that are safe to forward to the Admin API.
*/
export declare function filterCustomHeaders(headers: {
[key: string]: string | string[] | undefined;
}): {
[key: string]: string;
};
packages/cli-kit/dist/public/node/graphiql/templates/graphiql.d.tsexport declare const defaultQuery: string;
interface GraphiQLTemplateOptions {
apiVersion: string;
apiVersions: string[];
appName: string;
appUrl: string;
key: string;
storeFqdn: string;
}
export declare function graphiqlTemplate({ apiVersion, apiVersions, appName, appUrl, key, storeFqdn, }: GraphiQLTemplateOptions): string;
export {};
packages/cli-kit/dist/public/node/graphiql/templates/unauthorized.d.tsexport declare const unauthorizedTemplate: string;
Existing type declarationsWe found no diffs with existing type declarations |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.

WHY are these changes introduced?
Fixes #0000
WHAT is this pull request doing?
How to test your changes?
Post-release steps
Checklist
patchfor bug fixes ·minorfor new features ·majorfor breaking changes) and added a changeset withpnpm changeset add