[WAUM][12/n]Link the Add payment button to the correct billing url

assets/js/admin/whatsapp-billing.js

@@ -0,0 +1,29 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates. All Rights Reserved
+ *
+ * This source code is licensed under the license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @package FacebookCommerce
+ */
+
+jQuery( document ).ready( function( $ ) {
+    // handle the whatsapp add payment button click should open billing flow in Meta
+    $('#wc-whatsapp-add-payment').click(function(event) {
+
+        $.post( facebook_for_woocommerce_whatsapp_billing.ajax_url, {
+			action: 'wc_facebook_whatsapp_fetch_billing_url_info',
+			nonce:  facebook_for_woocommerce_whatsapp_billing.nonce
+		}, function ( response ) {
+            if ( response.success ) {
+                var  business_id = response.data.business_id;
+                var asset_id = response.data.waba_id;
+				const BILLING_URL = `https://business.facebook.com/billing_hub/accounts/details/?business_id=${business_id}&asset_id=${asset_id}&account_type=whatsapp-business-account`;
+                window.open( BILLING_URL);
+			}
+		} );
+
+
+    });
+
+} );

includes/AJAX.php

@@ -51,6 +51,9 @@ public function __construct() {
 		// update the wp_options with wc_facebook_whatsapp_consent_collection_setting_status to enabled
 		add_action( 'wp_ajax_wc_facebook_whatsapp_consent_collection_enable', array( $this, 'whatsapp_consent_collection_enable' ) );
 
+		// fetch billing url info - waba id and business id
+		add_action( 'wp_ajax_wc_facebook_whatsapp_fetch_billing_url_info', array( $this, 'wc_facebook_whatsapp_fetch_billing_url_info' ) );
+
 		// search a product's attributes for the given term
 		add_action( 'wp_ajax_' . self::ACTION_SEARCH_PRODUCT_ATTRIBUTES, array( $this, 'admin_search_product_attributes' ) );
 	}
@@ -171,6 +174,26 @@ public function get_sync_status() {
 		wp_send_json_success( $remaining_products );
 	}
 
+	public function wc_facebook_whatsapp_fetch_billing_url_info() {
+		facebook_for_woocommerce()->log( 'Fetching billing url info' );
+		if ( ! check_ajax_referer( 'facebook-for-wc-whatsapp-billing-nonce', 'nonce', false ) ) {
+			wp_send_json_error( 'Invalid security token sent.' );
+		}
+
+		$waba_id     = get_option( 'wc_facebook_wa_integration_waba_id', null );
+		$business_id = get_option( 'wc_facebook_wa_integration_business_id', null );
+
+		if ( empty( $waba_id ) || empty( $business_id ) ) {
+			wp_send_json_error( 'Onboarding is not complete or has failed.' );
+		}
+
+		$response = array(
+			'waba_id'     => $waba_id,
+			'business_id' => $business_id,
+		);
+
+		wp_send_json_success( $response );
+	}
 
 	public function whatsapp_consent_collection_enable() {
 		if ( ! check_ajax_referer( 'facebook-for-wc-whatsapp-consent-nonce', 'nonce', false ) ) {

includes/Admin/Settings_Screens/Whatsapp_Utility.php

@@ -80,6 +80,23 @@ public function enqueue_assets() {
 				),
 			)
 		);
+		wp_enqueue_script(
+			'facebook-for-woocommerce-whatsapp-billing',
+			facebook_for_woocommerce()->get_asset_build_dir_url() . '/admin/whatsapp-billing.js',
+			array( 'jquery', 'jquery-blockui', 'jquery-tiptip', 'wc-enhanced-select' ),
+			\WC_Facebookcommerce::PLUGIN_VERSION
+		);
+		wp_localize_script(
+			'facebook-for-woocommerce-whatsapp-billing',
+			'facebook_for_woocommerce_whatsapp_billing',
+			array(
+				'ajax_url' => admin_url( 'admin-ajax.php' ),
+				'nonce'    => wp_create_nonce( 'facebook-for-wc-whatsapp-billing-nonce' ),
+				'i18n'     => array(
+					'result' => true,
+				),
+			)
+		);
 	}
 
 

webpack.config.js

@@ -13,6 +13,7 @@ const jQueryUIAdminFileNames = [
 	'settings-commerce',
 	'settings-sync',
 	'enhanced-settings-sync',
+    'whatsapp-billing',
     'whatsapp-connection',
     'whatsapp-consent',
 ];