| title | description | last_updated | template | originalLink | originalArticleId | redirect_from | related | |||||||||||||||||||||||||||||||||||||||||||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
Integrating Heidelpay |
This article contains information on integrating the Heidelpay module into the Spryker Commerce OS. |
August 2, 2022 |
concept-topic-template |
05ad4c88-a849-4d74-bdb3-898ab0b4e74a |
|
|
{% info_block errorBox %}
Heidelpay is not compatible with gift cards. We are working on a solution.
{% endinfo_block %}
To integrate Heidelpay, follow the steps below:
- 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;
}- Add route provider plugin:
\Pyz\Yves\Router\RouterDependencyProvider
protected function getRouteProvider(): array
{
return [
...
new HeidelpayRouteProviderPlugin(),
];
}- 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(),
];
}- 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;
}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
...
{% raw %}{%{% endraw %} 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'],
},
} {% raw %}%}{% endraw %}
{% raw %}{%{% endraw %} block content {% raw %}%}{% endraw %}
{% raw %}{%{% endraw %} 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 {% raw %}%}{% endraw %}
{% raw %}{%{% endraw %} block errors {% raw %}%}{% endraw %}
{% raw %}{{{% endraw %} parent() {% raw %}}}{% endraw %}
{% raw %}{{{% endraw %} form_errors(data.form.paymentSelection) {% raw %}}}{% endraw %}
{% raw %}{%{% endraw %} endblock {% raw %}%}{% endraw %}
{% raw %}{%{% endraw %} block fieldset {% raw %}%}{% endraw %}
{% raw %}{%{% endraw %} for name, choices in data.form.paymentSelection.vars.choices %}
{% raw %}{%{% endraw %} set paymentProviderIndex = loop.index0 {% raw %}%}{% endraw %}
<h5>{% raw %}{{{% endraw %} name | trans {% raw %}}}{% endraw %}</h5>
<ul>
{% raw %}{%{% endraw %} for key, choice in choices {% raw %}%}{% endraw %}
<li class="list__item spacing-y clear">
{% raw %}{%{% endraw %} 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 {% raw %}%}{% endraw %}
{% raw %}{%{% endraw %} block fieldset {% raw %}%}{% endraw %}
{% raw %}{{{% endraw %} form_row(embed.toggler, {
required: false,
component: molecule('toggler-radio'),
attributes: {
'target-class-name': 'js-payment-method-' ~ embed.index,
}
}) {% raw %}}}{% endraw %}
<div class="col col--sm-12 is-hidden js-payment-method-{{embed.index}}">
<div class="col col--sm-12 col--md-6">
{% raw %}{%{% endraw %} if embed.customForms[data.form.vars.template_path] is not defined {% raw %}%}{% endraw %}
{% raw %}{{{% endraw %} parent() {% raw %}}}{% endraw %}
{% raw %}{%{% endraw %} else {% raw %}%}{% endraw %}
{% raw %}{%{% endraw %} set viewName = embed.customForms[data.form.vars.template_path] | first {% raw %}%}{% endraw %}
{% raw %}{%{% endraw %} set moduleName = embed.customForms[data.form.vars.template_path] | last {% raw %}%}{% endraw %}
{% raw %}{%{% endraw %} include view(viewName, moduleName) ignore missing with {
form: data.form.parent
} only %}
{% raw %}{%{% endraw %} endif {% raw %}%}{% endraw %}
</div>
</div>
{% raw %}{%{% endraw %} endblock {% raw %}%}{% endraw %}
{% raw %}{%{% endraw %} endembed {% raw %}%}{% endraw %}
</li>
{% raw %}{%{% endraw %} endfor {% raw %}%}{% endraw %}
</ul>
{% raw %}{%{% endraw %} endfor {% raw %}%}{% endraw %}
{% raw %}{%{% endraw %} endblock {% raw %}%}{% endraw %}
{% raw %}{%{% endraw %} endembed {% raw %}%}{% endraw %}
{% raw %}{%{% endraw %} endblock {% raw %}%}{% endraw %}
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;
}