From 0cc443db06c3293b1a3697eee7175d9b14bf0784 Mon Sep 17 00:00:00 2001 From: Luis Alvarez Date: Wed, 24 Feb 2021 21:55:45 -0500 Subject: [PATCH] Updated the way the provider config is set --- .env.template | 3 +- README.md | 5 +-- framework/bigcommerce/README.md | 1 + framework/bigcommerce/next.config.js | 38 ++++---------------- framework/commerce/with-config.js | 40 +++++++++++++++++++++ next.config.js | 53 +++++++++++++++++++++++++--- 6 files changed, 100 insertions(+), 40 deletions(-) create mode 100644 framework/commerce/with-config.js diff --git a/.env.template b/.env.template index 73a8a6e3b..83e7dd403 100644 --- a/.env.template +++ b/.env.template @@ -2,4 +2,5 @@ BIGCOMMERCE_STOREFRONT_API_URL= BIGCOMMERCE_STOREFRONT_API_TOKEN= BIGCOMMERCE_STORE_API_URL= BIGCOMMERCE_STORE_API_TOKEN= -BIGCOMMERCE_STORE_API_CLIENT_ID= \ No newline at end of file +BIGCOMMERCE_STORE_API_CLIENT_ID= +BIGCOMMERCE_CHANNEL_ID= \ No newline at end of file diff --git a/README.md b/README.md index 9d2108cfe..f254b1b07 100644 --- a/README.md +++ b/README.md @@ -77,12 +77,12 @@ Main folder and its exposed functions - `config.json` - README.md -#### Example of correct usage of Commece Framework +#### Example of correct usage of Commerce Framework ```js import { useUI } from '@components/ui' import { useCustomer } from '@framework/customer' -import { useAddItem, useWishlist, useRemoveItem } from '@framework/wishlist' +import { useWishlist, useAddItem, useRemoveItem } from '@framework/wishlist' ``` ## Config @@ -131,6 +131,7 @@ BIGCOMMERCE_STOREFRONT_API_TOKEN=<> BIGCOMMERCE_STORE_API_URL=<> BIGCOMMERCE_STORE_API_TOKEN=<> BIGCOMMERCE_STORE_API_CLIENT_ID=<> +BIGCOMMERCE_CHANNEL_ID=<> ``` If your project was started with a "Deploy with Vercel" button, you can use Vercel's CLI to retrieve these credentials. diff --git a/framework/bigcommerce/README.md b/framework/bigcommerce/README.md index 86fbac91d..2609b1544 100644 --- a/framework/bigcommerce/README.md +++ b/framework/bigcommerce/README.md @@ -47,6 +47,7 @@ BIGCOMMERCE_STOREFRONT_API_TOKEN=<> BIGCOMMERCE_STORE_API_URL=<> BIGCOMMERCE_STORE_API_TOKEN=<> BIGCOMMERCE_STORE_API_CLIENT_ID=<> +BIGCOMMERCE_CHANNEL_ID=<> ``` ## General Usage diff --git a/framework/bigcommerce/next.config.js b/framework/bigcommerce/next.config.js index e732ef78a..5703f2343 100644 --- a/framework/bigcommerce/next.config.js +++ b/framework/bigcommerce/next.config.js @@ -1,37 +1,11 @@ +const providerConfig = require('./config.json') + module.exports = { + commerce: { + provider: 'bigcommerce', + ...providerConfig, + }, images: { domains: ['cdn11.bigcommerce.com'], }, - i18n: { - locales: ['en-US', 'es'], - defaultLocale: 'en-US', - }, - rewrites() { - return [ - { - source: '/checkout', - destination: '/api/bigcommerce/checkout', - }, - // The logout is also an action so this route is not required, but it's also another way - // you can allow a logout! - { - source: '/logout', - destination: '/api/bigcommerce/customers/logout?redirect_to=/', - }, - // Rewrites for /search - { - source: '/search/designers/:name', - destination: '/search', - }, - { - source: '/search/designers/:name/:category', - destination: '/search', - }, - { - // This rewrite will also handle `/search/designers` - source: '/search/:category', - destination: '/search', - }, - ] - }, } diff --git a/framework/commerce/with-config.js b/framework/commerce/with-config.js new file mode 100644 index 000000000..6dcf08986 --- /dev/null +++ b/framework/commerce/with-config.js @@ -0,0 +1,40 @@ +/** + * This file is expected to be used in next.config.js only + */ + +const merge = require('deepmerge') + +const PROVIDERS = ['bigcommerce'] + +function getProviderName() { + return process.env.BIGCOMMERCE_STOREFRONT_API_URL ? 'bigcommerce' : null +} + +module.exports = (nextConfig = {}) => { + const commerce = nextConfig.commerce || {} + const name = commerce.provider || getProviderName() + + if (!name) { + throw new Error( + `The commerce provider is missing, please add a valid provider name or its environment variables` + ) + } + if (!PROVIDERS.includes(name)) { + throw new Error( + `The commerce provider "${name}" can't be found, please use one of "${PROVIDERS.join( + ', ' + )}"` + ) + } + + const commerceNextConfig = require(`../${name}/next.config`) + const config = merge(commerceNextConfig, nextConfig) + + config.env = config.env || {} + + Object.entries(config.commerce.features).forEach(([k, v]) => { + if (v) config.env[`COMMERCE_${k.toUpperCase()}_ENABLED`] = true + }) + + return config +} diff --git a/next.config.js b/next.config.js index 749fd1b0a..74be36a5d 100644 --- a/next.config.js +++ b/next.config.js @@ -1,6 +1,49 @@ -const providerConfig = require('./framework/bigcommerce/config.json') -const providerNextConfig = require('./framework/bigcommerce/next.config') -const bootstrap = require('./framework/commerce/utils/bootstrap') -const d = require('deepmerge') +// const providerConfig = require('./framework/bigcommerce/config.json') +// const providerNextConfig = require('./framework/bigcommerce/next.config') +// const bootstrap = require('./framework/commerce/utils/bootstrap') +// const d = require('deepmerge') -module.exports = d(providerNextConfig, bootstrap(providerConfig)) +// module.exports = d(providerNextConfig, bootstrap(providerConfig)) + +const withCommerceConfig = require('./framework/commerce/with-config') + +const commerce = { provider: 'bigcommerce' } +const isBC = commerce.provider === 'bigcommerce' + +module.exports = withCommerceConfig({ + commerce, + i18n: { + locales: ['en-US', 'es'], + defaultLocale: 'en-US', + }, + rewrites() { + return [ + isBC && { + source: '/checkout', + destination: '/api/bigcommerce/checkout', + }, + // The logout is also an action so this route is not required, but it's also another way + // you can allow a logout! + isBC && { + source: '/logout', + destination: '/api/bigcommerce/customers/logout?redirect_to=/', + }, + // Rewrites for /search + { + source: '/search/designers/:name', + destination: '/search', + }, + { + source: '/search/designers/:name/:category', + destination: '/search', + }, + { + // This rewrite will also handle `/search/designers` + source: '/search/:category', + destination: '/search', + }, + ].filter((x) => x) + }, +}) + +console.log('RESULT', module.exports)