add help helpers, route action, and handle clicks in nav

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 (
 		<>

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,
 	},
 ];
 

src/app/util/helpers.js

@@ -227,3 +227,26 @@ 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
+	) {
+		const helpLinks = document.querySelectorAll( '[href*="#/help"]' );
+		if ( helpLinks ) {
+			helpLinks.forEach( ( el ) =>
+				el.addEventListener( 'click', ( e ) => {
+					e.preventDefault();
+					window.newfoldEmbeddedHelp.toggleNFDLaunchedEmbeddedHelp();
+				} )
+			);
+			window.newfoldEmbeddedHelp.hasListeners = true;
+		}
+	}
+};