diff --git a/.changeset/rude-jars-remain.md b/.changeset/rude-jars-remain.md new file mode 100644 index 00000000..eb5e2de8 --- /dev/null +++ b/.changeset/rude-jars-remain.md @@ -0,0 +1,6 @@ +--- +"composable-cli": patch +"@elasticpath/d2c-schematics": patch +--- + +d2c generate command is now using the new ep payments ep-payments command for gateway setup diff --git a/packages/composable-cli/src/commands/generate/d2c/d2c-command.tsx b/packages/composable-cli/src/commands/generate/d2c/d2c-command.tsx index 4bb0e0d7..8e21898e 100644 --- a/packages/composable-cli/src/commands/generate/d2c/d2c-command.tsx +++ b/packages/composable-cli/src/commands/generate/d2c/d2c-command.tsx @@ -48,6 +48,7 @@ import { detect } from "../../../lib/detect-package-manager" import { createAlgoliaIntegrationCommandHandler } from "../../integration/algolia/algolia-integration-command" import boxen from "boxen" import { getCredentials } from "../../../lib/authentication/get-token" +import { createEPPaymentsCommandHandler } from "../../payments/ep-payments/ep-payments-command" export function createD2CCommand( ctx: CommandContext, @@ -337,6 +338,9 @@ export function createD2CCommandHandler( plpType?: "Algolia" | "None" algoliaApplicationId?: string algoliaAdminApiKey?: string + paymentGatewayType?: PaymentTypeOptions["paymentGatewayType"] + epPaymentsStripeAccountId?: string + epPaymentsStripePublishableKey?: string } = { name, } @@ -437,6 +441,7 @@ export function createD2CCommandHandler( gatheredOptions = { ...gatheredOptions, ...additionalOptions.plp, + ...additionalOptions.paymentGateway, } } @@ -476,6 +481,8 @@ export function createD2CCommandHandler( }. No files written to disk.`, ) } else { + let notes: { title: string; description: string }[] = [] + if (gatheredOptions.plpType === "Algolia") { logger.info( boxen( @@ -505,18 +512,54 @@ export function createD2CCommandHandler( }) if (result.success) { - logger.info( - boxen( - `Don't forget to add your Algolia index name to .env.local ${colors.bold.green( - `NEXT_PUBLIC_ALGOLIA_INDEX_NAME=${result.data.indexName}` ?? - "", - )}`, - { - padding: 1, - margin: 1, - }, - ), - ) + notes.push({ + title: "Algolia setup", + description: `Don't forget to add your Algolia index name to .env.local ${colors.bold.green( + `NEXT_PUBLIC_ALGOLIA_INDEX_NAME=${result.data.indexName}` ?? + "", + )}`, + }) + } + } + } + + if (gatheredOptions.paymentGatewayType === "EP Payments") { + logger.info( + boxen( + `${colors.bold.green( + "EP payments needs to be configured", + )}\nTo get your checkout working you need to configure EP Payments.`, + { + padding: 1, + margin: 1, + }, + ), + ) + + const { configureEpPayments } = await inquirer.prompt([ + { + type: "confirm", + name: "configureEpPayments", + message: "Do you want to configure EP Payments?", + }, + ]) + + if (configureEpPayments) { + const result = await createEPPaymentsCommandHandler(ctx)({ + accountId: gatheredOptions.epPaymentsStripeAccountId, + publishableKey: gatheredOptions.epPaymentsStripePublishableKey, + ...args, + }) + + if (result.success) { + notes.push({ + title: "EP Payments setup", + description: `Don't forget to add your EP Payment variables to .env.local ${colors.bold.green( + `\nNEXT_PUBLIC_STRIPE_ACCOUNT_ID=${gatheredOptions.epPaymentsStripeAccountId}`, + )}${colors.bold.green( + `\nNEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY=${gatheredOptions.epPaymentsStripePublishableKey}`, + )}`, + }) } } } @@ -525,6 +568,7 @@ export function createD2CCommandHandler( React.createElement(D2CGenerated, { name: (gatheredOptions as any).name, nodePkgManager: pkgManager, + notes, }), ) } @@ -556,6 +600,14 @@ export function createD2CCommandHandler( } } +type PaymentTypeOptions = + | { + paymentGatewayType: "EP Payments" + epPaymentsStripeAccountId: string + epPaymentsStripePublishableKey: string + } + | { paymentGatewayType: "None" } + type PlpTypeOptions = | { plpType: "Algolia" @@ -567,6 +619,7 @@ type PlpTypeOptions = async function schematicOptionPrompts(): Promise<{ plp: PlpTypeOptions + paymentGateway: PaymentTypeOptions }> { const { plpType } = await inquirer.prompt([ { @@ -591,8 +644,56 @@ async function schematicOptionPrompts(): Promise<{ ? await algoliaSchematicPrompts() : { plpType: "None" as const } + const { paymentGatewayType } = await inquirer.prompt([ + { + type: "list", + name: "paymentGatewayType", + message: "What type of payment gateway do you want to use?", + choices: [ + { + name: "EP Payments", + value: "EP Payments", + }, + { + name: "None", + value: "None", + }, + ], + }, + ]) + + const paymentGateway = + paymentGatewayType === "EP Payments" + ? await epPaymentsSchematicPrompts() + : { paymentGatewayType: "None" as const } + return { plp, + paymentGateway, + } +} + +async function epPaymentsSchematicPrompts(): Promise { + const { epPaymentsStripeAccountId } = await inquirer.prompt([ + { + type: "string", + name: "epPaymentsStripeAccountId", + message: "What is your Elastic Path Payments Account ID?", + }, + ]) + + const { epPaymentsStripePublishableKey } = await inquirer.prompt([ + { + type: "string", + name: "epPaymentsStripePublishableKey", + message: "What is your Elastic Path Payments Publishable Key?", + }, + ]) + + return { + paymentGatewayType: "EP Payments", + epPaymentsStripeAccountId, + epPaymentsStripePublishableKey, } } diff --git a/packages/composable-cli/src/commands/payments/ep-payments/ep-payments-integration.types.ts b/packages/composable-cli/src/commands/payments/ep-payments/ep-payments-integration.types.ts index 2ddd4bc6..29a3a315 100644 --- a/packages/composable-cli/src/commands/payments/ep-payments/ep-payments-integration.types.ts +++ b/packages/composable-cli/src/commands/payments/ep-payments/ep-payments-integration.types.ts @@ -1,8 +1,6 @@ import { PaymentsCommandArguments } from "../payments.types" -export type EPPaymentsCommandData = { - indexName?: string -} +export type EPPaymentsCommandData = {} export type EPPaymentsCommandError = { code: string diff --git a/packages/composable-cli/src/commands/ui/generate/d2c-generated.tsx b/packages/composable-cli/src/commands/ui/generate/d2c-generated.tsx index 53cd175d..f9e3670c 100644 --- a/packages/composable-cli/src/commands/ui/generate/d2c-generated.tsx +++ b/packages/composable-cli/src/commands/ui/generate/d2c-generated.tsx @@ -1,12 +1,14 @@ import React from "react" -import { Box, Text } from "ink" +import { Box, Newline, Text } from "ink" export function D2CGenerated({ name, nodePkgManager, + notes, }: { name: string nodePkgManager: "yarn" | "npm" | "pnpm" | "bun" + notes: { title: string; description: string }[] }) { return ( - Next steps: - {constructSteps({ name, nodePkgManager }).map((step, index) => ( - - - Step {index + 1}: {step} - - ))} + + Next steps: + + + {constructSteps({ name, nodePkgManager, hasNotes: notes.length > 0 }).map( + (step, index) => ( + + - Step {index + 1}: {step} + + ), + )} + + {notes.length > 0 && ( + <> + + Additional Setup + + + {notes.map((note) => { + return ( + + {note.title} + + {note.description} + + ) + })} + + )} ) } @@ -28,13 +58,16 @@ export function D2CGenerated({ function constructSteps({ name, nodePkgManager, + hasNotes, }: { name: string nodePkgManager: "yarn" | "npm" | "pnpm" | "bun" + hasNotes: boolean }) { return [ `Navigate to your project directory using 'cd ${name}'`, `Run install using '${resolveInstallCommand(nodePkgManager)}'`, + ...(hasNotes ? ["Follow the additional setup steps below"] : []), `Start the development server using '${resolveStartCommand( nodePkgManager, )}'`, diff --git a/packages/d2c-schematics/ep-payments-payment-gateway/index.ts b/packages/d2c-schematics/ep-payments-payment-gateway/index.ts index 2516a424..a0786333 100644 --- a/packages/d2c-schematics/ep-payments-payment-gateway/index.ts +++ b/packages/d2c-schematics/ep-payments-payment-gateway/index.ts @@ -11,13 +11,11 @@ import { url, noop, filter, - SchematicContext, } from "@angular-devkit/schematics" import { Schema as EPPaymentsPaymentGatewayOptions } from "./schema" import { addDependency } from "../utility" import { latestVersions } from "../utility/latest-versions" import { addEnvVariables } from "../utility/add-env-variable" -import { RunSchematicTask } from "@angular-devkit/schematics/tasks" export const EP_PAYMENTS_DEPENDENCIES = [ "@stripe/react-stripe-js", @@ -49,7 +47,7 @@ export default function (options: EPPaymentsPaymentGatewayOptions): Rule { [EP_PAYMENT_STRIPE_PUBLISHABLE_KEY]: epPaymentsStripePublishableKey, }, - "/.env.test" + "/.env.test", ), ...EP_PAYMENTS_DEPENDENCIES.map((name) => addDependency(name, latestVersions[name], { @@ -59,7 +57,7 @@ export default function (options: EPPaymentsPaymentGatewayOptions): Rule { : "/package.json", existing: "skip", install: "none", - }) + }), ), mergeWith( apply(url("./files"), [ @@ -72,31 +70,8 @@ export default function (options: EPPaymentsPaymentGatewayOptions): Rule { }), move(options.path || ""), ]), - MergeStrategy.Overwrite + MergeStrategy.Overwrite, ), - (host: Tree, context: SchematicContext) => { - const { - epccEndpointUrl, - epccClientId, - epccClientSecret, - epPaymentsStripeAccountId, - epPaymentsStripePublishableKey, - } = options - if (!options.skipConfig) { - context.addTask( - new RunSchematicTask("setup-payment-gateway", { - gatewayName: "ep-payments", - epccConfig: { - host: epccEndpointUrl, - clientId: epccClientId, - clientSecret: epccClientSecret, - }, - epPaymentsStripeAccountId, - epPaymentsStripePublishableKey, - }) - ) - } - }, ]) } } diff --git a/packages/d2c-schematics/setup-payment-gateway/index.ts b/packages/d2c-schematics/setup-payment-gateway/index.ts index 8d038016..ee5c60e0 100644 --- a/packages/d2c-schematics/setup-payment-gateway/index.ts +++ b/packages/d2c-schematics/setup-payment-gateway/index.ts @@ -1,7 +1,6 @@ import { noop, Rule, SchematicContext, Tree } from "@angular-devkit/schematics" import { Schema as SetupPaymentGatewayOptions } from "./schema" import { createFallbackLogger } from "../utility/fallback-logger" -import { setupEPPaymentGateway } from "../utility/payment-gateway/setup-payment-gateway" export default function (options: SetupPaymentGatewayOptions): Rule { return async (host: Tree, context: SchematicContext): Promise => { @@ -9,11 +8,9 @@ export default function (options: SetupPaymentGatewayOptions): Rule { try { switch (options.gatewayName) { - case "ep-payments": - return setupEPPaymentGateway(options, host, logger) default: logger.error( - `Failed to setup payment gateway, unsupported payment gateway name: ${options.gatewayName}` + `Failed to setup payment gateway, unsupported payment gateway name: ${options.gatewayName}`, ) return noop() } @@ -23,7 +20,7 @@ export default function (options: SetupPaymentGatewayOptions): Rule { err instanceof Error ? `${err.name} - ${err.message}` : "Couldn't process error message" - }` + }`, ) return noop() }