support save card option for blocks mode (#78)

* Support save card option for blocks mode

* Add has subscription check

* Show the save token note

assets/js/frontend/blocks.asset.php

@@ -1 +1 @@
-<?php return array('dependencies' => array('react', 'wc-blocks-registry', 'wc-settings', 'wp-html-entities', 'wp-i18n'), 'version' => 'fa804360790c00d8fbe1');
+<?php return array('dependencies' => array('react', 'wc-blocks-registry', 'wc-settings', 'wp-html-entities', 'wp-i18n'), 'version' => '42876f73af7e658f29e0');

includes/blocks/class-wc-paytabs-payments-blocks.php

@@ -98,11 +98,14 @@ public function get_payment_method_data()
 				'supports' => array_filter($gateway->supports, [$gateway, 'supports']),
 				'icon' => $gateway->getIcon(),
 				'description' => $gateway->description,
+				'enable_tokenise' => $gateway->enable_tokenise,
 			];
 
 			$key = "blocks";
 			$data[$key][] = $gateWayData;
 		}
+		$data['cart']['has_subscription'] = class_exists('WC_Subscriptions_Cart') && WC_Subscriptions_Cart::cart_contains_subscription();
+
 		return $data;
 	}
 }

includes/paytabs_payment_methods.php

@@ -41,7 +41,7 @@ class WC_Gateway_Paytabs extends WC_Payment_Gateway
     private $valu_widget_phone_number;
     private $valu_widget_price_threshold;
 
-    private $enable_tokenise;
+    public $enable_tokenise;
     private $tokenise_param;
     private $token_id_param;
 
@@ -463,7 +463,12 @@ private function has_subscription($order_id)
 
     private function is_tokenise()
     {
-        return (bool)filter_input(INPUT_POST, $this->tokenise_param, FILTER_VALIDATE_BOOLEAN);
+        if (!array_key_exists( $this->tokenise_param, $_POST ) ){
+            return false;
+        }
+
+        $isTokenized = (bool) $_POST["$this->tokenise_param"];
+        return $isTokenized;
     }
 
     private function get_token()

package.json

@@ -1,7 +1,7 @@
 {
 	"name": "paytabs-woocommerce",
 	"title": "PayTabs - WooCommerce",
-	"version": "1.0.7",
+	"version": "1.1.0",
 	"author": "PayTabs",
 	"license": "GPL-3.0+",
 	"keywords": [],

paytabs-woocommerce.php

@@ -9,7 +9,7 @@
  * Plugin URI:    https://paytabs.com/
  * Description:   PayTabs is a <strong>3rd party payment gateway</strong>. Ideal payment solutions for your internet business.
 
- * Version:       5.0.1
+ * Version:       5.1.0
  * Requires PHP:  7.0
  * Author:        PayTabs
  * Author URI:    [email protected]
@@ -20,7 +20,7 @@
 }
 
 
-define('PAYTABS_PAYPAGE_VERSION', '5.0.1');
+define('PAYTABS_PAYPAGE_VERSION', '5.1.0');
 define('PAYTABS_PAYPAGE_DIR', plugin_dir_path(__FILE__));
 define('PAYTABS_PAYPAGE_URL', plugins_url("/", __FILE__));
 define('PAYTABS_PAYPAGE_ICONS_URL', plugins_url("icons/", __FILE__));

resources/js/frontend/index.js

@@ -4,9 +4,9 @@ import { registerPaymentMethod } from '@woocommerce/blocks-registry';
 import { decodeEntities } from '@wordpress/html-entities';
 import { getSetting } from '@woocommerce/settings';
 
-const settings = getSetting( 'paytabs_blocks_data', {} );
+const settings = getSetting('paytabs_blocks_data', {});
 
-const defaultLabel = __('PayTabs Payments');
+// const defaultLabel = __('PayTabs Payments');
 
 /**
  * Content component
@@ -20,6 +20,11 @@ const Content = (props) => {
 				<PaymentMethodLabel text={props.setting.description} />
 			</div>
 		}
+		{props.showSaveNote &&
+			<div style={{ display: 'flex', justifyContent: 'space-between', width: "100%", paddingRight: 5, paddingLeft: 5 }}>
+				<strong>Will Save to Account</strong>
+			</div>
+		}
 	</>
 };
 
@@ -29,26 +34,29 @@ const Content = (props) => {
  *
  * @param {*} props Props from payment API.
  */
-const Label = ( props ) => {
+const Label = (props) => {
 	const { PaymentMethodLabel } = props.components;
-	
+
 	return <div style={{ display: 'flex', justifyContent: 'space-between', width: "100%", paddingRight: 5, paddingLeft: 5 }}>
-				<PaymentMethodLabel text={decodeEntities(props.setting.title)} />
-				{props.setting.icon != '' && <img src={props.setting.icon} alt={props.setting.name}/>}
-			</div>
+		<PaymentMethodLabel text={decodeEntities(props.setting.title)} />
+		{props.setting.icon != '' && <img src={props.setting.icon} alt={props.setting.name} />}
+	</div>
 };
 
-
-// registerPaymentMethod( Paytabs );
-settings.blocks.forEach( setting => {
+let hasSubscription = settings.cart.has_subscription;
+settings.blocks.forEach(setting => {
+	let supportTokenization = setting.supports.includes("tokenization") && setting.enable_tokenise;
+	let showSaveNote = supportTokenization && hasSubscription;
 	let gateWay = {
 		name: setting.name,
 		label: <Label setting={setting} />,
-		content: <Content setting={setting} />,
+		content: <Content setting={setting} showSaveNote={showSaveNote} />,
 		edit: <div>{decodeEntities(setting.description)}</div>,
 		canMakePayment: () => true,
 		ariaLabel: decodeEntities(setting.title),
 		supports: {
+			showSavedCards: supportTokenization,
+			showSaveOption: supportTokenization && !hasSubscription,
 			features: setting.supports,
 		},
 	};