diff --git a/Api/TpayInterface.php b/Api/TpayInterface.php
index f0bc35e..21cb7ec 100644
--- a/Api/TpayInterface.php
+++ b/Api/TpayInterface.php
@@ -10,7 +10,8 @@
 interface TpayInterface
 {
     public const CODE = 'tpaycom_magento2basic';
-    public const CHANNEL = 'group';
+    public const GROUP = 'group';
+    public const CHANNEL = 'channel';
     public const BLIK_CODE = 'blik_code';
     public const TERMS_ACCEPT = 'accept_tos';
     public const CARDDATA = 'card_data';
diff --git a/Controller/tpay/Create.php b/Controller/tpay/Create.php
index 3507169..3e5963b 100644
--- a/Controller/tpay/Create.php
+++ b/Controller/tpay/Create.php
@@ -79,7 +79,7 @@ public function execute()
             $paymentData['additional_information']['transaction_url'] = $transactionUrl;
             $payment->setData($paymentData)->save();
 
-            if (6 === strlen($additionalPaymentInformation['blik_code']) && $this->tpay->checkBlikLevel0Settings()) {
+            if (6 === strlen($additionalPaymentInformation['blik_code'] ?? '') && $this->tpay->checkBlikLevel0Settings()) {
                 if (true === $this->transaction->isOpenApiUse()) {
                     return $this->_redirect('magento2basic/tpay/success');
                 }
@@ -119,11 +119,11 @@ private function prepareTransaction($orderId, array $additionalPaymentInformatio
     {
         $data = $this->tpay->getTpayFormData($orderId);
 
-        if (6 === strlen($additionalPaymentInformation['blik_code'])) {
+        if (6 === strlen($additionalPaymentInformation['blik_code'] ?? '')) {
             $data['group'] = TransactionOriginApi::BLIK_CHANNEL;
             $this->handleBlikData($data, $additionalPaymentInformation['blik_code']);
         } else {
-            $data['group'] = (int) $additionalPaymentInformation['group'];
+            $data['group'] = (int) ($additionalPaymentInformation['group'] ?? null);
             $data['channel'] = (int) ($additionalPaymentInformation['channel'] ?? null);
 
             if ($this->tpay->redirectToChannel()) {
diff --git a/Controller/tpay/Redirect.php b/Controller/tpay/Redirect.php
index 36c6871..d1f3ba4 100644
--- a/Controller/tpay/Redirect.php
+++ b/Controller/tpay/Redirect.php
@@ -30,9 +30,11 @@ public function execute()
     {
         $uid = $this->getRequest()->getParam('uid');
         $orderId = $this->checkoutSession->getLastRealOrderId();
+
         if (!$orderId || !$uid) {
             return $this->_redirect('checkout/cart');
         }
+
         $payment = $this->tpayService->getPayment($orderId);
         $paymentData = $payment->getData();
         $additionalPaymentInfo = $paymentData['additional_information'];
@@ -41,7 +43,9 @@ public function execute()
             return $this->_redirect('magento2basic/tpay/CardPayment');
         }
 
-        if ((!array_key_exists(TpayInterface::CHANNEL, $additionalPaymentInfo) || (int) $additionalPaymentInfo[TpayInterface::CHANNEL] < 1) && (!array_key_exists(TpayInterface::BLIK_CODE, $additionalPaymentInfo) || 6 !== strlen($additionalPaymentInfo[TpayInterface::BLIK_CODE]))) {
+
+
+        if (empty(array_intersect(array_keys($additionalPaymentInfo), [TpayInterface::GROUP, TpayInterface::CHANNEL])) && (!array_key_exists(TpayInterface::BLIK_CODE, $additionalPaymentInfo) || 6 !== strlen($additionalPaymentInfo[TpayInterface::BLIK_CODE]))) {
             return $this->_redirect('checkout/cart');
         }
         $this->tpayService->setOrderStatePendingPayment($orderId, true);
diff --git a/Model/ApiFacade/OpenApi.php b/Model/ApiFacade/OpenApi.php
index 48b2884..db42742 100755
--- a/Model/ApiFacade/OpenApi.php
+++ b/Model/ApiFacade/OpenApi.php
@@ -62,11 +62,11 @@ private function handleDataStructure(array $data): array
             ];
         }
 
-        if (isset($data['group'])) {
+        if ($data['group']) {
             $paymentData['pay'] = ['groupId' => $data['group']];
         }
 
-        if (isset($data['channel'])) {
+        if ($data['channel']) {
             $paymentData['pay'] = ['channelId' => $data['channel']];
         }
 
diff --git a/Model/ApiFacade/TpayConfig/ConfigFacade.php b/Model/ApiFacade/TpayConfig/ConfigFacade.php
index 686cf9e..b92d5a9 100755
--- a/Model/ApiFacade/TpayConfig/ConfigFacade.php
+++ b/Model/ApiFacade/TpayConfig/ConfigFacade.php
@@ -17,6 +17,10 @@ class ConfigFacade
 
     /** @var bool */
     private $useOpenApi;
+    /**
+     * @var TpayInterface
+     */
+    private $tpay;
 
     public function __construct(TpayInterface $tpay, Repository $assetRepository, TpayTokensService $tokensService)
     {
diff --git a/Model/ApiFacade/TpayConfig/ConfigOpen.php b/Model/ApiFacade/TpayConfig/ConfigOpen.php
index 68e0c88..155fd34 100755
--- a/Model/ApiFacade/TpayConfig/ConfigOpen.php
+++ b/Model/ApiFacade/TpayConfig/ConfigOpen.php
@@ -47,7 +47,7 @@ public function getConfig(): array
         ];
         $config = array_merge($config, $this->getCardConfig());
 
-        return $this->tpay->isAvailable() ? $config : [];
+        return $config;
     }
 
     public function generateURL(string $name): string
diff --git a/Model/ApiFacade/Transaction/TransactionApiFacade.php b/Model/ApiFacade/Transaction/TransactionApiFacade.php
index 4aac618..5c3114b 100755
--- a/Model/ApiFacade/Transaction/TransactionApiFacade.php
+++ b/Model/ApiFacade/Transaction/TransactionApiFacade.php
@@ -4,6 +4,7 @@
 
 use Exception;
 use Magento\Framework\App\CacheInterface;
+use Tpay\OpenApi\Utilities\TpayException;
 use tpaycom\magento2basic\Api\TpayInterface;
 use tpaycom\magento2basic\Model\ApiFacade\OpenApi;
 
diff --git a/Model/GenericOnSiteConfigProvider.php b/Model/GenericOnSiteConfigProvider.php
index 4c2bef0..89bae51 100644
--- a/Model/GenericOnSiteConfigProvider.php
+++ b/Model/GenericOnSiteConfigProvider.php
@@ -23,13 +23,15 @@ public function __construct(
         Repository $assetRepository,
         MethodList $methods,
         ScopeConfigInterface $scopeConfig,
-        TransactionApiFacade $transactionApiFacade
+        TransactionApiFacade $transactionApiFacade,
+        TpayConfigProvider $tpayConfigProvider
     ) {
         $this->paymentHelper = $paymentHelper;
         $this->assetRepository = $assetRepository;
         $this->methodList = $methods;
         $this->scopeConfig = $scopeConfig;
         $this->transactionApiFacade = $transactionApiFacade;
+        $this->tpayConfigProvider = $tpayConfigProvider;
     }
 
     /**
@@ -40,22 +42,7 @@ public function getConfig()
         $tpay = $this->getPaymentMethodInstance();
         $onsites = explode(',', $this->scopeConfig->getValue('payment/tpaycom_magento2basic/onsite_channels', ScopeInterface::SCOPE_STORE));
 
-        $config = [
-            'tpay' => [
-                'payment' => [
-                    'redirectUrl' => $tpay->getPaymentRedirectUrl(),
-                    'tpayLogoUrl' => $this->generateURL('tpaycom_magento2basic::images/logo_tpay.png'),
-                    'merchantId' => $tpay->getMerchantId(),
-                    'showPaymentChannels' => $this->showChannels(),
-                    'getTerms' => $this->getTerms(),
-                    'addCSS' => $this->createCSS('tpaycom_magento2basic::css/tpay.css'),
-                    'blikStatus' => $this->getPaymentMethodInstance()->checkBlikLevel0Settings(),
-                    'onlyOnlineChannels' => $this->getPaymentMethodInstance()->onlyOnlineChannels(),
-                    'getBlikChannelID' => TransactionOriginApi::BLIK_CHANNEL,
-                    'isInstallmentsAmountValid' => $this->getPaymentMethodInstance()->getInstallmentsAmountValid(),
-                ],
-            ],
-        ];
+        $config = $this->tpayConfigProvider->getConfig();
 
         $channels = $this->transactionApiFacade->channels();
 
diff --git a/Model/Tpay.php b/Model/Tpay.php
index 7687ac7..4af2d7e 100755
--- a/Model/Tpay.php
+++ b/Model/Tpay.php
@@ -271,7 +271,7 @@ public function assignData(DataObject $data)
         $additionalData = $data->getData('additional_data');
         $info = $this->getInfoInstance();
 
-        $info->setAdditionalInformation(static::CHANNEL, array_key_exists(static::CHANNEL, $additionalData) ? $additionalData[static::CHANNEL] : '');
+        $info->setAdditionalInformation(static::GROUP, array_key_exists(static::GROUP, $additionalData) ? $additionalData[static::GROUP] : '');
 
         $info->setAdditionalInformation(static::BLIK_CODE, array_key_exists(static::BLIK_CODE, $additionalData) ? $additionalData[static::BLIK_CODE] : '');
 
diff --git a/etc/payment.xml b/etc/payment.xml
index 701b0d0..d0d4023 100644
--- a/etc/payment.xml
+++ b/etc/payment.xml
@@ -13,6 +13,9 @@
         <method name="tpaycom_magento2basic">
             <allow_multiple_address>1</allow_multiple_address>
         </method>
+        <method name="tpaycom_magento2basic_cards">
+            <allow_multiple_address>1</allow_multiple_address>
+        </method>
         <method name="generic">
             <allow_multiple_address>1</allow_multiple_address>
         </method>
diff --git a/view/frontend/web/js/view/payment/method-renderer/tpay-card-method.js b/view/frontend/web/js/view/payment/method-renderer/tpay-card-method.js
new file mode 100644
index 0000000..c0dfd73
--- /dev/null
+++ b/view/frontend/web/js/view/payment/method-renderer/tpay-card-method.js
@@ -0,0 +1,106 @@
+/**
+ *
+ * @category    payment gateway
+ * @package     Tpaycom_Magento2.3
+ * @author      Tpay.com
+ * @copyright   (https://tpay.com)
+ */
+define(
+    [
+        'Magento_Checkout/js/view/payment/default',
+        'jquery',
+        'Magento_Checkout/js/model/totals'
+    ],
+    function (Component, $) {
+        'use strict';
+
+        return Component.extend({
+            defaults: {
+                template: 'tpaycom_magento2basic/payment/card-tpay-form'
+            },
+
+            redirectAfterPlaceOrder: false,
+
+            getCode: function () {
+                return 'tpaycom_magento2basic_cards';
+            },
+
+            afterPlaceOrder: function () {
+                $("#card_number").val('');
+                $("#cvc").val('');
+                $("#expiry_date").val('');
+                $("#loading_scr").fadeIn();
+                window.location.replace(window.checkoutConfig.tpay.payment.redirectUrl);
+            },
+
+            showPaymentChannels: function () {
+                return window.checkoutConfig.tpay.payment.showPaymentChannels;
+            },
+
+            getTerms: function () {
+                return window.checkoutConfig.tpay.payment.getTerms;
+            },
+
+            getLogoUrl: function () {
+                return window.checkoutConfig.tpay.payment.tpayLogoUrl;
+            },
+
+            blikStatus: function () {
+                return window.checkoutConfig.tpay.payment.blikStatus;
+            },
+
+            addCSS: function () {
+                return window.checkoutConfig.tpay.payment.addCSS;
+            },
+
+            cardFetchJavaScripts: function () {
+                return window.checkoutConfig.tpaycards.payment.fetchJavaScripts;
+            },
+            cardGetRSAkey: function () {
+                return window.checkoutConfig.tpaycards.payment.getRSAkey;
+            },
+            cardGetLogoUrl: function () {
+                return window.checkoutConfig.tpaycards.payment.tpayLogoUrl;
+            },
+            cardGetTpayLoadingGif: function () {
+                return window.checkoutConfig.tpaycards.payment.getTpayLoadingGif;
+            },
+            cardAddCSS: function () {
+                return window.checkoutConfig.tpaycards.payment.addCSS;
+            },
+
+            cardShowSaveBox: function () {
+                if (window.checkoutConfig.tpaycards.payment.isCustomerLoggedIn
+                    && window.checkoutConfig.tpaycards.payment.isSavingEnabled) {
+                    $('#tpay-card-save-checkbox').css('display', 'block');
+                }
+            },
+
+            getData: function () {
+                var savedId = 'new';
+                $('input[id^=cardN]').each(function () {
+                    if ($(this).is(":checked")) {
+                        savedId = $(this).val();
+                    }
+                });
+                var parent = this._super(),
+                    paymentData = {};
+                paymentData['group'] = $('#tpay-channel-input').val();
+                paymentData['blik_code'] = $('#blik_code').val();
+                paymentData['accept_tos'] = $('#accept_tos').is(':checked');
+
+                paymentData['card_data'] = $('input[name="card_data"]').val();
+                paymentData['card_save'] = $('input[name="card_save"]').is(":checked");
+                paymentData['card_id'] = savedId;
+                paymentData['card_vendor'] = $('input[name="card_vendor"]').val();
+                paymentData['short_code'] = $('input[name="card_short_code"]').val();
+
+                return $.extend(true, parent, {'additional_data': paymentData});
+            },
+
+            isActive: function () {
+                return true;
+            },
+        });
+    }
+);
diff --git a/view/frontend/web/js/view/payment/tpay-payments.js b/view/frontend/web/js/view/payment/tpay-payments.js
index c917960..6f463c4 100644
--- a/view/frontend/web/js/view/payment/tpay-payments.js
+++ b/view/frontend/web/js/view/payment/tpay-payments.js
@@ -23,6 +23,9 @@ define(
 
          Object.values(window.checkoutConfig.generic).forEach((element) => rendererList.push({type: `generic-${element.id}`, component: 'tpaycom_magento2basic/js/view/payment/method-renderer/tpay-generic-onsite'}))
 
+
+        rendererList.push({type: 'tpaycom_magento2basic_cards', component: 'tpaycom_magento2basic/js/view/payment/method-renderer/tpay-card-method'});
+
         /** Add view logic here if needed */
         return Component.extend({});
     }
diff --git a/view/frontend/web/template/payment/card-tpay-form.html b/view/frontend/web/template/payment/card-tpay-form.html
index 4c4ab06..dbfbdbb 100644
--- a/view/frontend/web/template/payment/card-tpay-form.html
+++ b/view/frontend/web/template/payment/card-tpay-form.html
@@ -1,16 +1,16 @@
 
-<div class="card_payment-method" data-bind="css: {'_active': (getCode() == isChecked())}">
+<div class="payment-method" data-bind="css: {'_active': (getCode() == isChecked())}">
     <div class="card_payment-method-title field choice">
         <input type="radio"
                name="payment[card]"
                class="radio"
                data-bind="attr: {'id': getCode()}, value: getCode(), checked: isChecked, click: selectPaymentMethod, visible: isRadioButtonVisible()"/>
         <label data-bind="attr: {'for': getCode()}" class="label">
-            <img data-bind="attr: {src: cardGetLogoUrl(), alt: $t('tpay.com')}" class="payment-icon"/>
+<!--            <img data-bind="attr: {src: cardGetLogoUrl(), alt: $t('tpay.com')}" class="payment-icon"/>-->
             <span data-bind="text: getTitle()"></span>
         </label>
     </div>
-    <div class="card_payment-method-content" id="card_payment_form">
+    <div class="payment-method-content" id="card_payment_form">
         <div class="card_insidebg">
             <div class="tpay-header-wrapper">
                 <div class="tpay-header-logo">
diff --git a/view/frontend/web/template/payment/tpay-form.html b/view/frontend/web/template/payment/tpay-form.html
index d482a68..d9637bf 100644
--- a/view/frontend/web/template/payment/tpay-form.html
+++ b/view/frontend/web/template/payment/tpay-form.html
@@ -104,156 +104,3 @@
         </div>
     </div>
 </div>
-
-
-
-
-<div class="card_payment-method" data-bind="css: {'_active': (getCode() == isChecked())}">
-    <div class="card_payment-method-title field choice">
-        <input type="radio"
-               name="payment[card]"
-               class="radio"
-               data-bind="attr: {'id': getCode()}, value: getCode(), checked: isChecked, click: selectPaymentMethod, visible: isRadioButtonVisible()"/>
-        <label data-bind="attr: {'for': getCode()}" class="label">
-            <img data-bind="attr: {src: cardGetLogoUrl(), alt: $t('tpay.com')}" class="payment-icon"/>
-            <span data-bind="text: getTitle()"></span>
-        </label>
-    </div>
-    <div class="card_payment-method-content" id="card_payment_form">
-        <div class="card_insidebg">
-            <div class="tpay-header-wrapper">
-                <div class="tpay-header-logo">
-                    <img class="tpay-logo" src="https://tpay.com/img/banners/tpay_logo_white.svg"/>
-                </div>
-                <div class="tpay-header-belt"></div>
-            </div>
-            <p id="tpayRSA" style="display: none" data-bind="html: cardGetRSAkey()"></p>
-            <div class="card_tpay-panel-inside-content">
-                <div id="saved_card_payment" style="visibility: visible" class="tpay-cards-choice">
-                    <input type="radio" name="savedId" id="newCard" value="new">
-                    <label for="newCard"><!-- ko i18n: 'Pay with a new card' --><!-- /ko -->
-                    </label>
-                </div>
-                <div class="tpay-channel-form-wrapper tpay-content-wrapper-class">
-                    <div id="card_form" style="display: none">
-                        <div id="card_payment" class="tpay-input-wrapper">
-                            <div class="tpay-col">
-                                <div class="tpay-row">
-                                    <div class="tpay-input-wrapper">
-                                        <div class="tpay-input-credit-card-number">
-                                            <div class="tpay-input-label"><!-- ko i18n: 'Card number' -->
-                                                <!-- /ko --></div>
-                                            <input id="card_number"
-                                                   pattern="\d*"
-                                                   autocompletetype="cc-number"
-                                                   size="30"
-                                                   type="tel"
-                                                   autocomplete="off"
-                                                   maxlength="23"
-                                                   placeholder="XXXX XXXX XXXX XXXX"
-                                                   tabindex="1"
-                                                   value=""
-                                                   class="tpay-input-value"
-                                            />
-                                            <div class="tpay-card-icon "></div>
-                                        </div>
-                                    </div>
-                                </div>
-
-                            </div>
-                            <div class="tpay-col">
-                                <div class="tpay-row">
-                                    <div class="tpay-expiration-date-input tpay-input-wrapper">
-                                        <div class="tpay-input-label">
-                                            <!-- ko i18n: 'Expiration date' --><!-- /ko -->
-                                        </div>
-                                        <input id="expiry_date"
-                                               maxlength="9"
-                                               type="tel"
-                                               placeholder="01 / 2020"
-                                               autocomplete="off"
-                                               autocompletetype="cc-exp"
-                                               tabindex="2"
-                                               value=""
-                                               class="tpay-input-value"
-                                        />
-                                    </div>
-                                    <div class="tpay-cvv-input tpay-input-wrapper">
-                                        <div class="tpay-input-label tpay-input-cvc"
-                                             data-bind="attr: {title: $t('For MasterCard, Visa or Discover, these are the last three digits placed next to the card user signature.')}"
-                                        >
-                                            <!-- ko i18n: 'CVC' --><!-- /ko -->
-                                        </div>
-                                        <input id="cvc"
-                                               maxlength="4"
-                                               type="tel"
-                                               autocomplete="off"
-                                               autocompletetype="cc-cvc"
-                                               placeholder="XXX"
-                                               tabindex="3"
-                                               value=""
-                                               class="tpay-input-value"
-                                        />
-                                    </div>
-                                </div>
-                            </div>
-                            <span data-bind="html: cardShowSaveBox()"></span>
-                            <input type="hidden" name="card_data" id="card_data"/>
-                            <input type="hidden" name="card_vendor" id="card_vendor"/>
-                            <input type="hidden" name="card_short_code" id="card_short_code"/>
-                        </div>
-                        <div class="tpay-amPmCheckbox" id="tpay-card-save-checkbox" style="display: none">
-                            <input type="checkbox" id="card_save" name="card_save"/>
-                            <label for="card_save" class="tpay-info-label" data-bind="
-                        attr: {title: $t('Allow to pay faster for next orders. Card data will be stored on secure tpay.com server.')}
-                        "
-                            ><!-- ko i18n: 'Save my card' --><!-- /ko -->
-                            </label>
-                        </div>
-
-                        <p id="info_msg"></p>
-                        <div id="loading_scr" style="display:none"><img
-                            data-bind="
-                        attr: {src: cardGetTpayLoadingGif()}"
-                            style="vertical-align: middle;"/>
-                            <!-- ko i18n: 'Processing data, please wait...' -->
-                            <!-- /ko -->
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-        <span data-bind="html: cardFetchJavaScripts()"></span>
-
-        <span data-bind="html: cardAddCSS()"></span>
-        <!-- ko foreach: getRegion('messages') -->
-        <!-- ko template: getTemplate() --><!-- /ko -->
-        <!--/ko-->
-        <div class="payment-method-billing-address">
-            <!-- ko foreach: $parent.getRegion(getBillingAddressFormName()) -->
-            <!-- ko template: getTemplate() --><!-- /ko -->
-            <!--/ko-->
-        </div>
-        <div class="checkout-agreements-block">
-            <!-- ko foreach: $parent.getRegion('before-place-order') -->
-            <!-- ko template: getTemplate() --><!-- /ko -->
-            <!--/ko-->
-        </div>
-        <div class="actions-toolbar">
-            <div class="primary">
-                <button class="action primary checkout"
-                        id="tpaycom_magento2cards_submit"
-                        type="submit"
-                        data-bind="
-                        click: placeOrder,
-                        attr: {title: $t('Place Order')},
-                        css: {disabled: !isPlaceOrderActionAllowed()},
-                        enable: (getCode() == isChecked()),
-                        "
-                        disabled>
-                    <span data-bind="text: $t('Place Order')"></span>
-                </button>
-            </div>
-        </div>
-    </div>
-</div>