From dd81447ad85b1a2a48aacd22970ef6df78292b9f Mon Sep 17 00:00:00 2001 From: Daniel Rios Pavia Date: Mon, 6 Mar 2023 12:45:12 +0100 Subject: [PATCH 01/11] extract shopify default context --- packages/hydrogen-react/src/ShopifyProvider.tsx | 8 ++++++-- 1 file changed, 6 insertions(+), 2 deletions(-) diff --git a/packages/hydrogen-react/src/ShopifyProvider.tsx b/packages/hydrogen-react/src/ShopifyProvider.tsx index 9856e094b3..8a9b2f2f21 100644 --- a/packages/hydrogen-react/src/ShopifyProvider.tsx +++ b/packages/hydrogen-react/src/ShopifyProvider.tsx @@ -3,7 +3,7 @@ import type {LanguageCode, CountryCode} from './storefront-api-types.js'; import {SFAPI_VERSION} from './storefront-api-constants.js'; import {getPublicTokenHeadersRaw} from './storefront-client.js'; -const ShopifyContext = createContext({ +export const defaultShopifyContext: ShopifyContextValue = { storeDomain: 'test', storefrontToken: 'abc123', storefrontApiVersion: SFAPI_VERSION, @@ -18,7 +18,11 @@ const ShopifyContext = createContext({ getShopifyDomain() { return ''; }, -}); +}; + +const ShopifyContext = createContext( + defaultShopifyContext, +); /** * The `` component enables use of the `useShop()` hook. The component should wrap your app. From 6c20d48042b49b2dcd10bbc65c6d24c34e801fa5 Mon Sep 17 00:00:00 2001 From: Daniel Rios Pavia Date: Mon, 6 Mar 2023 12:45:30 +0100 Subject: [PATCH 02/11] update ShopPayButton to also accept a storeDomain prop Co-authored-by: Juan P. Prieto --- .../src/ShopPayButton.example.jsx | 11 ++-- .../src/ShopPayButton.example.tsx | 17 +++++-- .../src/ShopPayButton.stories.tsx | 11 +++- .../hydrogen-react/src/ShopPayButton.test.tsx | 50 +++++++++++++++++++ packages/hydrogen-react/src/ShopPayButton.tsx | 24 +++++++-- 5 files changed, 101 insertions(+), 12 deletions(-) diff --git a/packages/hydrogen-react/src/ShopPayButton.example.jsx b/packages/hydrogen-react/src/ShopPayButton.example.jsx index 35006f9439..732cd80106 100644 --- a/packages/hydrogen-react/src/ShopPayButton.example.jsx +++ b/packages/hydrogen-react/src/ShopPayButton.example.jsx @@ -1,11 +1,14 @@ import {ShopPayButton} from '@shopify/hydrogen-react'; -export function AddVariantQuantity1({variantId}) { - return ; +export function AddVariantQuantity1({variantId, storeDomain}) { + return ; } -export function AddVariantQuantityMultiple({variantId, quantity}) { +export function AddVariantQuantityMultiple({variantId, quantity, storeDomain}) { return ( - + ); } diff --git a/packages/hydrogen-react/src/ShopPayButton.example.tsx b/packages/hydrogen-react/src/ShopPayButton.example.tsx index c094b26d92..f99af6d714 100644 --- a/packages/hydrogen-react/src/ShopPayButton.example.tsx +++ b/packages/hydrogen-react/src/ShopPayButton.example.tsx @@ -1,17 +1,28 @@ import {ShopPayButton} from '@shopify/hydrogen-react'; -export function AddVariantQuantity1({variantId}: {variantId: string}) { - return ; +export function AddVariantQuantity1({ + variantId, + storeDomain, +}: { + variantId: string; + storeDomain: String; +}) { + return ; } export function AddVariantQuantityMultiple({ variantId, quantity, + storeDomain, }: { variantId: string; quantity: number; + storeDomain: string; }) { return ( - + ); } diff --git a/packages/hydrogen-react/src/ShopPayButton.stories.tsx b/packages/hydrogen-react/src/ShopPayButton.stories.tsx index c75eaa2ba9..672bea225d 100644 --- a/packages/hydrogen-react/src/ShopPayButton.stories.tsx +++ b/packages/hydrogen-react/src/ShopPayButton.stories.tsx @@ -8,14 +8,21 @@ const Template: Story = (props) => ; export const NoQuantity = Template.bind({}); NoQuantity.args = { - variantIds: ['123', '456'], + variantIds: [ + 'gid://shopify/ProductVariant/123', + 'gid://shopify/ProductVariant/456', + ], + storeDomain: 'https://notashop.myshopify.io', className: '', width: '', }; export const Quantities = Template.bind({}); Quantities.args = { - variantIdsAndQuantities: [{id: '123', quantity: 2}], + variantIdsAndQuantities: [ + {id: 'gid://shopify/ProductVariant/123', quantity: 2}, + ], + storeDomain: 'https://notashop.myshopify.io', className: '', width: '', }; diff --git a/packages/hydrogen-react/src/ShopPayButton.test.tsx b/packages/hydrogen-react/src/ShopPayButton.test.tsx index 85c348c86b..05df09be72 100644 --- a/packages/hydrogen-react/src/ShopPayButton.test.tsx +++ b/packages/hydrogen-react/src/ShopPayButton.test.tsx @@ -6,6 +6,7 @@ import { DoublePropsErrorMessage, MissingPropsErrorMessage, InvalidPropsErrorMessage, + MissingStoreDomainErrorMessage, } from './ShopPayButton.js'; import {getShopifyConfig} from './ShopifyProvider.test.js'; @@ -114,4 +115,53 @@ describe(``, () => { }), ).toThrow(InvalidPropsErrorMessage); }); + + it(`throws error if no 'storeDomain' is supplied`, () => { + const fakeId = 'gid://shopify/ProductVariant/123'; + expect(() => render()).toThrow( + MissingStoreDomainErrorMessage, + ); + }); + + it(`allows to use 'storeDomain' props without ShopifyProvider`, () => { + const fakeId = 'gid://shopify/ProductVariant/123'; + const {container} = render( + , + ); + const button = container.querySelector('shop-pay-button'); + + expect(button).toHaveAttribute( + 'store-url', + 'https://notashop.myshopify.com', + ); + }); + + it(`uses 'storeDomain' props over 'ShopifyProvider'`, () => { + const fakeId = 'gid://shopify/ProductVariant/123'; + const {container} = render( + , + { + wrapper: ({children}) => ( + + {children} + + ), + }, + ); + const button = container.querySelector('shop-pay-button'); + + expect(button).toHaveAttribute( + 'store-url', + 'https://notashop.myshopify.com', + ); + }); }); diff --git a/packages/hydrogen-react/src/ShopPayButton.tsx b/packages/hydrogen-react/src/ShopPayButton.tsx index 5ffa528056..6c6ed6dfbc 100644 --- a/packages/hydrogen-react/src/ShopPayButton.tsx +++ b/packages/hydrogen-react/src/ShopPayButton.tsx @@ -1,10 +1,11 @@ -import {useShop} from './ShopifyProvider.js'; +import {defaultShopifyContext, useShop} from './ShopifyProvider.js'; import {useLoadScript} from './load-script.js'; import {parseGid} from './analytics-utils.js'; // By using 'never' in the "or" cases below, it makes these props "exclusive" and means that you cannot pass both of them; you must pass either one OR the other. type ShopPayButtonProps = ShopPayButtonStyleProps & - (ShopPayVariantIds | ShopPayVariantAndQuantities); + (ShopPayVariantIds | ShopPayVariantAndQuantities) & + ShopPayDomainProps; type ShopPayButtonStyleProps = { /** A string of classes to apply to the `div` that wraps the Shop Pay button. */ @@ -13,6 +14,11 @@ type ShopPayButtonStyleProps = { width?: string; }; +type ShopPayDomainProps = { + /** The domain of your Shopify storefront URL (eg: `your-store.myshopify.com`). */ + storeDomain?: string; +}; + type ShopPayVariantIds = { /** An array of IDs of the variants to purchase with Shop Pay. This will only ever have a quantity of 1 for each variant. If you want to use other quantities, then use `variantIdsAndQuantities`. */ variantIds: string[]; @@ -55,16 +61,26 @@ export function ShopPayButton({ className, variantIdsAndQuantities, width, + storeDomain: _storeDomain, }: ShopPayButtonProps): JSX.Element { - const {storeDomain} = useShop(); + const shop = useShop(); + const storeDomain = _storeDomain || shop?.storeDomain; const shopPayLoadedStatus = useLoadScript(SHOPJS_URL); let ids: string[] = []; + if (!storeDomain || storeDomain === defaultShopifyContext.storeDomain) { + throw new Error(MissingStoreDomainErrorMessage); + } + if (variantIds && variantIdsAndQuantities) { throw new Error(DoublePropsErrorMessage); } + if (!variantIds && !variantIdsAndQuantities) { + throw new Error(MissingPropsErrorMessage); + } + if (variantIds) { ids = variantIds.reduce((prev, curr) => { const bareId = parseGid(curr).id; @@ -104,6 +120,8 @@ export function ShopPayButton({ ); } +export const MissingStoreDomainErrorMessage = + 'You must pass a "storeDomain" prop to the "ShopPayButton" component, or wrap it in a "ShopifyProvider" component.'; export const InvalidPropsErrorMessage = `You must pass in "variantIds" in the form of ["gid://shopify/ProductVariant/1"]`; export const MissingPropsErrorMessage = `You must pass in either "variantIds" or "variantIdsAndQuantities" to ShopPayButton`; export const DoublePropsErrorMessage = `You must provide either a variantIds or variantIdsAndQuantities prop, but not both in the ShopPayButton component`; From 30633155d6e10bc30ec5b9ba33052d103c197edd Mon Sep 17 00:00:00 2001 From: Daniel Rios Pavia Date: Mon, 6 Mar 2023 13:01:10 +0100 Subject: [PATCH 03/11] fix shop pay button in demo store --- .../app/routes/($lang)/products/$productHandle.tsx | 8 ++++++-- 1 file changed, 6 insertions(+), 2 deletions(-) diff --git a/templates/demo-store/app/routes/($lang)/products/$productHandle.tsx b/templates/demo-store/app/routes/($lang)/products/$productHandle.tsx index 277d02d1df..e171e83d10 100644 --- a/templates/demo-store/app/routes/($lang)/products/$productHandle.tsx +++ b/templates/demo-store/app/routes/($lang)/products/$productHandle.tsx @@ -110,6 +110,7 @@ export async function loader({params, request, context}: LoaderArgs) { { product, shop, + storeDomain: context.storefront.getShopifyDomain(), recommended, seo, analytics: { @@ -192,7 +193,7 @@ export default function Product() { } export function ProductForm() { - const {product, analytics} = useLoaderData(); + const {product, analytics, storeDomain} = useLoaderData(); const [currentSearchParams] = useSearchParams(); const transition = useTransition(); @@ -296,7 +297,10 @@ export function ProductForm() { )} {!isOutOfStock && ( - + )} )} From 896c8d0801d815dd086dc86d6f5472a2a1d7c7db Mon Sep 17 00:00:00 2001 From: Daniel Rios Pavia Date: Mon, 6 Mar 2023 13:08:29 +0100 Subject: [PATCH 04/11] add changeset --- .changeset/flat-lions-yell.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/flat-lions-yell.md diff --git a/.changeset/flat-lions-yell.md b/.changeset/flat-lions-yell.md new file mode 100644 index 0000000000..b92a2d58f0 --- /dev/null +++ b/.changeset/flat-lions-yell.md @@ -0,0 +1,5 @@ +--- +'@shopify/hydrogen-react': patch +--- + +`ShopPayButton` component now can receive a `storeDomain`. The component now does not require `ShopifyProvider`. From 6839cd77aede6daa162ed1cbe7dcb68b18206b7d Mon Sep 17 00:00:00 2001 From: Daniel Rios Pavia Date: Mon, 6 Mar 2023 16:21:17 +0100 Subject: [PATCH 05/11] bust turbo cache --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index e7e4dd75af..83fedc3636 100644 --- a/package.json +++ b/package.json @@ -2,7 +2,7 @@ "private": true, "sideEffects": false, "scripts": { - "build": "turbo build --parallel", + "build": "turbo build --force --parallel", "build:pkg": "npm run build -- --filter=./packages/*", "ci:checks": "turbo run lint test format:check typecheck", "dev": "npm run dev:pkg -- --filter=./templates/demo-store", From 62c5df0d7316e80fcf9d2eaf298123ba1f415e28 Mon Sep 17 00:00:00 2001 From: Daniel Rios Pavia Date: Mon, 6 Mar 2023 16:27:06 +0100 Subject: [PATCH 06/11] Revert "bust turbo cache" This reverts commit 6023e837dfb35bc03d5e3dfc857df2209e0b8c02. --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 83fedc3636..e7e4dd75af 100644 --- a/package.json +++ b/package.json @@ -2,7 +2,7 @@ "private": true, "sideEffects": false, "scripts": { - "build": "turbo build --force --parallel", + "build": "turbo build --parallel", "build:pkg": "npm run build -- --filter=./packages/*", "ci:checks": "turbo run lint test format:check typecheck", "dev": "npm run dev:pkg -- --filter=./templates/demo-store", From 01da1f42557e451058b37dc7d8b945e75a393f82 Mon Sep 17 00:00:00 2001 From: Helen Lin Date: Tue, 7 Mar 2023 12:37:30 -0800 Subject: [PATCH 07/11] Update docs --- packages/hydrogen-react/.eslintrc.cjs | 4 +- .../docs/generated/generated_docs_data.json | 52 ++++++++++++++++--- .../hydrogen-react/src/ShopPayButton.doc.ts | 30 +++++++++-- .../src/ShopPayButton.example.2.jsx | 19 +++++++ .../src/ShopPayButton.example.2.tsx | 19 +++++++ .../src/ShopPayButton.example.tsx | 2 +- packages/hydrogen-react/src/ShopPayButton.tsx | 4 +- 7 files changed, 117 insertions(+), 13 deletions(-) create mode 100644 packages/hydrogen-react/src/ShopPayButton.example.2.jsx create mode 100644 packages/hydrogen-react/src/ShopPayButton.example.2.tsx diff --git a/packages/hydrogen-react/.eslintrc.cjs b/packages/hydrogen-react/.eslintrc.cjs index ac841c1658..08c8ea3e9f 100644 --- a/packages/hydrogen-react/.eslintrc.cjs +++ b/packages/hydrogen-react/.eslintrc.cjs @@ -20,6 +20,8 @@ module.exports = { '**/src/*.example.ts', '**/src/*.example.jsx', '**/src/*.example.js', + '**/src/*.example.2.jsx', + '**/src/*.example.2.js', ], extends: [ 'plugin:node/recommended', @@ -86,7 +88,7 @@ module.exports = { overrides: [ { // for .example.tsx files, we want to show the import for our own package, so we turn off the eslint rules for extraneous imports - files: ['src/*.example.?(ts|js|tsx|jsx)'], + files: ['src/*.example.?(ts|js|tsx|jsx)', 'src/*.example.2.?(ts|js|tsx|jsx)'], rules: { 'node/no-extraneous-import': 'off', 'node/no-extraneous-require': 'off', diff --git a/packages/hydrogen-react/docs/generated/generated_docs_data.json b/packages/hydrogen-react/docs/generated/generated_docs_data.json index f4fab16186..a27b9ea22e 100644 --- a/packages/hydrogen-react/docs/generated/generated_docs_data.json +++ b/packages/hydrogen-react/docs/generated/generated_docs_data.json @@ -4683,26 +4683,49 @@ "category": "components", "isVisualComponent": false, "related": [], - "description": "The `ShopPayButton` component renders a button that redirects to the Shop Pay checkout. It renders a [``](https://shopify.dev/custom-storefronts/tools/web-components) custom element, for which it will lazy-load the source code automatically. It relies on the `` context provider.", + "description": "The `ShopPayButton` component renders a button that redirects to the Shop Pay checkout. It renders a [``](https://shopify.dev/custom-storefronts/tools/web-components) custom element, for which it will lazy-load the source code automatically.", "type": "component", "defaultExample": { - "description": "I am the default example", + "description": "Example without ``", "codeblock": { "tabs": [ { "title": "JavaScript", - "code": "import {ShopPayButton} from '@shopify/hydrogen-react';\n\nexport function AddVariantQuantity1({variantId}) {\n return ;\n}\n\nexport function AddVariantQuantityMultiple({variantId, quantity}) {\n return (\n \n );\n}\n", + "code": "import {ShopPayButton} from '@shopify/hydrogen-react';\n\nexport function AddVariantQuantity1({variantId, storeDomain}) {\n return ;\n}\n\nexport function AddVariantQuantityMultiple({variantId, quantity, storeDomain}) {\n return (\n \n );\n}\n", "language": "jsx" }, { "title": "TypeScript", - "code": "import {ShopPayButton} from '@shopify/hydrogen-react';\n\nexport function AddVariantQuantity1({variantId}: {variantId: string}) {\n return ;\n}\n\nexport function AddVariantQuantityMultiple({\n variantId,\n quantity,\n}: {\n variantId: string;\n quantity: number;\n}) {\n return (\n \n );\n}\n", + "code": "import {ShopPayButton} from '@shopify/hydrogen-react';\n\nexport function AddVariantQuantity1({\n variantId,\n storeDomain,\n}: {\n variantId: string;\n storeDomain: string;\n}) {\n return ;\n}\n\nexport function AddVariantQuantityMultiple({\n variantId,\n quantity,\n storeDomain,\n}: {\n variantId: string;\n quantity: number;\n storeDomain: string;\n}) {\n return (\n \n );\n}\n", "language": "tsx" } ], - "title": "Example code" + "title": "Example without ``" } }, + "examples": { + "description": "", + "examples": [ + { + "description": "If `` context provider is used in your app, you can use the `` without supplying a `storeDomain` prop", + "codeblock": { + "tabs": [ + { + "title": "JavaScript", + "code": "import {ShopifyProvider, ShopPayButton} from '@shopify/hydrogen-react';\n\nexport default function App() {\n return (\n \n \n \n );\n}\n\nexport function AddVariantQuantity1({variantId}) {\n return ;\n}\n", + "language": "jsx" + }, + { + "title": "TypeScript", + "code": "import {ShopifyProvider, ShopPayButton} from '@shopify/hydrogen-react';\n\nexport default function App() {\n return (\n \n \n \n );\n}\n\nexport function AddVariantQuantity1({variantId}: {variantId: string}) {\n return ;\n}\n", + "language": "tsx" + } + ], + "title": "Example with ``" + } + } + ] + }, "definitions": [ { "title": "Props", @@ -4713,7 +4736,7 @@ "filePath": "/ShopPayButton.tsx", "syntaxKind": "TypeAliasDeclaration", "name": "ShopPayButtonProps", - "value": "ShopPayButtonStyleProps & (ShopPayVariantIds | ShopPayVariantAndQuantities)", + "value": "ShopPayButtonStyleProps & ShopPayDomainProps & (ShopPayVariantIds | ShopPayVariantAndQuantities)", "description": "" }, "ShopPayButtonStyleProps": { @@ -4741,6 +4764,23 @@ } ] }, + "ShopPayDomainProps": { + "filePath": "/ShopPayButton.tsx", + "syntaxKind": "TypeAliasDeclaration", + "name": "ShopPayDomainProps", + "value": "{\n /** The domain of your Shopify storefront URL (eg: `your-store.myshopify.com`). */\n storeDomain?: string;\n}", + "description": "", + "members": [ + { + "filePath": "/ShopPayButton.tsx", + "syntaxKind": "PropertySignature", + "name": "storeDomain", + "value": "string", + "description": "The domain of your Shopify storefront URL (eg: `your-store.myshopify.com`).", + "isOptional": true + } + ] + }, "ShopPayVariantIds": { "filePath": "/ShopPayButton.tsx", "syntaxKind": "TypeAliasDeclaration", diff --git a/packages/hydrogen-react/src/ShopPayButton.doc.ts b/packages/hydrogen-react/src/ShopPayButton.doc.ts index dfb82290a9..c7ef642001 100644 --- a/packages/hydrogen-react/src/ShopPayButton.doc.ts +++ b/packages/hydrogen-react/src/ShopPayButton.doc.ts @@ -5,10 +5,10 @@ const data: ReferenceEntityTemplateSchema = { category: 'components', isVisualComponent: false, related: [], - description: `The \`ShopPayButton\` component renders a button that redirects to the Shop Pay checkout. It renders a [\`\`](https://shopify.dev/custom-storefronts/tools/web-components) custom element, for which it will lazy-load the source code automatically. It relies on the \`\` context provider.`, + description: `The \`ShopPayButton\` component renders a button that redirects to the Shop Pay checkout. It renders a [\`\`](https://shopify.dev/custom-storefronts/tools/web-components) custom element, for which it will lazy-load the source code automatically.`, type: 'component', defaultExample: { - description: 'I am the default example', + description: ' without ', codeblock: { tabs: [ { @@ -22,9 +22,33 @@ const data: ReferenceEntityTemplateSchema = { language: 'tsx', }, ], - title: 'Example code', + title: ' without ', }, }, + examples: { + description: '', + examples: [ + { + description: + 'If `` context provider is used in your app, you can use the `` without supplying a `storeDomain` prop', + codeblock: { + tabs: [ + { + title: 'JavaScript', + code: './ShopPayButton.example.2.jsx', + language: 'jsx', + }, + { + title: 'TypeScript', + code: './ShopPayButton.example.2.tsx', + language: 'tsx', + }, + ], + title: ' with ', + }, + }, + ], + }, definitions: [ { title: 'Props', diff --git a/packages/hydrogen-react/src/ShopPayButton.example.2.jsx b/packages/hydrogen-react/src/ShopPayButton.example.2.jsx new file mode 100644 index 0000000000..2d057d068b --- /dev/null +++ b/packages/hydrogen-react/src/ShopPayButton.example.2.jsx @@ -0,0 +1,19 @@ +import {ShopifyProvider, ShopPayButton} from '@shopify/hydrogen-react'; + +export default function App() { + return ( + + + + ); +} + +export function AddVariantQuantity1({variantId}) { + return ; +} diff --git a/packages/hydrogen-react/src/ShopPayButton.example.2.tsx b/packages/hydrogen-react/src/ShopPayButton.example.2.tsx new file mode 100644 index 0000000000..e993a63915 --- /dev/null +++ b/packages/hydrogen-react/src/ShopPayButton.example.2.tsx @@ -0,0 +1,19 @@ +import {ShopifyProvider, ShopPayButton} from '@shopify/hydrogen-react'; + +export default function App() { + return ( + + + + ); +} + +export function AddVariantQuantity1({variantId}: {variantId: string}) { + return ; +} diff --git a/packages/hydrogen-react/src/ShopPayButton.example.tsx b/packages/hydrogen-react/src/ShopPayButton.example.tsx index f99af6d714..492bc96df1 100644 --- a/packages/hydrogen-react/src/ShopPayButton.example.tsx +++ b/packages/hydrogen-react/src/ShopPayButton.example.tsx @@ -5,7 +5,7 @@ export function AddVariantQuantity1({ storeDomain, }: { variantId: string; - storeDomain: String; + storeDomain: string; }) { return ; } diff --git a/packages/hydrogen-react/src/ShopPayButton.tsx b/packages/hydrogen-react/src/ShopPayButton.tsx index 6c6ed6dfbc..da7142e9e2 100644 --- a/packages/hydrogen-react/src/ShopPayButton.tsx +++ b/packages/hydrogen-react/src/ShopPayButton.tsx @@ -4,8 +4,8 @@ import {parseGid} from './analytics-utils.js'; // By using 'never' in the "or" cases below, it makes these props "exclusive" and means that you cannot pass both of them; you must pass either one OR the other. type ShopPayButtonProps = ShopPayButtonStyleProps & - (ShopPayVariantIds | ShopPayVariantAndQuantities) & - ShopPayDomainProps; + ShopPayDomainProps & + (ShopPayVariantIds | ShopPayVariantAndQuantities); type ShopPayButtonStyleProps = { /** A string of classes to apply to the `div` that wraps the Shop Pay button. */ From b90dd1bfeb0b695aca700927020677ff938e79ae Mon Sep 17 00:00:00 2001 From: Helen Lin Date: Tue, 7 Mar 2023 12:48:55 -0800 Subject: [PATCH 08/11] fix test and generate doc --- packages/hydrogen-react/.eslintrc.cjs | 5 ++++- .../hydrogen-react/docs/generated/generated_docs_data.json | 6 +++--- 2 files changed, 7 insertions(+), 4 deletions(-) diff --git a/packages/hydrogen-react/.eslintrc.cjs b/packages/hydrogen-react/.eslintrc.cjs index 08c8ea3e9f..a37fd04809 100644 --- a/packages/hydrogen-react/.eslintrc.cjs +++ b/packages/hydrogen-react/.eslintrc.cjs @@ -88,7 +88,10 @@ module.exports = { overrides: [ { // for .example.tsx files, we want to show the import for our own package, so we turn off the eslint rules for extraneous imports - files: ['src/*.example.?(ts|js|tsx|jsx)', 'src/*.example.2.?(ts|js|tsx|jsx)'], + files: [ + 'src/*.example.?(ts|js|tsx|jsx)', + 'src/*.example.2.?(ts|js|tsx|jsx)', + ], rules: { 'node/no-extraneous-import': 'off', 'node/no-extraneous-require': 'off', diff --git a/packages/hydrogen-react/docs/generated/generated_docs_data.json b/packages/hydrogen-react/docs/generated/generated_docs_data.json index a27b9ea22e..7d941e0200 100644 --- a/packages/hydrogen-react/docs/generated/generated_docs_data.json +++ b/packages/hydrogen-react/docs/generated/generated_docs_data.json @@ -4686,7 +4686,7 @@ "description": "The `ShopPayButton` component renders a button that redirects to the Shop Pay checkout. It renders a [``](https://shopify.dev/custom-storefronts/tools/web-components) custom element, for which it will lazy-load the source code automatically.", "type": "component", "defaultExample": { - "description": "Example without ``", + "description": " without ", "codeblock": { "tabs": [ { @@ -4700,7 +4700,7 @@ "language": "tsx" } ], - "title": "Example without ``" + "title": " without " } }, "examples": { @@ -4721,7 +4721,7 @@ "language": "tsx" } ], - "title": "Example with ``" + "title": " with " } } ] From 23ab9f323580382dd4d956751f7762ad850b293d Mon Sep 17 00:00:00 2001 From: Helen Lin Date: Tue, 7 Mar 2023 13:00:20 -0800 Subject: [PATCH 09/11] fix name --- packages/hydrogen-react/.eslintrc.cjs | 7 +------ packages/hydrogen-react/src/ShopPayButton.doc.ts | 4 ++-- ...pPayButton.example.2.jsx => ShopPayButton2.example.jsx} | 0 ...pPayButton.example.2.tsx => ShopPayButton2.example.tsx} | 0 4 files changed, 3 insertions(+), 8 deletions(-) rename packages/hydrogen-react/src/{ShopPayButton.example.2.jsx => ShopPayButton2.example.jsx} (100%) rename packages/hydrogen-react/src/{ShopPayButton.example.2.tsx => ShopPayButton2.example.tsx} (100%) diff --git a/packages/hydrogen-react/.eslintrc.cjs b/packages/hydrogen-react/.eslintrc.cjs index a37fd04809..ac841c1658 100644 --- a/packages/hydrogen-react/.eslintrc.cjs +++ b/packages/hydrogen-react/.eslintrc.cjs @@ -20,8 +20,6 @@ module.exports = { '**/src/*.example.ts', '**/src/*.example.jsx', '**/src/*.example.js', - '**/src/*.example.2.jsx', - '**/src/*.example.2.js', ], extends: [ 'plugin:node/recommended', @@ -88,10 +86,7 @@ module.exports = { overrides: [ { // for .example.tsx files, we want to show the import for our own package, so we turn off the eslint rules for extraneous imports - files: [ - 'src/*.example.?(ts|js|tsx|jsx)', - 'src/*.example.2.?(ts|js|tsx|jsx)', - ], + files: ['src/*.example.?(ts|js|tsx|jsx)'], rules: { 'node/no-extraneous-import': 'off', 'node/no-extraneous-require': 'off', diff --git a/packages/hydrogen-react/src/ShopPayButton.doc.ts b/packages/hydrogen-react/src/ShopPayButton.doc.ts index c7ef642001..f170dd6098 100644 --- a/packages/hydrogen-react/src/ShopPayButton.doc.ts +++ b/packages/hydrogen-react/src/ShopPayButton.doc.ts @@ -35,12 +35,12 @@ const data: ReferenceEntityTemplateSchema = { tabs: [ { title: 'JavaScript', - code: './ShopPayButton.example.2.jsx', + code: './ShopPayButton2.example.jsx', language: 'jsx', }, { title: 'TypeScript', - code: './ShopPayButton.example.2.tsx', + code: './ShopPayButton2.example.tsx', language: 'tsx', }, ], diff --git a/packages/hydrogen-react/src/ShopPayButton.example.2.jsx b/packages/hydrogen-react/src/ShopPayButton2.example.jsx similarity index 100% rename from packages/hydrogen-react/src/ShopPayButton.example.2.jsx rename to packages/hydrogen-react/src/ShopPayButton2.example.jsx diff --git a/packages/hydrogen-react/src/ShopPayButton.example.2.tsx b/packages/hydrogen-react/src/ShopPayButton2.example.tsx similarity index 100% rename from packages/hydrogen-react/src/ShopPayButton.example.2.tsx rename to packages/hydrogen-react/src/ShopPayButton2.example.tsx From 118461bfde629032453481dfd1c2dfd41f56ff57 Mon Sep 17 00:00:00 2001 From: Helen Lin Date: Tue, 7 Mar 2023 13:54:08 -0800 Subject: [PATCH 10/11] remove turbo cache --- .github/workflows/deploy.yml | 20 ++++++++++---------- 1 file changed, 10 insertions(+), 10 deletions(-) diff --git a/.github/workflows/deploy.yml b/.github/workflows/deploy.yml index c39d0f3b82..e78c1468ca 100644 --- a/.github/workflows/deploy.yml +++ b/.github/workflows/deploy.yml @@ -29,16 +29,16 @@ jobs: - name: 📥 Install dependencies run: npm ci - - name: 💾 Turbo cache - id: turbo-cache - uses: actions/cache@v3 - with: - path: | - node_modules/.cache/turbo - **/.turbo - key: turbo-${{ github.job }}-${{ github.ref_name }}-${{ github.sha }} - restore-keys: | - turbo-${{ github.job }}-${{ github.ref_name }}- + # - name: 💾 Turbo cache + # id: turbo-cache + # uses: actions/cache@v3 + # with: + # path: | + # node_modules/.cache/turbo + # **/.turbo + # key: turbo-${{ github.job }}-${{ github.ref_name }}-${{ github.sha }} + # restore-keys: | + # turbo-${{ github.job }}-${{ github.ref_name }}- - name: 📦 Build packages run: | From 23da2bfdbfd8ca38f53dc2d7284331833a131ff9 Mon Sep 17 00:00:00 2001 From: Helen Lin Date: Tue, 7 Mar 2023 15:45:09 -0800 Subject: [PATCH 11/11] revert tubro cache --- .github/workflows/deploy.yml | 20 ++++++++++---------- 1 file changed, 10 insertions(+), 10 deletions(-) diff --git a/.github/workflows/deploy.yml b/.github/workflows/deploy.yml index e78c1468ca..c39d0f3b82 100644 --- a/.github/workflows/deploy.yml +++ b/.github/workflows/deploy.yml @@ -29,16 +29,16 @@ jobs: - name: 📥 Install dependencies run: npm ci - # - name: 💾 Turbo cache - # id: turbo-cache - # uses: actions/cache@v3 - # with: - # path: | - # node_modules/.cache/turbo - # **/.turbo - # key: turbo-${{ github.job }}-${{ github.ref_name }}-${{ github.sha }} - # restore-keys: | - # turbo-${{ github.job }}-${{ github.ref_name }}- + - name: 💾 Turbo cache + id: turbo-cache + uses: actions/cache@v3 + with: + path: | + node_modules/.cache/turbo + **/.turbo + key: turbo-${{ github.job }}-${{ github.ref_name }}-${{ github.sha }} + restore-keys: | + turbo-${{ github.job }}-${{ github.ref_name }}- - name: 📦 Build packages run: |