Merge branch 'develop' into update/ecommerce

* develop: update to latest help-center module version fix nav tests update helper to open help center if on help page only show plugin subnav in wp nav when outside plugin app remove legacy help button in admin bar add help helpers, route action, and handle clicks in nav add help center module (also includes ai module) # Conflicts: # composer.lock
newfold-labs · Jan 12, 2024 · 2a732c9 · 2a732c9
2 parents fbda71f + ebd0cc8
commit 2a732c9
Show file tree

Hide file tree

Showing 11 changed files with 160 additions and 142 deletions.
diff --git a/bootstrap.php b/bootstrap.php
@@ -144,7 +144,6 @@ function() {
 
 // Required files
 require HOSTGATOR_PLUGIN_DIR . '/inc/Admin.php';
-require HOSTGATOR_PLUGIN_DIR . '/inc/AdminBar.php';
 require HOSTGATOR_PLUGIN_DIR . '/inc/base.php';
 require HOSTGATOR_PLUGIN_DIR . '/inc/jetpack.php';
 require HOSTGATOR_PLUGIN_DIR . '/inc/LoginRedirect.php';
@@ -159,5 +158,3 @@ function() {
 if ( is_admin() ) {
 	new Admin();
 }
-
-AdminBar::init();
diff --git a/composer.json b/composer.json
@@ -70,6 +70,7 @@
         "newfold-labs/wp-module-deactivation": "^1.0.4",
         "newfold-labs/wp-module-ecommerce": "^1.3.19",
         "newfold-labs/wp-module-global-ctb": "^1.0.9",
+        "newfold-labs/wp-module-help-center": "^1.0.22",
         "newfold-labs/wp-module-loader": "^1.0.10",
         "newfold-labs/wp-module-marketplace": "^2.2.0",
         "newfold-labs/wp-module-notifications": "^1.1.6",

diff --git a/composer.lock b/composer.lock
diff --git a/inc/Admin.php b/inc/Admin.php
@@ -190,18 +190,21 @@ public static function page() {
 			$snappy,
 			0
 		);
-
-		foreach ( self::subpages() as $route => $title ) {
-			\add_submenu_page(
-				'hostgator',
-				$title,
-				$title,
-				'manage_options',
-				$route,
-				array( __CLASS__, 'render' )
-			);
+
+		// If we're outside of App, add subpages to App menu
+		if ( false === ( isset( $_GET['page'] ) && strpos( filter_input( INPUT_GET, 'page', FILTER_UNSAFE_RAW ), 'hostgator' ) >= 0 ) ) { // phpcs:ignore
+				foreach ( self::subpages() as $route => $title ) {
+					\add_submenu_page(
+						'hostgator',
+						$title,
+						$title,
+						'manage_options',
+						$route,
+						array( __CLASS__, 'render' )
+					);
+				}
+			}
 		}
-	}
 
 	/**
 	 * Render DOM element for React to load onto.

diff --git a/inc/AdminBar.php b/inc/AdminBar.php
diff --git a/src/app/components/app-nav/index.js b/src/app/components/app-nav/index.js
@@ -4,6 +4,7 @@ import { Modal, SidebarNavigation } from "@newfold/ui-component-library"
 import { NavLink, useLocation } from 'react-router-dom';
 import Logo from "./logo";
 import { topRoutes, utilityRoutes } from "../../data/routes";
+import { handleHelpLinksClick } from '../../util/helpers';
 import { Bars3Icon } from "@heroicons/react/24/outline";
 
 
@@ -188,6 +189,7 @@ export const MobileNav = () => {
 
 export const AppNav = () => {
 	const isLargeViewport = useViewportMatch('medium');
+	handleHelpLinksClick();
 
 	return (
 		<>

diff --git a/src/app/data/routes.js b/src/app/data/routes.js
@@ -19,7 +19,12 @@ import Help from '../pages/help';
 import Store from '../pages/ecommerce/page';
 import { getMarketplaceSubnavRoutes } from '../../../vendor/newfold-labs/wp-module-marketplace/components/marketplaceSubnav';
 
-const addPartialMatch = (prefix, path) => prefix === path ? `${prefix}/*` : path; 
+const addPartialMatch = (prefix, path) => prefix === path ? `${prefix}/*` : path;
+
+const HelpCenterAI = ( e ) => {
+	e.preventDefault();
+	window.newfoldEmbeddedHelp.toggleNFDLaunchedEmbeddedHelp();
+};
 
 export const AppRoutes = () => {
 	return (
@@ -124,6 +129,9 @@ export const routes = [
 		title: __('Help', 'wp-plugin-hostgator'),
 		Component: Help,
 		Icon: QuestionMarkCircleIcon,
+		action: NewfoldRuntime.hasCapability( 'canAccessHelpCenter' )
+			? HelpCenterAI
+			: false,
 	},
 ];
 

diff --git a/src/app/index.js b/src/app/index.js
@@ -14,7 +14,6 @@ import { useDispatch, useSelect } from '@wordpress/data';
 import { useEffect } from 'react';
 import { ErrorBoundary } from 'react-error-boundary';
 import { store as noticesStore } from '@wordpress/notices';
-import { setActiveSubnav } from './util/helpers';
 import { kebabCase, filter } from 'lodash';
 import { AppNav } from './components/app-nav';
 import { SiteInfoBar } from './components/site-info';
@@ -52,7 +51,6 @@ const handlePageLoad = () => {
 	const location = useLocation();
 	const routeContents = document.querySelector('.hgwp-app-body-inner');
 	useEffect(() => {
-		setActiveSubnav(location.pathname);
 		window.scrollTo(0, 0);
 		if (routeContents) {
 			routeContents.focus({ preventScroll: true });

diff --git a/src/app/pages/help/index.js b/src/app/pages/help/index.js
@@ -1,5 +1,9 @@
 import help from '../../data/help';
-import { getLinkPerRegion, supportsLinkPerRegion } from '../../util/helpers';
+import {
+	getLinkPerRegion,
+	supportsLinkPerRegion,
+	handleHelpLinksClick
+} from '../../util/helpers';
 import { 
 	Button,
 	Card,
@@ -36,6 +40,7 @@ const HelpCard = ({ item }) => {
 }
 
 const Help = () => {
+	handleHelpLinksClick();
 	const renderHelpCards = () => {
 		const helpItems = help;
 

diff --git a/src/app/util/helpers.js b/src/app/util/helpers.js
@@ -5,50 +5,6 @@ import { NewfoldRuntime } from "@newfold-labs/wp-module-runtime";
 import region from '../data/region';
 
 let lastNoticeId;
-const HG_NAV = document.querySelector('#toplevel_page_hostgator .wp-submenu');
-/**
- * Set active nav in wp admin sub pages.
- *
- * @param  path
- */
-export const setActiveSubnav = (path) => {
-	if (HG_NAV) {
-		const HG_NAV_LIS = HG_NAV.children;
-		if (HG_NAV_LIS) {
-			for (let i = 0; i < HG_NAV_LIS.length; i++) {
-				// get all children li elements
-				const link = HG_NAV_LIS[i].children[0];
-				if (link) {
-					const href = link.getAttribute('href');
-					// check each child a href for match with path
-					if (
-						href.endsWith(path) || // match
-						(path.includes('/marketplace/') &&
-							href.endsWith('marketplace')) ||
-						(path === '/' && href.endsWith('home'))
-					) {
-						// highlight home subnav for root page
-						// update li class when match
-						HG_NAV_LIS[i].classList.add('current');
-					} else {
-						HG_NAV_LIS[i].classList.remove('current');
-					}
-					// highlight our home nav for root level access
-					const HG_HOME_NAV = document.querySelector(
-						'.hgwp-nav a[href="#/home"]'
-					);
-					if (HG_HOME_NAV) {
-						if (path === '/' || path === '/home') {
-							HG_HOME_NAV.classList.add('active');
-						} else {
-							HG_HOME_NAV.classList.remove('active');
-						}
-					}
-				}
-			}
-		}
-	}
-};
 
 /**
  * Wrapper method to dispatch snackbar notice
@@ -227,3 +183,32 @@ export const supportsLinkPerRegion = (link_name = 'main') => {
 	params.utm_medium = 'hostgator_plugin';
 	return addQueryArgs(url, params);
 };
+
+/**
+ * Handles help center links click, will open help center slide if user has access
+ * or navigate to help page if user doesn't have access
+ */
+export const handleHelpLinksClick = () => {
+	if (
+		NewfoldRuntime.hasCapability( 'canAccessHelpCenter' ) &&
+		window.newfoldEmbeddedHelp &&
+		! window.newfoldEmbeddedHelp.hasListeners
+	) {
+		// add listener to all help links
+		const helpLinks = document.querySelectorAll( '[href*="#/help"]' );
+		if ( helpLinks ) {
+			helpLinks.forEach( ( el ) =>
+				el.addEventListener( 'click', ( e ) => {
+					e.preventDefault();
+					window.newfoldEmbeddedHelp.toggleNFDLaunchedEmbeddedHelp();
+				} )
+			);
+			window.newfoldEmbeddedHelp.hasListeners = true;
+		}
+
+		// if on help page already, open help center
+		if( window.location.hash === '#/help') {
+			window.newfoldEmbeddedHelp.toggleNFDLaunchedEmbeddedHelp();
+		}
+	}
+};