wip

src/OffSiteGateway/DataTransferObjects/OffSiteGatewayPayment.php

@@ -20,7 +20,9 @@ public static function fromArray(array $data): OffSiteGatewayPayment
         $self = new self();
 
         $self->id = $data['id'] ?? '';
-        $self->checkoutUrl = $data['checkoutUrl'] ?? '';
+        $self->checkoutUrl = add_query_arg('off-site-gateway-simulation', true, home_url());
+
+        //$data['checkoutUrl'] ?? '';
 
         return $self;
     }

src/OffSiteGateway/Gateway/OffSiteGateway.php

@@ -10,6 +10,7 @@
 use Give\Framework\PaymentGateways\Commands\RedirectOffsite;
 use Give\Framework\PaymentGateways\Exceptions\PaymentGatewayException;
 use Give\Framework\PaymentGateways\PaymentGateway;
+use Give\Framework\Support\Facades\Scripts\ScriptAsset;
 use GiveAddon\OffSiteGateway\DataTransferObjects\OffSiteGatewayPayment;
 
 /**
@@ -73,11 +74,43 @@ public function getPaymentMethodLabel(): string
     }
 
     /**
+     * Add support to v2 forms
+     *
      * @unreleased
      */
     public function getLegacyFormFieldMarkup(int $formId, array $args): string
     {
-        return '<p>The Off-Site Gateway Logo Goes Here...</p>';
+        return sprintf(
+            '<div style="text-align: center;"><img src="%s" alt="OffSite Gateway Logo" /><p>%s</p></div>',
+            ADDON_CONSTANT_URL . 'src/OffSiteGateway/Gateway/resources/logo.svg',
+            __('You will be redirected to an Off-Site Gateway simulation where will be possible to complete the payment and trigger webhook notifications for test purposes.',
+                'ADDON_TEXTDOMAIN')
+        );
+    }
+
+    /**
+     * Add support to v3 forms
+     *
+     * @unreleased
+     */
+    public function enqueueScript(int $formId)
+    {
+        $assets = ScriptAsset::get(trailingslashit(ADDON_CONSTANT_DIR) . '/build/GiveAddonOffSiteGateway.asset.php');
+
+        wp_enqueue_script(
+            self::id(),
+            trailingslashit(ADDON_CONSTANT_URL) . 'build/GiveAddonOffSiteGateway.js',
+            $assets['dependencies'],
+            $assets['version'],
+            true
+        );
+
+        wp_enqueue_style(
+            self::id(),
+            trailingslashit(ADDON_CONSTANT_URL) . 'build/GiveAddonOffSiteGateway.css',
+            [],
+            $assets['version']
+        );
     }
 
     /**

src/OffSiteGateway/Gateway/OffSiteSimulation.php

@@ -0,0 +1,24 @@
+<?php
+
+namespace GiveAddon\OffSiteGateway\Gateway;
+
+class OffSiteSimulation
+{
+    public function __invoke()
+    {
+        if ( ! isset($_GET['off-site-gateway-simulation'])) {
+            return;
+        }
+
+        $referrer = $_SERVER['HTTP_REFERER'];
+
+        //V2 referrer: https://givewp.local/give/v2-tests?giveDonationFormInIframe=1
+
+        //V3 referrer: https://givewp.local/?givewp-route=donation-form-view&form-id=1350
+
+
+        echo 'Off-site Gateway Simulation';
+
+        exit();
+    }
+}

src/OffSiteGateway/Gateway/resources/OffSiteGateway.tsx

@@ -0,0 +1,24 @@
+import OffSiteGatewayLogo from './OffSiteGatewayLogo';
+import {Gateway} from './types';
+import {__} from '@wordpress/i18n';
+
+import './styles.scss';
+
+const mollieGateway: Gateway = {
+    id: 'ADDON_ID-off-site-gateway',
+    Fields() {
+        return (
+            <div style={{textAlign: 'center'}}>
+                <OffSiteGatewayLogo />
+                <p>
+                    {__(
+                        'You will be redirected to an Off-Site Gateway simulation where will be possible to complete the payment and trigger webhook notifications for test purposes.',
+                        'ADDON_TEXTDOMAIN'
+                    )}
+                </p>
+            </div>
+        );
+    },
+};
+
+window.givewp.gateways.register(mollieGateway);

src/OffSiteGateway/Gateway/resources/OffSiteGatewayLogo.tsx

@@ -0,0 +1,5 @@
+import logo from './logo.svg';
+
+export default function MollieLogo() {
+    return <img src={logo} alt="OffSite Gateway Logo" />;
+}

src/OffSiteGateway/Gateway/resources/styles.scss

@@ -0,0 +1,5 @@
+.givewp-fields-gateways__gateway--ADDON_ID-off-site-gateway {
+    .givewp-fields-gateways__gateway__icon::before {
+        content: '\f4be';
+    }
+}

src/OffSiteGateway/Gateway/resources/types.ts

@@ -0,0 +1,65 @@
+import {FC} from 'react';
+
+export interface GatewaySettings {
+    label: string;
+}
+
+export interface RegisteredGateway {
+    /**
+     * The gateway ID. Must be the same as the back-end
+     */
+    id: string;
+
+    /**
+     * The gateway label
+     */
+    label?: string;
+
+    /**
+     * Settings for the gateway as sent from the back-end
+     */
+    settings?: GatewaySettings;
+
+    /**
+     * Whether the gateway supports recurring donations
+     */
+    supportsSubscriptions?: boolean;
+}
+
+export interface Gateway extends RegisteredGateway {
+    /**
+     * Initialize function for the gateway. The settings are passed to the gateway
+     * from the server. This is called once before the form is rendered.
+     */
+    initialize?(): void;
+
+    /**
+     * The component to render when the gateway is selected
+     */
+    Fields: FC;
+
+    /**
+     * A hook before the form is submitted.
+     */
+    beforeCreatePayment?(values: FormData): Promise<object> | Error;
+
+    /**
+     * A hook after the form is submitted.
+     */
+    afterCreatePayment?(response: FormResponse): Promise<void> | Error;
+}
+
+interface FormResponse {
+    type: string;
+    data: any;
+}
+
+declare global {
+    interface Window {
+        givewp: {
+            gateways: {
+                register: (gateway: Gateway) => void;
+            };
+        };
+    }
+}

src/OffSiteGateway/OffSiteGatewayServiceProvider.php

@@ -4,8 +4,10 @@
 
 use Exception;
 use Give\Framework\PaymentGateways\PaymentGatewayRegister;
+use Give\Helpers\Hooks;
 use Give\ServiceProviders\ServiceProvider;
 use GiveAddon\OffSiteGateway\Gateway\OffSiteGateway;
+use GiveAddon\OffSiteGateway\Gateway\OffSiteSimulation;
 
 /**
  * @unreleased
@@ -33,5 +35,7 @@ function (PaymentGatewayRegister $registrar) {
                 $registrar->registerGateway(OffSiteGateway::class);
             }
         );
+
+        Hooks::addAction('init', OffSiteSimulation::class);
     }
 }

webpack.config.js

@@ -16,6 +16,7 @@ module.exports = {
     entry: {
         GiveAddonFormBuilderExtension: srcPath('FormExtension/FormBuilder/resources/js/index.tsx'),
         GiveAddonFormBuilderExtensionGlobalStyle: srcPath('FormExtension/FormBuilder/resources/css/index.scss'),
+        GiveAddonOffSiteGateway: srcPath('OffSiteGateway/Gateway/resources/OffSiteGateway.tsx'),
     },
 };