NTR: some changes (#888)

- added loader to the button
- button cannot be triggered multiple times
- show PPE only if added to saleschannel
- add error after failed payment

Co-authored-by: Vitalij Mik <vitalij.mik@dasistweb.de>

src/Components/PaypalExpress/PayPalExpress.php

@@ -97,7 +97,7 @@ public function isPaypalExpressEnabled(SalesChannelContext $context): bool
      */
     public function getActivePaypalExpressID(SalesChannelContext $context): string
     {
-        return $this->repoPaymentMethods->getActivePaypalExpressID($context->getContext());
+        return $this->repoPaymentMethods->getActivePaypalExpressID($context);
     }
 
 

src/Components/PaypalExpress/Route/FinishCheckoutRoute.php

@@ -119,6 +119,9 @@ public function finishCheckout(SalesChannelContext $context): FinishCheckoutResp
             );
         }
 
+        # create new account or find existing and login
+        $this->paypalExpress->prepareCustomer($shippingAddress, $context, $acceptedDataProtection, $billingAddress);
+
         # we have to update the cart extension before a new user is created and logged in, otherwise the extension is not saved
         $cartExtension = new ArrayStruct([
             CustomFieldsInterface::PAYPAL_EXPRESS_AUTHENTICATE_ID => $payPalExpressSession->authenticationId
@@ -130,8 +133,6 @@ public function finishCheckout(SalesChannelContext $context): FinishCheckoutResp
         $this->cartService->persistCart($cart, $context);
 
 
-        # create new account or find existing and login
-        $this->paypalExpress->prepareCustomer($shippingAddress, $context, $acceptedDataProtection, $billingAddress);
         return new FinishCheckoutResponse($payPalExpressSession->id, $payPalExpressSession->authenticationId);
     }
 }

src/Controller/Storefront/PaypalExpress/PaypalExpressControllerBase.php

