Integrating Heidelpay

Last updated:
Edit on GitHub

Heidelpay is not compatible with gift cards. We are working on a solution.

To integrate Heidelpay, follow the steps below:

Back-end Integration

  1. Add sub form plugins and payment method handlers:

Pyz\Yves\CheckoutPage\CheckoutPageDependencyProvider

 protected function addSubFormPluginCollection(Container $container): Container
{
	$container[self::PAYMENT_SUB_FORMS] = function () {
		$subFormPluginCollection = new SubFormPluginCollection();
		...
		$subFormPluginCollection->add(new HeidelpaySofortSubFormPlugin());
		$subFormPluginCollection->add(new HeidelpayPaypalAuthorizeSubFormPlugin());
		$subFormPluginCollection->add(new HeidelpayPaypalDebitSubFormPlugin());
		$subFormPluginCollection->add(new HeidelpayIdealSubFormPlugin());
		$subFormPluginCollection->add(new HeidelpayCreditCardSecureSubFormPlugin());

		return $subFormPluginCollection;
	};

	return $container;
}

protected function addPaymentMethodHandlerPluginCollection(Container $container):
{
	$container[self::PAYMENT_METHOD_HANDLER] = function () {
		$stepHandlerPluginCollection = new StepHandlerPluginCollection();
		...
		$stepHandlerPluginCollection->add(new HeidelpayHandlerPlugin(), PaymentTransfer::HEIDELPAY_SOFORT);
		$stepHandlerPluginCollection->add(new HeidelpayHandlerPlugin(), PaymentTransfer::HEIDELPAY_PAYPAL_AUTHORIZE);
		$stepHandlerPluginCollection->add(new HeidelpayHandlerPlugin(), PaymentTransfer::HEIDELPAY_PAYPAL_DEBIT);
		$stepHandlerPluginCollection->add(new HeidelpayHandlerPlugin(), PaymentTransfer::HEIDELPAY_IDEAL);
		$stepHandlerPluginCollection->add(new HeidelpayCreditCardHandlerPlugin(), PaymentTransfer::HEIDELPAY_CREDIT_CARD_SECURE);

		return $stepHandlerPluginCollection;
	};

	return $container;
}
  1. Add route provider plugin:

\Pyz\Yves\Router\RouterDependencyProvider

protected function getRouteProvider(): array
{
	return [
		...
		new HeidelpayRouteProviderPlugin(),
	];
}
  1. Add checkout plugins:

\Pyz\Zed\Checkout\CheckoutDependencyProvider

 protected function getCheckoutOrderSavers(Container $container)
{
	$plugins = [
		...
		new HeidelpaySaveOrderPlugin(),
	];

	return $plugins;
}

protected function getCheckoutPostHooks(Container $container)
{
	return [
		...
		new HeidelpayPostSavePlugin(),
	];
}
  1. Add OMS commands and conditions:

\Pyz\Zed\Oms\OmsDependencyProvider

public function provideBusinessLayerDependencies(Container $container)
{
	$container = parent::provideBusinessLayerDependencies($container);
	$container = $this->addCommandPlugins($container);
	$container = $this->addConditionPlugins($container);

	return $container;
}
protected function addConditionPlugins(Container $container): Container
{
	$container[self::CONDITION_PLUGINS] = function () {
		$conditionCollection = new ConditionCollection();
		$conditionCollection->add(new IsAuthorizationCompletedPlugin(), 'Heidelpay/IsAuthorizationCompleted');
		$conditionCollection->add(new IsDebitCompletedPlugin(), 'Heidelpay/IsDebitCompleted');
		$conditionCollection->add(new IsCaptureApprovedPlugin(), 'Heidelpay/IsCaptureApproved');

		return $conditionCollection;
	};

	return $container;
}

protected function addCommandPlugins(Container $container): Container
{
	$container[self::COMMAND_PLUGINS] = function () {
		$commandCollection = new CommandCollection();
		$commandCollection->add(new SendOrderConfirmationPlugin(), 'Oms/SendOrderConfirmation');
		$commandCollection->add(new SendOrderShippedPlugin(), 'Oms/SendOrderShipped');
		$commandCollection->add(new AuthorizePlugin(), 'Heidelpay/Authorize');
		$commandCollection->add(new DebitPlugin(), 'Heidelpay/Debit');
		$commandCollection->add(new CapturePlugin(), 'Heidelpay/Capture');

		return $commandCollection;
	};

	return $container;
}

