fix: Pro preview features showing when Pro plugin is active (#255)

arifulhoque7 · web-flow · commit 58fea39af502 · 2025-10-21T15:58:51.000+06:00
* fix: Pro preview features showing when Pro plugin is active

- Remove static isProLoaded check evaluated at script load time
- Add dynamic runtime checks in all preview filters
- Rename all callback names to avoid conflicts with Pro plugin
- Add priority 5 to ensure Pro filters (priority 10) can override
- Remove wedocs_register_menu_routes filter from free plugin

Fixes issue where Permission Management, Assistant Widget, Layout &amp; Styles,
Social Share, and Contributors previews were still appearing in settings
even when wedocs-pro plugin was active and licensed.

The root cause was the isProLoaded check happening at script parse time
before Pro plugin loaded, causing all preview filters to register even
when Pro was present.

* fix: pro preview
diff --git a/src/components/App.js b/src/components/App.js
@@ -19,11 +19,13 @@ const App = () => {
     { path: 'settings', component: SettingsPage },
     { path: 'section/:id', component: ListingPage },
     { path: 'migrate', component: Migrate },
-    { path: 'permission_settings', component: PermissionSettingsDemo },
-    { path: '*', component: NotFound },
+    // permission_settings route removed - Pro handles this via manager/:id
   ];
 
   routes = wp.hooks.applyFilters('wedocs_register_menu_routes', routes);
+  
+  // Add wildcard NotFound route LAST so it doesn't catch Pro routes
+  routes.push({ path: '*', component: NotFound });
   const router = createHashRouter(
     createRoutesFromElements(
       <>
diff --git a/src/components/PermissionSettingsDemo/PrivacySettings.js b/src/components/PermissionSettingsDemo/PrivacySettings.js
@@ -4,6 +4,8 @@ import Badge from '../ProPreviews/common/Badge';
 import UpgradePopup from '../ProPreviews/common/UpgradePopup';
 
 const PrivacySettings = ( ) => {
+ 	// Check if Pro is loaded dynamically
+	const isProLoaded = wp.hooks.applyFilters('wedocs_pro_loaded', false);
 	
 	return (
 		<div className="privacy-settings mt-8">
@@ -19,12 +21,10 @@ const PrivacySettings = ( ) => {
 						<input
 							id="public"
 							type="radio"
-							name="publish"
-							
-							 defaultChecked={ true }
-							className=
-								 'checked:!border-transparent checked:!bg-indigo-600 !mt-[.2rem] before:!bg-white before:!w-1.5 before:!h-1.5 before:!mt-1 before:!ml-1 place-content-center'
-							
+							name="privacy"
+							value="public"
+							defaultChecked={ true }
+							className='checked:!border-transparent checked:!bg-indigo-600 !mt-[.2rem] before:!bg-white before:!w-1.5 before:!h-1.5 before:!mt-1 before:!ml-1 place-content-center'
 						/>
 						<div className="ml-2 text-sm">
 							<label
@@ -42,19 +42,29 @@ const PrivacySettings = ( ) => {
 						</div>
 					</div>
 					<div className="field flex">
-						<UpgradePopup>
-	<input
-							id="privacy"
-							name="private"
-							type="radio"
-							className='!bg-transparent !border-[#8c8f94]
-							 !mt-[.2rem] before:!bg-white before:!w-1.5 before:!h-1.5 before:!mt-1 before:!ml-1 place-content-center'
-						/>
-						</UpgradePopup>
+						{isProLoaded ? (
+							<input
+								id="private"
+								name="privacy"
+								type="radio"
+								value="private"
+								className='checked:!border-transparent checked:!bg-indigo-600 !mt-[.2rem] before:!bg-white before:!w-1.5 before:!h-1.5 before:!mt-1 before:!ml-1 place-content-center'
+							/>
+						) : (
+							<UpgradePopup>
+								<input
+									id="private"
+									name="privacy"
+									type="radio"
+									value="private"
+									className='!bg-transparent !border-[#8c8f94] !mt-[.2rem] before:!bg-white before:!w-1.5 before:!h-1.5 before:!mt-1 before:!ml-1 place-content-center'
+								/>
+							</UpgradePopup>
+						)}
 					
 						<div className="ml-2 text-sm">
 							<label
-								htmlFor="privacy"
+								htmlFor="private"
 								className="font-medium text-gray-700 relative"
 							>
 								{ __( 'Private', 'wedocs' ) }
@@ -64,7 +74,9 @@ const PrivacySettings = ( ) => {
 										'wedocs'
 									) }
 								</p>
-								<Badge position='absolute' top="-5px" left="45px" heading="Permission Management is a Premium Feature" description="To see who contributed to the documents, you must upgrade to the pro edition."/>
+								{!isProLoaded && (
+									<Badge position='absolute' top="-5px" left="45px" heading="Permission Management is a Premium Feature" description="To see who contributed to the documents, you must upgrade to the pro edition."/>
+								)}
 							</label>
 						</div>
 					</div>
diff --git a/src/components/ProPreviews/index.js b/src/components/ProPreviews/index.js
@@ -12,16 +12,13 @@ import PreferenceSettings from './AssistantWidgetPanels/PreferencePanel';
 import SocialShareSettings from './SocialShareSettings';
 import Badge from './common/Badge';
 
-const isProLoaded = wp.hooks.applyFilters(
-    'wedocs_pro_loaded',
-    false
-);
-
-if ( !isProLoaded ) {
-    wp.hooks.addFilter(
-        'wedocs_settings_menu',
-        'settings_menu_override',
-        function ( menus ) {
+wp.hooks.addFilter(
+    'wedocs_settings_menu',
+    'wedocs_free_settings_menu_preview',
+    function ( menus ) {
+        // Check if Pro is loaded dynamically
+        const isProLoaded = wp.hooks.applyFilters('wedocs_pro_loaded', false);
+        if (isProLoaded) return menus;
             menus.permission = {
                 pro: true,
                 text: __( 'Permission Management', 'wedocs' ),
@@ -168,14 +165,19 @@ if ( !isProLoaded ) {
             };
 
             return menus;
-        }
+        },
+        5
     );
 
-    wp.hooks.addFilter(
-        'wedocs_settings_page_templates',
-        'wedocs_settings_page_templates_callback',
-        function ( templates, docSettings, setDocSettings, index ) {
-            const assistantWidgetSubPanels = [
+wp.hooks.addFilter(
+    'wedocs_settings_page_templates',
+    'wedocs_free_settings_page_templates_preview',
+    function ( templates, docSettings, setDocSettings, index ) {
+        // Check if Pro is loaded dynamically
+        const isProLoaded = wp.hooks.applyFilters('wedocs_pro_loaded', false);
+        if (isProLoaded) return templates;
+        
+        const assistantWidgetSubPanels = [
                 <AiChatBotSettings key={ index } />,
                 <ExploreSettings key={ index } />,
                 <MessageSettings key={ index } />,
@@ -202,23 +204,29 @@ if ( !isProLoaded ) {
                     setSettings={ setDocSettings }
                 />,
             ];
-        }
+        },
+        5
     );
 
-    wp.hooks.addFilter(
-        'wedocs_admin_article_restriction_action',
-        'wedocs_admin_article_restriction_action_callback',
-        function ( componentsArray, id, type ) {
-            return (
+wp.hooks.addFilter(
+    'wedocs_admin_article_restriction_action',
+    'wedocs_free_article_restriction_preview',
+    function ( componentsArray, id, type ) {
+        // Check if Pro is loaded dynamically
+        const isProLoaded = wp.hooks.applyFilters('wedocs_pro_loaded', false);
+        if (isProLoaded) return componentsArray;
+        
+        return (
                 <>
                     { userIsAdmin() && (
                         <>
                             { type === 'doc' && (
-                <a href={`${weDocsAdminVars.weDocsUrl}permission_settings`} className="group flex items-center py-2 px-4 text-sm font-medium text-gray-700 hover:bg-indigo-700 hover:text-white !shadow-none">
-                  <span>{ __( 'Permission Management', 'wedocs' ) }</span>
-                  <span className={ `crown cursor-pointer relative text-white text-[10px] py-[3px] px-[5px] leading-none ml-2.5` }>
+                <UpgradePopup>
+                  <span className="group flex items-center py-2 px-4 text-sm font-medium text-gray-700 hover:bg-indigo-700 hover:text-white !shadow-none cursor-pointer">
+                    <span>{ __( 'Permission Management', 'wedocs' ) }</span>
+                    <Badge classes="opacity-0 group-hover:opacity-100 transition-opacity ml-2"/>
                   </span>
-                </a>
+                </UpgradePopup>
                             ) }
                             { type === 'article' && (
                               
@@ -233,39 +241,57 @@ if ( !isProLoaded ) {
                     ) }
                 </>
             );
-        }
+        },
+        5
     );
 
-    wp.hooks.addFilter(
-        'wedocs_documentation_contributors',
-        'wedocs_documentation_contributors_callback',
-        function () {
-            if ( !userIsAdmin() ) return;
-            if(!isProLoaded) return;
-
-            return <Contributors />;
-        }
-    );
+wp.hooks.addFilter(
+    'wedocs_documentation_contributors',
+    'wedocs_free_documentation_contributors_preview',
+    function () {
+        // Check if Pro is loaded dynamically
+        const isProLoaded = wp.hooks.applyFilters('wedocs_pro_loaded', false);
+        if (isProLoaded) return;
+        if ( !userIsAdmin() ) return;
 
-    wp.hooks.addFilter(
-        'wedocs_article_contributors',
-        'wedocs_article_contributors_callback',
-        function () {
-            if ( !userIsAdmin() ) return;
-              if(!isProLoaded) return;
+        return <Contributors />;
+    },
+    5
+);
 
-            return <Contributors />;
-        }
-    );
+wp.hooks.addFilter(
+    'wedocs_article_contributors',
+    'wedocs_free_article_contributors_preview',
+    function () {
+        // Check if Pro is loaded dynamically
+        const isProLoaded = wp.hooks.applyFilters('wedocs_pro_loaded', false);
+        if (isProLoaded) return;
+        if ( !userIsAdmin() ) return;
 
+        return <Contributors />;
+    },
+    5
+);
 
 wp.hooks.addFilter(
-	'wedocs_register_menu_routes',
-	'wedocs_register_menu_routes_callback',
-	function ( routes ) {
-		const { weDocsSettingsPage: SettingsPage } = window;
-			routes?.push( { path: 'settings/:panel', component: SettingsPage } );
-		return routes;
-	}
+	'wedocs_article_restriction_menu',
+	'wedocs_free_article_restriction_menu_preview',
+	function ( menu ) {
+		// Check if Pro is loaded dynamically
+		const isProLoaded = wp.hooks.applyFilters('wedocs_pro_loaded', false);
+		if (isProLoaded) return menu;
+		
+		// Return PRO preview menu when Pro is not loaded
+		return (
+			<UpgradePopup>
+				<a
+					href="#"
+					className="group flex items-center py-2 px-4 text-sm font-medium text-gray-700 hover:bg-indigo-700 hover:text-white !shadow-none"
+				>
+					<span>{ __( 'Permission Management', 'wedocs' ) }</span>
+				</a>
+			</UpgradePopup>
+		);
+	},
+	5
 );
-}
diff --git a/src/data/docs/actions.js b/src/data/docs/actions.js
@@ -79,7 +79,7 @@ const actions = {
   *updateDoc( docId, data ) {
     const getDocsPath = wp.hooks.applyFilters(
       'wedocs_documentation_fetching_path',
-      `/wp/v2/docs?per_page=-1&status=publish${ typeof weDocsAdminVars !== 'undefined' ? ',draft' : ''}`
+      `/wp/v2/docs?per_page=-1&status=publish${ typeof weDocsAdminVars !== 'undefined' ? ',draft,private' : ''}`
     );
     const path = '/wp/v2/docs/' + docId;
     yield { type: 'UPDATE_TO_API', path, data };
@@ -141,7 +141,7 @@ const actions = {
   *updateParentDocs() {
     const getDocsPath = wp.hooks.applyFilters(
       'wedocs_documentation_fetching_path',
-      `/wp/v2/docs?per_page=-1&status=publish${ typeof weDocsAdminVars !== 'undefined' ? ',draft' : ''}`
+      `/wp/v2/docs?per_page=-1&status=publish${ typeof weDocsAdminVars !== 'undefined' ? ',draft,private' : ''}`
     );
 
     const response = yield actions.fetchFromAPI( getDocsPath );
diff --git a/src/data/docs/resolvers.js b/src/data/docs/resolvers.js
@@ -1,12 +1,13 @@
 import actions from './actions';
 
-const getDocsPath = wp.hooks.applyFilters(
-  'wedocs_documentation_fetching_path',
-  `/wp/v2/docs?per_page=-1&status=publish${ typeof weDocsAdminVars !== 'undefined' ? ',draft' : ''}`
-);
-
 const resolvers = {
   *getDocs() {
+    // Compute path at runtime to ensure Pro filters are applied
+    const getDocsPath = wp.hooks.applyFilters(
+      'wedocs_documentation_fetching_path',
+      `/wp/v2/docs?per_page=-1&status=publish${ typeof weDocsAdminVars !== 'undefined' ? ',draft,private' : ''}`
+    );
+    
     yield actions.setLoading( true );
     const response = yield actions.fetchFromAPI( getDocsPath );
     yield actions.setDocs( response );
diff --git a/src/index.js b/src/index.js
@@ -2,8 +2,12 @@ import './data/store';
 import './assets/css/index.css';
 import App from './components/App';
 import menuFix from './utils/menuFix';
-import { render } from '@wordpress/element';
+import { createRoot } from '@wordpress/element';
 
-render( <App />, document.getElementById( 'wedocs-app' ) );
+// Wait for DOM and all scripts to be ready before rendering
+// This ensures Pro plugin filters are registered before App renders
 
-menuFix( 'wedocs' );
+const container = document.getElementById( 'wedocs-app' );
+const root = createRoot( container );
+root.render( <App /> );
+menuFix( 'wedocs' );