@@ -18,7 +18,7 @@
 class PaypalExpressControllerBase extends StorefrontController
 {
     use RedirectTrait;
-
+    private const SNIPPET_ERROR = 'molliePayments.payments.paypalExpress.paymentError';
     /**
      * @var RouterInterface
      */
@@ -67,6 +67,7 @@ public function startCheckout(Request $request, SalesChannelContext $context): R
                 $redirectUrl = $responseRedirectUrl;
             }
         } catch (\Throwable $e) {
+            $this->addFlash('danger', $this->trans(self::SNIPPET_ERROR));
             $this->logger->error(
                 'Failed to start Paypal Express checkout',
                 ['message' => $e->getMessage()]
@@ -82,6 +83,7 @@ public function cancelCheckout(SalesChannelContext $context): Response
         try {
             $this->cancelCheckoutRoute->cancelCheckout($context);
         } catch (\Throwable $e) {
+            $this->addFlash('danger', $this->trans(self::SNIPPET_ERROR));
             $this->logger->error(
                 'Failed to cancel Paypal Express checkout',
                 ['message' => $e->getMessage()]
@@ -102,6 +104,7 @@ public function finishCheckout(SalesChannelContext $context): Response
             $returnUrl = $this->getCheckoutConfirmPage($this->router);
         } catch (\Throwable $e) {
             $returnUrl = $this->getCheckoutCartPage($this->router);
+            $this->addFlash('danger', $this->trans(self::SNIPPET_ERROR));
             $this->logger->error(
                 'Failed to finish Paypal Express Checkout',
                 ['message' => $e->getMessage()]

src/Repository/PaymentMethod/PaymentMethodRepository.php

@@ -11,6 +11,7 @@
 use Shopware\Core\Framework\DataAbstractionLayer\Search\EntitySearchResult;
 use Shopware\Core\Framework\DataAbstractionLayer\Search\Filter\EqualsFilter;
 use Shopware\Core\Framework\DataAbstractionLayer\Search\IdSearchResult;
+use Shopware\Core\System\SalesChannel\SalesChannelContext;
 
 class PaymentMethodRepository implements PaymentMethodRepositoryInterface
 {
@@ -80,18 +81,20 @@ public function getActiveApplePayID(Context $context): string
     }
 
     /**
-     * @param Context $context
+     * @param SalesChannelContext $context
      * @throws \Exception
      * @return string
      */
-    public function getActivePaypalExpressID(Context $context): string
+    public function getActivePaypalExpressID(SalesChannelContext $context): string
     {
         $criteria = new Criteria();
+        $criteria->addAssociation('salesChannels');
         $criteria->addFilter(new EqualsFilter('handlerIdentifier', PayPalExpressPayment::class));
         $criteria->addFilter(new EqualsFilter('active', true));
+        $criteria->addFilter(new EqualsFilter('salesChannels.id', $context->getSalesChannelId()));
 
         /** @var array<string> $paymentMethods */
-        $paymentMethods = $this->repoPaymentMethods->searchIds($criteria, $context)->getIds();
+        $paymentMethods = $this->repoPaymentMethods->searchIds($criteria, $context->getContext())->getIds();
 
         if (count($paymentMethods) <= 0) {
             throw new \Exception('Payment Method PayPal Express not found in system');

src/Repository/PaymentMethod/PaymentMethodRepositoryInterface.php

@@ -7,6 +7,7 @@
 use Shopware\Core\Framework\DataAbstractionLayer\Search\Criteria;
 use Shopware\Core\Framework\DataAbstractionLayer\Search\EntitySearchResult;
 use Shopware\Core\Framework\DataAbstractionLayer\Search\IdSearchResult;
+use Shopware\Core\System\SalesChannel\SalesChannelContext;
 
 interface PaymentMethodRepositoryInterface
 {
@@ -37,4 +38,10 @@ public function search(Criteria $criteria, Context $context): EntitySearchResult
      * @return string
      */
     public function getActiveApplePayID(Context $context): string;
+
+    /**
+     * @param SalesChannelContext $context
+     * @return string
+     */
+    public function getActivePaypalExpressID(SalesChannelContext $context): string;
 }

src/Resources/app/storefront/src/mollie-payments/plugins/apple-pay-direct.plugin.js

@@ -74,7 +74,7 @@ export default class MollieApplePayDirect extends Plugin {
         }
 
         const applePaySessionFactory = new ApplePaySessionFactory();
-        const session = applePaySessionFactory.create(isProductMode, countryCode, currency, withPhone, shopSlug, dataProtection);
+        const session = applePaySessionFactory.create(isProductMode, countryCode, currency, withPhone, shopSlug, dataProtection,clickedButton);
         session.begin();
 
     }

src/Resources/app/storefront/src/mollie-payments/plugins/mollie-express-actions.plugin.js

@@ -34,7 +34,6 @@ export class MollieExpressActions extends Plugin {
             }
 
 
-
             const buyButtonRepository = new BuyButtonRepository();
 
             expressButtons.forEach((button) => {
@@ -100,15 +99,14 @@ export class MollieExpressActions extends Plugin {
                 return;
             }
         }
-
+        target.classList.add('processed');
 
         const expressAddToCart = new ExpressAddToCart();
 
         expressAddToCart.addItemToCart(target);
 
-        target.classList.add('processed');
         const mollieEvent = new event.constructor(event.type, event);
         target.dispatchEvent(mollieEvent);
-        target.classList.remove('processed');
+
     }
 }

src/Resources/app/storefront/src/mollie-payments/services/ApplePaySessionFactory.js

@@ -19,9 +19,10 @@ export default class ApplePaySessionFactory {
      * @param shopSlug
      * @param withPhone
      * @param dataProtection
+     * @param clickedButton
      * @returns ApplePaySession
      */
-    create(isProductMode, country, currency, withPhone, shopSlug, dataProtection) {
+    create(isProductMode, country, currency, withPhone, shopSlug, dataProtection,clickedButton) {
 
         const me = this;
         var shippingFields = [
@@ -166,6 +167,7 @@ export default class ApplePaySessionFactory {
             // now finish our payment by filling a form
             // and submitting it along with our payment token
             me.finishPayment(shopSlug + '/mollie/apple-pay/start-payment', paymentToken, event.payment,dataProtectionValue);
+            clickedButton.classList.remove('processed');
         };
 
         session.oncancel = function () {
@@ -175,6 +177,7 @@ export default class ApplePaySessionFactory {
             if (isProductMode) {
                 me.client.post(shopSlug + '/mollie/apple-pay/restore-cart');
             }
+            clickedButton.classList.remove('processed');
         };
 
         return session;

src/Resources/app/storefront/src/scss/base.scss

@@ -5,4 +5,5 @@
 @import "./account/subscriptions";
 @import "./component/credit-card-mandate";
 @import "./component/paypal-express-button";
+@import "./component/express-button";
 @import "./display";

src/Resources/app/storefront/src/scss/component/express-button.scss

@@ -0,0 +1,16 @@
+.mollie-express-button.processed {
+
+
+  .loader {
+    display: block;
+    position:absolute;
+  }
+  *:not(.loader){
+    opacity:0.2;
+  }
+
+}
+
+.mollie-express-button .loader {
+  display: none;
+}

src/Resources/snippet/de_DE/mollie-payments.de-DE.json

@@ -63,6 +63,9 @@
                 "captionSubtotal": "Zwischensumme",
                 "captionTaxes": "Steuern",
                 "paymentError": "Die Zahlung mit Apple Pay ist fehlgeschlagen."
+            },
+            "paypalExpress": {
+                "paymentError": "Die Zahlung mit Paypal Express ist fehlgeschlagen."
             }
         },
         "subscriptions": {

src/Resources/snippet/en_GB/mollie-payments.en-GB.json

@@ -63,6 +63,9 @@
                 "captionSubtotal": "Subtotal",
                 "captionTaxes": "Taxes",
                 "paymentError": "The payment with Apple Pay failed."
+            },
+            "paypalExpress": {
+                "paymentError": "The payment with Paypal Express failed."
             }
         },
         "subscriptions": {

src/Resources/snippet/it_IT/mollie-payments.it-IT.json

@@ -63,6 +63,9 @@
         "captionSubtotal": "Subtotale",
         "captionTaxes": "Tasse",
         "paymentError": "Il pagamento con Apple Pay non è andato a buon fine."
+      },
+      "paypalExpress": {
+        "paymentError": "Il pagamento con Paypal Express non è andato a buon fine."
       }
     },
     "subscriptions": {

src/Resources/snippet/nl_NL/mollie-payments.nl-NL.json

@@ -63,7 +63,10 @@
                 "captionSubtotal": "Subtotaal",
                 "captionTaxes": "BTW",
                 "paymentError": "De betaling met Apple Pay is mislukt."
-            }
+            },
+          "paypalExpress": {
+            "paymentError": "De betaling met Paypal Express is mislukt."
+          }
         },
         "subscriptions": {
             "account": {

src/Resources/views/mollie/component/paypal-express-button.twig

@@ -35,6 +35,9 @@
         <button name="paypal-express" class="mollie-paypal-button mollie-express-button paypal-button-{{ shape }} paypal-theme-{{ theme }}" data-form-action="{{ path('frontend.mollie.paypal-express.start') }}">
             <img src="{{ image }}" width="80px;"/>
             <p style="font-weight: 100;margin:0;margin-left:8px">Checkout</p>
+            <div class="loader">
+
+            </div>
         </button>
     </div>
 {% endblock %}

tests/PHPUnit/Fakes/Repositories/FakePaymentMethodRepository.php

@@ -11,6 +11,7 @@
 use Shopware\Core\Framework\DataAbstractionLayer\Search\EntitySearchResult;
 use Shopware\Core\Framework\DataAbstractionLayer\Search\IdSearchResult;
 use Shopware\Core\Framework\Event\NestedEventCollection;
+use Shopware\Core\System\SalesChannel\SalesChannelContext;
 
 class FakePaymentMethodRepository implements PaymentMethodRepositoryInterface
 {
@@ -84,4 +85,10 @@ public function getActiveApplePayID(Context $context): string
     {
         return 'phpunit-id';
     }
+
+    public function getActivePaypalExpressID(SalesChannelContext $context): string
+    {
+        return 'phpunit-id';
+    }
+
 }