diff --git a/app/PaymentDrivers/CheckoutComPaymentDriver.php b/app/PaymentDrivers/CheckoutComPaymentDriver.php
index c238dd2d0f7a..a4366cdc8317 100644
--- a/app/PaymentDrivers/CheckoutComPaymentDriver.php
+++ b/app/PaymentDrivers/CheckoutComPaymentDriver.php
@@ -24,6 +24,7 @@ use App\PaymentDrivers\CheckoutCom\Utilities;
 use App\Utils\Traits\SystemLogTrait;
 use Checkout\CheckoutApi;
 use Checkout\Library\Exceptions\CheckoutHttpException;
+use Checkout\Models\Payments\IdSource;
 use Checkout\Models\Payments\Payment as CheckoutPayment;
 use Checkout\Models\Payments\TokenSource;
 
@@ -86,12 +87,6 @@ class CheckoutComPaymentDriver extends BasePaymentDriver
         $data['raw_value'] = $data['amount_with_fee'];
         $data['customer_email'] = $this->client->present()->email;
 
-        // dd($data['token']);
-
-        // if (isset($data['token'])) {
-        // $data['raw_token'] = $data['token'];
-        // }
-
         return render($this->viewForType($data['payment_method_id']), $data);
     }
 
@@ -107,21 +102,21 @@ class CheckoutComPaymentDriver extends BasePaymentDriver
         ];
 
         $state = array_merge($state, $request->all());
+        $state['store_card'] = boolval($state['store_card']);
 
