Apple Pay hidden by default, unless enabled in browser

rvvup · Oct 28, 2024 · 78c6526 · 78c6526
1 parent dbbda79
commit 78c6526
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 19 deletions.
diff --git a/src/view/frontend/templates/component/payment/apple-pay-processor.phtml b/src/view/frontend/templates/component/payment/apple-pay-processor.phtml
@@ -7,6 +7,11 @@ use Magento\Framework\Escaper;
 /** @var Template $block */
 /** @var Escaper $escaper */
 ?>
+<style>
+    #payment-method-option-rvvup_APPLE_PAY {
+        display: none;
+    }
+</style>
 <div wire:ignore>
 <script>
     (() => {
@@ -26,6 +31,13 @@ use Magento\Framework\Escaper;
                 }
             }, document.querySelector('[wire\\:key="rvvup_APPLE_PAY"].active'));
         });
+        window.addEventListener('checkout:step:loaded', () => {
+            let applePay = document.getElementById('payment-method-option-rvvup_APPLE_PAY');
+            if (applePay && window.ApplePaySession && window.ApplePaySession.canMakePayments()) {
+                applePay.style.display = 'block';
+            }
+        }, {once: false})
+
     })();
 </script>
 </div>
diff --git a/src/view/frontend/templates/component/payment/method-list.phtml b/src/view/frontend/templates/component/payment/method-list.phtml
@@ -31,25 +31,6 @@ $methods = $viewModel->getList();
             }, { once: true })
         </script>
 
-        <script>
-            window.addEventListener('checkout:payment:method-activate', () => {
-                disableApplePayForIncompatibleBrowsers();
-            }, { once: false })
-            window.addEventListener('checkout:shipping:method-activate', () => {
-                disableApplePayForIncompatibleBrowsers();
-            }, { once: false })
-            window.addEventListener('checkout:step:loaded', () => {
-                disableApplePayForIncompatibleBrowsers();
-            }, { once: false})
-
-            function disableApplePayForIncompatibleBrowsers() {
-                let applePay = document.getElementById('payment-method-option-rvvup_APPLE_PAY');
-                if (applePay && !window.ApplePaySession) {
-                    applePay.remove();
-                }
-            }
-        </script>
-
         <ol id="payment-method-list" class="space-y-4">
             <?php foreach ($methods as $method): ?>
                 <?php $methodCodeAttr = $escaper->escapeHtmlAttr($method->getCode()) ?>