initial commit project skeleton

commercetools · Jan 18, 2024 · cc5c72a · cc5c72a
commit cc5c72a
Show file tree

Hide file tree

Showing 31 changed files with 2,613 additions and 0 deletions.
diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml
@@ -0,0 +1,44 @@
+name: CI
+
+on: [push]
+
+jobs:
+  build-enabler:
+    name: Build the application for enabler
+    runs-on: ubuntu-latest
+    env:
+      CTP_REGION: ${{ secrets.CTP_REGION }}
+    defaults:
+      run:
+        working-directory: enabler
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v3
+
+      - name: Use Node.js 16.x
+        uses: actions/setup-node@v3
+        with:
+          node-version: '16.x'
+
+      - name: Install modules
+        run: npm ci
+
+  build-processor:
+    name: Build the application for processor
+    runs-on: ubuntu-latest
+    env:
+      CTP_REGION: ${{ secrets.CTP_REGION }}
+    defaults:
+      run:
+        working-directory: processor
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v3
+
+      - name: Use Node.js 16.x
+        uses: actions/setup-node@v3
+        with:
+          node-version: '16.x'
+
+      - name: Install modules
+        run: npm ci
diff --git a/LICENSE b/LICENSE
@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2023 commercetools
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
diff --git a/README.md b/README.md
@@ -0,0 +1,2 @@
+# connect-payment-integration-template
+This repository provides a [connect](https://docs.commercetools.com/connect) template for payment integration connector. This boilerplate code acts as a starting point for such integration.
diff --git a/connect.yaml b/connect.yaml
@@ -0,0 +1,13 @@
+deployAs:
+  - name: enabler
+    applicationType: service
+    endpoint: /public
+    scripts:
+      postDeploy: npm install && npm run connector:post-deploy
+      preUndeploy: npm install && npm run connector:pre-undeploy
+  - name: processor
+    applicationType: service
+    endpoint: /endpoint
+    scripts:
+      postDeploy: npm install && npm run connector:post-deploy
+      preUndeploy: npm install && npm run connector:pre-undeploy
diff --git a/enabler/.env.template b/enabler/.env.template
@@ -0,0 +1,5 @@
+VITE_ADMIN_CLIENT_ID=IYg3zsamDxEtBVhN0GXPfSyz
+VITE_ADMIN_CLIENT_SECRET=Ti5_ciOUgU76hu0hq75shf0V3Fg4Oean
+VITE_ADMIN_SCOPE=manage_project:commercetools-checkout
+VITE_REGION=europe-west1.gcp
+VITE_CART_ID=f49ea44e-a189-4f9f-b17f-b09f29da49c9
diff --git a/enabler/.gitignore b/enabler/.gitignore
@@ -0,0 +1,24 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
diff --git a/enabler/decs.d.ts b/enabler/decs.d.ts
@@ -0,0 +1,7 @@
+declare module "@adyen/adyen-web" 
+declare module "@adyen/adyen-web/dist/types/components/ApplePay" 
+declare module "@adyen/adyen-web/dist/types/components/GooglePay" 
+declare module "@adyen/adyen-web/dist/types/core" 
+declare module "@adyen/adyen-web/dist/types/core/core" 
+declare module "@adyen/adyen-web/dist/types/components/Redirect/Redirect" 
+declare module "@adyen/adyen-web/dist/types/core/types"
diff --git a/enabler/index.html b/enabler/index.html
@@ -0,0 +1,73 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Vite + TS</title>
+    <script>
+      var __VITE_ADMIN_CLIENT_ID__ = !'%VITE_ADMIN_CLIENT_ID%'.startsWith('%') && '%VITE_ADMIN_CLIENT_ID%' || 'IYg3zsamDxEtBVhN0GXPfSyz';
+      var __VITE_ADMIN_CLIENT_SECRET__ = !'%VITE_ADMIN_CLIENT_SECRET%'.startsWith('%') && '%VITE_ADMIN_CLIENT_SECRET%' || 'Ti5_ciOUgU76hu0hq75shf0V3Fg4Oean';
+      var __VITE_ADMIN_SCOPE__ = !'%VITE_ADMIN_SCOPE%'.startsWith('%') && '%VITE_ADMIN_SCOPE%' || 'manage_project:commercetools-checkout';
+      var __VITE_REGION__ = !'%VITE_REGION%'.startsWith('%') && '%VITE_REGION%' || 'europe-west1.gcp';
+      var __VITE_CART_ID__ = !'%VITE_CART_ID%'.startsWith('%') && '%VITE_CART_ID%' || 'f49ea44e-a189-4f9f-b17f-b09f29da49c9';
+    </script>
+    <script src="./session.js"></script>
+  </head>
+  <body>
+    <div id="app"></div>
+    <script type="module">
+      import { Connector } from '/lib/main.ts';
+
+      const sessionId = await getSessionId();
+
+      const connector = new Connector({
+          connectorUrl: "http://0.0.0.0:5000",
+          sessionId: sessionId,
+          config: {
+
+          },
+          onComplete: ({ isSuccess, paymentReference }) => {
+            console.log('onComplete', { isSuccess, paymentReference });
+          },
+      });
+
+      connector.createComponent('dropin', {
+        config: {},
+      })
+      .then(e => e.mount('#adyen-dropin-component'));
+
+      connector.createComponent('card', {
+        config: {},
+      })
+      .then(e => e.mount('#adyen-card-component'));
+
+      connector.createComponent('ideal', {
+        config: {showPayButton: false},
+      })
+      .then(e => e.mount('#adyen-ideal-component'));
+
+      connector.createComponent('googlepay', {})
+      .then(e => e.mount('#adyen-googlepay-component'));
+    </script>
+
+    <div class="container-md p-3 border m-3">
+      <div class="container-md p-3 border m-3">
+        <h5>Adyen dropin component:</h5>
+        <div id="adyen-dropin-component"></div>
+      </div>
+      <div class="container-md p-3 border m-3">
+        <h5>Adyen card component:</h5>
+        <div id="adyen-card-component"></div>
+      </div>
+      <div class="container-md p-3 border m-3">
+        <h5>Ideal component:</h5>
+        <div id="adyen-ideal-component"></div>
+      </div>
+      <div class="container-md p-3 border m-3">
+        <h5>Googlepay component:</h5>
+        <div id="adyen-googlepay-component"></div>
+      </div>
+    </div>
+  </body>
+</html>
diff --git a/enabler/lib/components/base.ts b/enabler/lib/components/base.ts
@@ -0,0 +1,75 @@
+import Core from '@adyen/adyen-web/dist/types/core/core';
+import { ComponentOptions, PaymentResult } from '../payment-connector/paymentConnector';
+import ApplePay from '@adyen/adyen-web/dist/types/components/ApplePay';
+import GooglePay from '@adyen/adyen-web/dist/types/components/GooglePay';
+import RedirectElement from '@adyen/adyen-web/dist/types/components/Redirect/Redirect';
+
+export type ElementOptions = {
+  adyenPaymentMethod: 'card' | 'ideal' | 'googlepay' | 'dropin' | 'applepay' | string;
+  isOffsite?: boolean;
+};                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                               
+
+/**
+ * Base Component
+ */
+export class BaseComponent {
+  protected _paymentMethod: string;
+  protected _offsite: boolean = false;
+  protected _adyenCheckout: typeof Core;
+  protected _config: any;
+
+  public component: typeof ApplePay | typeof GooglePay | typeof RedirectElement;
+
+  constructor(opts: ElementOptions, componentOptions: ComponentOptions, adyenCheckout: typeof Core) {
+    this._paymentMethod = opts.adyenPaymentMethod;
+    this._offsite = !!opts.isOffsite;
+    this._adyenCheckout = adyenCheckout;
+    this.beforePay = componentOptions.beforePay || (() => Promise.resolve());
+    this.onError = componentOptions.onError;
+    this.onComplete = componentOptions.onComplete;
+    this.component = this._create();
+  }
+
+  beforePay: () => Promise<void>;
+
+  protected _create(): typeof ApplePay | typeof GooglePay | typeof RedirectElement {
+    return this._adyenCheckout.create(this._paymentMethod, this._config);
+  }
+
+  submit() {
+    this.beforePay().then(() => {
+      this.component.submit();
+    });
+  }
+
+  hasSubmit() {
+    return true;
+  }
+
+  isOffsite() {
+    return this._offsite;
+  }
+
+  isAvailable() {
+    return 'isAvailable' in this.component ? this.component.isAvailable() : Promise.resolve();
+  }
+
+  isValid() {
+    return this.component.isValid;
+  }
+
+  mount(selector: string) {
+    this
+      .isAvailable()
+      .then(() => {
+        this.component.mount(selector);
+      })
+      .catch((e: unknown) => {
+        console.log(`${this._paymentMethod } is not available`, e);
+      });
+  }
+
+  onComplete: ((result: PaymentResult) => Promise<void>) | undefined;
+
+  onError: ((error: any) => Promise<void>) | undefined;
+}
diff --git a/enabler/lib/components/payment-methods/applepay.ts b/enabler/lib/components/payment-methods/applepay.ts
@@ -0,0 +1,31 @@
+import { BaseComponent } from '../base';
+import ApplePay from '@adyen/adyen-web/dist/types/components/ApplePay';
+import Core from '@adyen/adyen-web/dist/types/core';
+import { ComponentOptions } from '../../payment-connector/paymentConnector';
+
+/**
+ * Apple pay component
+ *
+ * Configuration options:
+ * https://docs.adyen.com/payment-methods/apple-pay/web-component/
+ */
+export class Applepay extends BaseComponent {
+  constructor(componentOptions: ComponentOptions, adyenCheckout: typeof Core) {
+    super({ adyenPaymentMethod: 'applepay' }, componentOptions, adyenCheckout);
+  }
+
+  protected _create() {
+    return this._adyenCheckout.create(this._paymentMethod, {
+      onClick: (resolve, reject) => {
+        this.beforePay()
+          .then(() => resolve())
+          .catch(() => reject());
+      },
+      ...this._config,
+    }) as unknown as typeof ApplePay;
+  }
+
+  hasSubmit() {
+    return false;
+  }
+}
diff --git a/enabler/lib/components/payment-methods/card.ts b/enabler/lib/components/payment-methods/card.ts
@@ -0,0 +1,17 @@
+import { BaseComponent } from '../base';
+import { ComponentOptions } from '../../payment-connector/paymentConnector';
+import Core from '@adyen/adyen-web/dist/types/core';
+
+/**
+ * Credit card component
+ *
+ * Configuration options:
+ * https://docs.adyen.com/payment-methods/cards/web-component/
+ */
+
+
+export class Card extends BaseComponent {
+  constructor(componentOptions: ComponentOptions, adyenCheckout: typeof Core) {
+    super({ adyenPaymentMethod: 'card' }, componentOptions, adyenCheckout);
+  }
+}
diff --git a/enabler/lib/components/payment-methods/dropin.ts b/enabler/lib/components/payment-methods/dropin.ts
@@ -0,0 +1,18 @@
+import { BaseComponent } from '../base';
+import Core from '@adyen/adyen-web/dist/types/core';
+import { ComponentOptions } from '../../payment-connector/paymentConnector';
+
+/**
+ * Dropin component
+ *
+ * Configuration options:
+ * https://docs.adyen.com/payment-methods/ideal/web-component/
+ */
+export class Dropin extends BaseComponent {
+  constructor(componentOptions: ComponentOptions, adyenCheckout: typeof Core) {
+    super({
+      adyenPaymentMethod: 'dropin',
+      isOffsite: true,
+    }, componentOptions, adyenCheckout);
+  }
+}
diff --git a/enabler/lib/components/payment-methods/googlepay.ts b/enabler/lib/components/payment-methods/googlepay.ts
@@ -0,0 +1,33 @@
+import { BaseComponent } from '../base';
+import GooglePay from '@adyen/adyen-web/dist/types/components/GooglePay';
+import Core from '@adyen/adyen-web/dist/types/core';
+import { ComponentOptions } from '../../payment-connector/paymentConnector';
+
+/**
+ * Google pay component
+ *
+ * Configuration options:
+ * https://docs.adyen.com/payment-methods/google-pay/web-component/
+ */
+export class Googlepay extends BaseComponent {
+  constructor(componentOptions: ComponentOptions, adyenCheckout: typeof Core) {
+    super({
+      adyenPaymentMethod: 'googlepay',
+    }, componentOptions, adyenCheckout);
+  }
+
+  protected _create() {
+    return this._adyenCheckout.create(this._paymentMethod, {
+      onClick: (resolve, reject) => {
+        this.beforePay()
+          .then(() => resolve())
+          .catch(() => reject());
+      },
+      ...this._config,
+    }) as unknown as typeof GooglePay;
+  }
+
+  hasSubmit() {
+    return false;
+  }
+}
diff --git a/enabler/lib/components/payment-methods/ideal.ts b/enabler/lib/components/payment-methods/ideal.ts
@@ -0,0 +1,18 @@
+import { BaseComponent } from '../base';
+import Core from '@adyen/adyen-web/dist/types/core';
+import { ComponentOptions } from '../../payment-connector/paymentConnector';
+
+/**
+ * Ideal component
+ *
+ * Configuration options:
+ * https://docs.adyen.com/payment-methods/ideal/web-component/
+ */
+export class Ideal extends BaseComponent {
+  constructor(componentOptions: ComponentOptions, adyenCheckout: typeof Core) {
+    super({
+      adyenPaymentMethod: 'ideal',
+      isOffsite: true,
+    }, componentOptions, adyenCheckout);
+  }
+}
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,2 @@
		# connect-payment-integration-template
		This repository provides a [connect](https://docs.commercetools.com/connect) template for payment integration connector. This boilerplate code acts as a starting point for such integration.