-        $method = new TokenSource($state['server_response']->cardToken);
+        if ($request->has('token') && !is_null($request->token)) {
+            $method = new IdSource($state['token']);
+            $payment = new CheckoutPayment($method, $state['currency']);
+            $payment->capture = false;
+            $payment->amount = $state['value'];
+        } else {
+            $method = new TokenSource($state['server_response']->cardToken);
+            $payment = new CheckoutPayment($method, $state['currency']);
+            $payment->amount = $state['value'];
 
-        $payment = new CheckoutPayment($method, $state['currency']);
-        $payment->amount = $state['value'];
-
-        // We need a proper logic to test if this is first payment with Checkout.
-        // Pseudo: if ($this->client->payments()->where('gateway_id', PaymentType::TYPE_CHECKOUT)->count() == 0)
-
-        $first_payment = true;
-
-        if ($first_payment && $this->client->currency()->code === 'EUR') {
-            $payment->{"3ds"} = [
-                'enabled' => true,
-            ];
+            if ($this->client->currency()->code === 'EUR') {
+                $payment->{"3ds"} = ['enabled' => true];
+            }
         }
 
         try {
@@ -154,7 +149,7 @@ class CheckoutComPaymentDriver extends BasePaymentDriver
 
         $data = [
             'payment_method' => $state['charge_id'],
-            'payment_type' => PaymentType::parseCardType($state['server_response']->card->paymentMethod),
+            'payment_type' => PaymentType::parseCardType($state['payment_response']->source['scheme']),
             'amount' => $state['raw_value'],
         ];
 
@@ -186,7 +181,7 @@ class CheckoutComPaymentDriver extends BasePaymentDriver
 
         $data = [
             'payment_method' => $state['charge_id'],
-            'payment_type' => PaymentType::parseCardType($state['server_response']->card->paymentMethod),
+            'payment_type' => PaymentType::parseCardType($state['payment_response']->source['scheme']),
             'amount' => $state['raw_value'],
         ];
 
diff --git a/public/js/clients/payments/checkout.com.js b/public/js/clients/payments/checkout.com.js
index bffb639fc0c5..1c60412ea943 100644
--- a/public/js/clients/payments/checkout.com.js
+++ b/public/js/clients/payments/checkout.com.js
@@ -1,2 +1,2 @@
 /*! For license information please see checkout.com.js.LICENSE.txt */
-!function(e){var t={};function n(r){if(t[r])return t[r].exports;var o=t[r]={i:r,l:!1,exports:{}};return e[r].call(o.exports,o,o.exports,n),o.l=!0,o.exports}n.m=e,n.c=t,n.d=function(e,t,r){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(n.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)n.d(r,o,function(t){return e[t]}.bind(null,o));return r},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="/",n(n.s=8)}({8:function(e,t,n){e.exports=n("XYrq")},XYrq:function(e,t){window.CKOConfig={publicKey:document.querySelector('meta[name="public-key"]').content,customerEmail:document.querySelector('meta[name="customer-email"]').content,value:document.querySelector('meta[name="value"]').content,currency:document.querySelector('meta[name="currency"]').content,paymentMode:"cards",cardFormMode:"cardTokenisation",cardTokenised:function(e){document.querySelector('input[name="gateway_response"]').value=JSON.stringify(e.data),document.querySelector('input[name="store_card"]').value=document.getElementById("store-card-checkbox").checked,document.getElementById("server-response").submit()}}}});
\ No newline at end of file
+!function(e){var t={};function n(r){if(t[r])return t[r].exports;var o=t[r]={i:r,l:!1,exports:{}};return e[r].call(o.exports,o,o.exports,n),o.l=!0,o.exports}n.m=e,n.c=t,n.d=function(e,t,r){n.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},n.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},n.t=function(e,t){if(1&t&&(e=n(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(n.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)n.d(r,o,function(t){return e[t]}.bind(null,o));return r},n.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return n.d(t,"a",t),t},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.p="/",n(n.s=8)}({8:function(e,t,n){e.exports=n("XYrq")},XYrq:function(e,t){window.CKOConfig={publicKey:document.querySelector('meta[name="public-key"]').content,customerEmail:document.querySelector('meta[name="customer-email"]').content,value:document.querySelector('meta[name="value"]').content,currency:document.querySelector('meta[name="currency"]').content,paymentMode:"cards",cardFormMode:"cardTokenisation",cardTokenised:function(e){document.querySelector('input[name="gateway_response"]').value=JSON.stringify(e.data),document.querySelector('input[name="store_card"]').value=document.getElementById("store-card-checkbox").checked?1:0,document.getElementById("server-response").submit()}}}});
\ No newline at end of file
diff --git a/public/mix-manifest.json b/public/mix-manifest.json
index 46f2984345b8..c4d669134919 100644
--- a/public/mix-manifest.json
+++ b/public/mix-manifest.json
@@ -7,7 +7,7 @@
     "/js/clients/payment_methods/authorize-authorize-card.js": "/js/clients/payment_methods/authorize-authorize-card.js?id=b0a1bd21a57e12cd491a",
     "/js/clients/payment_methods/authorize-stripe-card.js": "/js/clients/payment_methods/authorize-stripe-card.js?id=f4c45f0da9868d840799",
     "/js/clients/payments/alipay.js": "/js/clients/payments/alipay.js?id=04778cbf46488e8f6b5f",
-    "/js/clients/payments/checkout.com.js": "/js/clients/payments/checkout.com.js?id=ad0a824fb0f79cb8200b",
+    "/js/clients/payments/checkout.com.js": "/js/clients/payments/checkout.com.js?id=591618c8bcd926b7111d",
     "/js/clients/payments/process.js": "/js/clients/payments/process.js?id=be2b10b1b5e3a727f6e2",
     "/js/clients/payments/sofort.js": "/js/clients/payments/sofort.js?id=f9253aea74535bc46886",
     "/js/clients/quotes/action-selectors.js": "/js/clients/quotes/action-selectors.js?id=88ff76c9ca1c15fc011b",
diff --git a/resources/js/clients/payments/checkout.com.js b/resources/js/clients/payments/checkout.com.js
index f1fe540445ce..1d4d4de59002 100644
--- a/resources/js/clients/payments/checkout.com.js
+++ b/resources/js/clients/payments/checkout.com.js
@@ -23,7 +23,7 @@ window.CKOConfig = {
 
         document.querySelector(
             'input[name="store_card"]'
-        ).value = document.getElementById('store-card-checkbox').checked;
+        ).value = document.getElementById('store-card-checkbox').checked ? 1 : 0;
         
         document.getElementById('server-response').submit();
     },
diff --git a/resources/views/portal/ninja2020/gateways/checkout/credit_card.blade.php b/resources/views/portal/ninja2020/gateways/checkout/credit_card.blade.php
index ff6384a99f34..f0e231388885 100644
--- a/resources/views/portal/ninja2020/gateways/checkout/credit_card.blade.php
+++ b/resources/views/portal/ninja2020/gateways/checkout/credit_card.blade.php
@@ -23,6 +23,9 @@
         <input type="hidden" name="value" value="{{ $value }}">
         <input type="hidden" name="raw_value" value="{{ $raw_value }}">
         <input type="hidden" name="currency" value="{{ $currency }}">
+        @isset($token)
+            <input type="hidden" name="token" value="{{ $token->meta->id }}">
+        @endisset
     </form>
 
     <div class="container mx-auto">
@@ -54,23 +57,39 @@
                             <span class="font-bold">{{ App\Utils\Number::formatMoney($amount, $client) }}</span>
                         </dd>
                     </div>
-                    <div class="bg-gray-50 px-4 py-5 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-6 flex items-center">
-                        <dt class="text-sm leading-5 font-medium text-gray-500 mr-4">
-                            {{ ctrans('texts.token_billing_checkbox') }}
-                        </dt>
-                        <dd class="mt-1 text-sm leading-5 text-gray-900 sm:mt-0 sm:col-span-2">
-                            <input type="checkbox" id="store-card-checkbox" class="form-checkbox">
-                        </dd>
-                    </div>
-                    <div class="bg-white px-4 py-5 flex justify-end">
-                        <form class="payment-form" method="POST" action="https://merchant.com/successUrl">
-                            @if(app()->environment() == 'production')
-                                <script async src="https://cdn.checkout.com/js/checkout.js"></script>
-                            @else
-                                <script async src="https://cdn.checkout.com/sandbox/js/checkout.js"></script>
-                            @endif
-                        </form>
-                    </div>
+                    @isset($token)
+                        <div class="bg-gray-50 px-4 py-5 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-6">
+                            <dt class="text-sm leading-5 font-medium text-gray-500">
+                                {{ ctrans('texts.card_number') }}
+                            </dt>
+                            <dd class="mt-1 text-sm leading-5 text-gray-900 sm:mt-0 sm:col-span-2">
+                                **** {{ ucfirst($token->meta->last4) }}
+                            </dd>
+                        </div>
+                        <div class="bg-white px-4 py-5 flex justify-end">
+                            <button class="button button-primary" onclick="document.getElementById('server-response').submit()">
+                                {{ ctrans('texts.pay_now') }}
+                            </button>
+                        </div>
+                    @else
+                        <div class="bg-gray-50 px-4 py-5 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-6 flex items-center">
+                            <dt class="text-sm leading-5 font-medium text-gray-500 mr-4">
+                                {{ ctrans('texts.token_billing_checkbox') }}
+                            </dt>
+                            <dd class="mt-1 text-sm leading-5 text-gray-900 sm:mt-0 sm:col-span-2">
+                                <input type="checkbox" id="store-card-checkbox" class="form-checkbox">
+                            </dd>
+                        </div>
+                        <div class="bg-white px-4 py-5 flex justify-end">
+                            <form class="payment-form" method="POST" action="https://merchant.com/successUrl">
+                                @if(app()->environment() == 'production')
+                                    <script async src="https://cdn.checkout.com/js/checkout.js"></script>
+                                @else
+                                    <script async src="https://cdn.checkout.com/sandbox/js/checkout.js"></script>
+                                @endif
+                            </form>
+                        </div>
+                    @endisset
                 </div>
             </div>
         </div>