Front-end Integration

To make Heidelpay module work with your project, it’s necessary to extend the frontend part:

tsconfig.json

 "include": [
 "./vendor/spryker/spryker-shop/**/*",
 "./vendor/spryker-eco/**/*",
 "./src/Pyz/Yves/**/*"
],

frontend/settings.js

 // eco folders
eco: {
 // all modules
 modules: './vendor/spryker-eco'
},
...
 componentEntryPoints: {
 // absolute dirs in which look for
 dirs: [
 ...
 path.join(context, paths.eco.modules),
 ...
 ],

src/Pyz/Yves/CheckoutPage/Theme/default/views/payment/payment.twig

 ...

{% define data = {
    backUrl: _view.previousStepUrl,
    forms: {
        payment: _view.paymentForm,
    },
    title: 'checkout.step.payment.title' | trans,
    customForms: {
        'heidelpay/sofort': ['sofort', 'heidelpay'],
        'heidelpay/credit-card-secure': ['credit-card-secure', 'heidelpay'],
    },
} %}

{% block content %}
    {% embed molecule('form') with {
        class: 'box',
        data: {
            form: data.forms.payment,
            options: {
                attr: {
                    id: 'payment-form',
                },
            },
            submit: {
                enable: true,
                isSingleClickEnforcerEnabled: false,
                text: 'checkout.step.summary' | trans,
                class: 'button button--success js-payone-credit-card__submit',
            },
            cancel: {
                enable: true,
                url: data.backUrl,
                text: 'general.back.button' | trans,
            },
        },
        embed: {
            customForms: data.customForms,
        },
    } only %}
        {% block errors %}
            {{ parent() }}
            {{ form_errors(data.form.paymentSelection) }}
        {% endblock %}

        {% block fieldset %}
            {% for name, choices in data.form.paymentSelection.vars.choices %}
                {% set paymentProviderIndex = loop.index0 %}
                <h5>{{ name | trans }}</h5>
                <ul>
                    {% for key, choice in choices %}
                        <li class="list__item spacing-y clear">
                            {% embed molecule('form') with {
                                data: {
                                    form: data.form[data.form.paymentSelection[key].vars.name],
                                    enableStart: false,
                                    enableEnd: false,
                                },
                                embed: {
                                    customForms: embed.customForms,
                                    index: loop.index ~ '-' ~ paymentProviderIndex,
                                    toggler: data.form.paymentSelection[key],
                                },
                            } only %}
                                {% block fieldset %}
                                    {{ form_row(embed.toggler, {
                                        required: false,
                                        component: molecule('toggler-radio'),
                                        attributes: {
                                            'target-class-name': 'js-payment-method-' ~ embed.index,
                                        }
                                    }) }}
                                    <div class="col col--sm-12 is-hidden js-payment-method-">
                                        <div class="col col--sm-12 col--md-6">
                                            {% if embed.customForms[data.form.vars.template_path] is not defined %}
                                                {{ parent() }}
                                            {% else %}
                                                {% set viewName = embed.customForms[data.form.vars.template_path] | first %}
                                                {% set moduleName = embed.customForms[data.form.vars.template_path] | last %}
                                                {% include view(viewName, moduleName) ignore missing with {
                                                    form: data.form.parent
                                                } only %}
                                            {% endif %}
                                        </div>
                                    </div>
                                {% endblock %}
                            {% endembed %}
                        </li>
                    {% endfor %}
                </ul>
            {% endfor %}
        {% endblock %}
    {% endembed %}
{% endblock %}

src/Pyz/Yves/Twig/TwigConfig.php

 protected function addCoreTemplatePaths(array $paths)
{
 ...
 $paths[] = APPLICATION_VENDOR_DIR . '/spryker-eco/%1$s/src/SprykerEco/Yves/%1$s/Theme/' . $themeName;

 return $paths;
}