Merge pull request #874 from Codeinwp/refactor/internal-pages

feat: load Formbricks survey via internal pages hooks

Author: selul

assets/src/dashboard/parts/connected/index.js

@@ -21,41 +21,8 @@ import Help from './help';
 import Sidebar from './Sidebar';
 import CSAT from './CSAT';
 import { retrieveConflicts } from '../../utils/api';
-import formbricks from '@formbricks/js/app';
 import BlackFridayBanner from '../components/BlackFridayBanner';
-if ( 'undefined' !== typeof window && optimoleDashboardApp.user_data.plan ) {
-	formbricks.init({
-		environmentId: 'clo8wxwzj44orpm0gjchurujm',
-		apiHost: 'https://app.formbricks.com',
-		userId: 'optml_' + ( optimoleDashboardApp.user_data.id ),
-		attributes: {
-			plan: optimoleDashboardApp.user_data.plan,
-			status: optimoleDashboardApp.user_data.status,
-			language: optimoleDashboardApp.language,
-			cname_assigned: optimoleDashboardApp.user_data.is_cname_assigned || 'no',
-			connected_websites: optimoleDashboardApp.user_data.whitelist && optimoleDashboardApp.user_data.whitelist.length.toString(),
-			traffic: convertToCategory( optimoleDashboardApp.user_data.traffic || 0, 500 ).toString(),
-			images_number: convertToCategory( optimoleDashboardApp.user_data.images_number || 0, 100 ).toString(),
-			days_since_install: convertToCategory( optimoleDashboardApp.days_since_install ).toString()
-		}
-	});
 
-}
-function convertToCategory( number, scale = 1 ) {
-
-	const normalizedNumber = Math.round( number / scale );
-	if ( 0 === normalizedNumber || 1 === normalizedNumber ) {
-		return 0;
-	} else if ( 1 < normalizedNumber && 8 > normalizedNumber ) {
-		return 7;
-	} else if ( 8 <= normalizedNumber && 31 > normalizedNumber ) {
-		return 30;
-	} else if ( 30 < normalizedNumber && 90 > normalizedNumber ) {
-		return 90;
-	} else if ( 90 < normalizedNumber ) {
-		return 91;
-	}
-}
 const ConnectedLayout = ({
 	tab,
 	setTab

inc/admin.php

@@ -95,6 +95,8 @@ public function __construct() {
 			); // phpcs:ignore WordPressVIPMinimum.Hooks.RestrictedHooks.upload_mimes
 			add_filter( 'wp_handle_upload_prefilter', [ $this, 'check_svg_and_sanitize' ] );
 		}
+
+		add_filter( 'themeisle-sdk/survey/' . OPTML_PRODUCT_SLUG, [ $this, 'get_survey_metadata' ], 10, 2 );
 	}
 	/**
 	 * Check if the file is an SVG, if so handle appropriately
@@ -1257,6 +1259,8 @@ public function enqueue() {
 			],
 			$asset_file['version']
 		);
+
+		do_action( 'themeisle_internal_page', OPTML_PRODUCT_SLUG, 'dashboard' );
 	}
 
 	/**
@@ -1980,4 +1984,71 @@ public function allow_svg( $mimes ) {
 
 		return $mimes;
 	}
+
+	/**
+	 * Get the Formbricks survey metadata.
+	 *
+	 * @param array  $data The data in Formbricks format.
+	 * @param string $page_slug The slug of the page.
+	 *
+	 * @return array - The data in Formbricks format.
+	 */
+	public function get_survey_metadata( $data, $page_slug ) {
+
+		if ( 'dashboard' !== $page_slug ) {
+			return $data;
+		}
+
+		$dashboard_data = $this->localize_dashboard_app();
+		$user_data      = $dashboard_data['user_data'];
+
+		if ( ! isset( $user_data['plan'] ) ) {
+			return $data;
+		}
+
+		$data = [
+			'environmentId' => 'clo8wxwzj44orpm0gjchurujm',
+			'attributes'    => [
+				'plan'                => $user_data['plan'],
+				'status'              => $user_data['status'],
+				'cname_assigned'      => ! empty( $user_data['is_cname_assigned'] ) ? $user_data['is_cname_assigned'] : 'no',
+				'connected_websites'  => isset( $user_data['whitelist'] ) ? strval( count( $user_data['whitelist'] ) ) : '0',
+				'install_days_number' => intval( $dashboard_data['days_since_install'] ),
+				'traffic'             => strval( isset( $user_data['traffic'] ) ? $this->survey_category( $user_data['traffic'], 500 ) : 0 ),
+				'images_number'       => strval( isset( $user_data['images_number'] ) ? $this->survey_category( $user_data['images_number'], 100 ) : 0 ),
+			],
+		];
+
+		return $data;
+	}
+
+	/**
+	 * Categorize a number for survey based on its scale.
+	 *
+	 * @param int $value The value.
+	 * @param int $scale The scale.
+	 *
+	 * @return int - The category.
+	 */
+	public function survey_category( $value, $scale = 1 ) {
+		$value = intval( $value / $scale );
+
+		if ( 1 < $value && 8 > $value ) {
+			return 7;
+		}
+
+		if ( 8 <= $value && 31 > $value ) {
+			return 30;
+		}
+
+		if ( 30 < $value && 90 > $value ) {
+			return 90;
+		}
+
+		if ( 90 <= $value ) {
+			return 91;
+		}
+
+		return 0;
+	}
 }

inc/dam.php

@@ -536,6 +536,8 @@ public function enqueue_admin_page_scripts() {
 		wp_enqueue_script( OPTML_NAMESPACE . '-admin-page' );
 
 		wp_enqueue_style( OPTML_NAMESPACE . '-admin-page', OPTML_URL . 'assets/build/media/admin-page.css' );
+
+		do_action( 'themeisle_internal_page', OPTML_PRODUCT_SLUG, 'dam' );
 	}
 
 	/**

optimole-wp.php

@@ -92,6 +92,7 @@ function optml() {
 	define( 'OPTML_VERSION', '3.14.1' );
 	define( 'OPTML_NAMESPACE', 'optml' );
 	define( 'OPTML_BASEFILE', __FILE__ );
+	define( 'OPTML_PRODUCT_SLUG', basename( OPTML_PATH ) );
 	// Fallback for old PHP versions when this constant is not defined.
 	if ( ! defined( 'PHP_INT_MIN' ) ) {
 		define( 'PHP_INT_MIN', - 999999 );

package-lock.json

@@ -57,7 +57,6 @@
     "tailwindcss": "^3.3.2"
   },
   "dependencies": {
-    "@formbricks/js": "^2.0.0",
     "classnames": "^2.3.2",
     "react-compare-image": "^3.4.0",
     "usehooks-ts": "^2.9.1"

package.json

@@ -10,6 +10,8 @@
 define( 'OPTML_VERSION', '3.7.0' );
 define( 'OPTML_NAMESPACE', 'optml' );
 define( 'OPTML_BASEFILE', __FILE__ );
+define( 'OPTML_PRODUCT_SLUG', basename( OPTML_PATH ) );
+
 if ( ! defined( 'OPTML_DEBUG' ) ) {
     define( 'OPTML_DEBUG', false );
 }