Skip to content
This repository has been archived by the owner on Apr 11, 2024. It is now read-only.

Commit

Permalink
Merge pull request #1049 from Shopify/ml-graphql-client-rename-custom…
Browse files Browse the repository at this point in the history 
…Header

[GraphQL Client] Rename customHeaders to headers
  • Loading branch information
@melissaluu
melissaluu authored Nov 9, 2023
2 parents ba1e0bc + 18e471b commit 28f7107
Show file tree
Hide file tree
Showing 6 changed files with 27 additions and 19 deletions.
5 changes: 5 additions & 0 deletions .changeset/quick-shirts-remain.md
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
"@shopify/graphql-client": minor
---

Rename `customHeaders` to `headers` in Api Client utils and types for readibility
6 changes: 3 additions & 3 deletions packages/graphql-client/src/api-client-utilities/tests/utilities.test.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -113,13 +113,13 @@ describe("generateGetGQLClientParams()", () => {
});

it("returns an array with the operation string and an option with headers when custom headers were provided", () => {
const customHeaders = { "Shopify-Storefront-Id": "shop-id" };
const params = getGQLClientParams(operation, { customHeaders });
const headers = { "Shopify-Storefront-Id": "shop-id" };
const params = getGQLClientParams(operation, { headers });

expect(params).toHaveLength(2);

expect(params[0]).toBe(operation);
expect(getHeaderMock).toHaveBeenCalledWith(customHeaders);
expect(getHeaderMock).toHaveBeenCalledWith(headers);
expect(params[1]).toEqual({ headers: mockHeaders });
});

Expand Down
4 changes: 2 additions & 2 deletions packages/graphql-client/src/api-client-utilities/types.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -34,7 +34,7 @@ export interface ApiClientConfig {
export interface ApiClientRequestOptions {
variables?: OperationVariables;
apiVersion?: string;
customHeaders?: Headers;
headers?: Headers;
retries?: number;
}

Expand All @@ -47,7 +47,7 @@ export interface ApiClient<
TClientConfig extends ApiClientConfig = ApiClientConfig
> {
readonly config: Readonly<TClientConfig>;
getHeaders: (customHeaders?: Headers) => Headers;
getHeaders: (headers?: Headers) => Headers;
getApiUrl: (apiVersion?: string) => string;
fetch: (
...props: ApiClientRequestParams
Expand Down
4 changes: 2 additions & 2 deletions packages/graphql-client/src/api-client-utilities/utilities.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -27,13 +27,13 @@ export function generateGetGQLClientParams({
const {
variables,
apiVersion: propApiVersion,
customHeaders,
headers,
retries,
} = options;

props.push({
...(variables ? { variables } : {}),
...(customHeaders ? { headers: getHeaders(customHeaders) } : {}),
...(headers ? { headers: getHeaders(headers) } : {}),
...(propApiVersion ? { url: getApiUrl(propApiVersion) } : {}),
...(retries ? { retries } : {}),
});
Expand Down
6 changes: 3 additions & 3 deletions packages/storefront-api-client/README.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -54,7 +54,7 @@ const client = createStorefrontApiClient({
| Property | Type | Description |
| ------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| config | [StorefrontApiClientConfig](#storefrontapiclientconfig-properties) | Configuration for the client |
| getHeaders | `(customHeaders?: {[key: string]: string}) => {[key: string]: string}` | Returns Storefront API specific headers needed to interact with the API. If `customHeaders` is provided, the custom headers will be included in the returned headers object. |
| getHeaders | `(headers?: {[key: string]: string}) => {[key: string]: string}` | Returns Storefront API specific headers needed to interact with the API. If additional `headers` are provided, the custom headers will be included in the returned headers object. |
| getApiUrl | `(apiVersion?: string) => string` | Returns the shop specific API url. If an API version is provided, the returned URL will include the provided version, else the URL will include the API version set at client initialization. |
| fetch | `<TData>(operation: string, options?: `[ApiClientRequestOptions](#apiclientrequestoptions-properties)`) => Promise<Response>` | Fetches data from Storefront API using the provided GQL `operation` string and [ApiClientRequestOptions](#apiclientrequestoptions-properties) object and returns the network response. |
| request | `<TData>(operation: string, options?: `[ApiClientRequestOptions](#apiclientrequestoptions-properties)`) => Promise<`[ClientResponse\<TData\>](#ClientResponsetdata)`>` | Requests data from Storefront API using the provided GQL `operation` string and [ApiClientRequestOptions](#apiclientrequestoptions-properties) object and returns a normalized response object. |
Expand All @@ -80,7 +80,7 @@ const client = createStorefrontApiClient({
| -------------- | ------------------------ | ---------------------------------------------------- |
| variables? | `{[key: string]: string}` | Variable values needed in the graphQL operation |
| apiVersion? | `string` | The Storefront API version to use in the API request |
| customHeaders? | `{[key: string]: string}` | Customized headers to be included in the API request |
| headers? | `{[key: string]: string}` | Customized headers to be included in the API request |
| retries? | `number` | Alternative number of retries for the request. Retries only occur for requests that were abandoned or if the server responds with a `Too Many Request (429)` or `Service Unavailable (503)` response. Minimum value is `0` and maximum value is `3`.|

## `ClientResponse<TData>`
Expand Down Expand Up @@ -273,7 +273,7 @@ const {data, errors, extensions} = await client.request(productQuery, {
variables: {
handle: 'sample-product',
},
customHeaders: {
headers: {
'Shopify-Storefront-Id': 'shop-id',
},
});
Expand Down
21 changes: 12 additions & 9 deletions packages/storefront-api-client/src/tests/storefront-api-client/storefront-api-client.test.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -342,11 +342,14 @@ describe("Storefront API Client", () => {
});

it("returns a headers object that contains both the client default headers and the provided custom headers", () => {
const customHeaders = {
const headers = {
"Shopify-Storefront-Id": "test-id",
};
const headers = client.getHeaders(customHeaders);
expect(headers).toEqual({ ...customHeaders, ...client.config.headers });
const updatedHeaders = client.getHeaders(headers);
expect(updatedHeaders).toEqual({
...headers,
...client.config.headers,
});
});
});

Expand Down Expand Up @@ -442,13 +445,13 @@ describe("Storefront API Client", () => {
});

it("calls the graphql client fetch() with customized headers", async () => {
const customHeaders = { "custom-header": "custom" };
const headers = { "custom-header": "custom" };

await client.fetch(operation, { customHeaders });
await client.fetch(operation, { headers });
expect(
(graphqlClientMock.fetch as jest.Mock).mock.calls.pop()[1]
).toEqual({
headers: client.getHeaders(customHeaders),
headers: client.getHeaders(headers),
});
});

Expand Down Expand Up @@ -526,13 +529,13 @@ describe("Storefront API Client", () => {
});

it("calls the graphql client request() with customized headers", async () => {
const customHeaders = { "custom-header": "custom" };
const headers = { "custom-header": "custom" };

await client.request(operation, { customHeaders });
await client.request(operation, { headers });
expect(
(graphqlClientMock.request as jest.Mock).mock.calls.pop()[1]
).toEqual({
headers: client.getHeaders(customHeaders),
headers: client.getHeaders(headers),
});
});

Expand Down

0 comments on commit 28f7107

Please sign in to comment.