From 4242eb3ba6cdc129deb9dbf938d2acba7fcd2d4b Mon Sep 17 00:00:00 2001
From: paul sealock <psealock@gmail.com>
Date: Thu, 5 Sep 2024 13:14:41 +1200
Subject: [PATCH] add filtering

---
 .../client/settings/pages/my-example/index.js | 18 ++++++++++++
 .../client/settings/routes.js                 | 28 +++++++++++--------
 2 files changed, 34 insertions(+), 12 deletions(-)

diff --git a/plugins/woocommerce-admin/client/settings/pages/my-example/index.js b/plugins/woocommerce-admin/client/settings/pages/my-example/index.js
index 8c18ba61ed7..dc787cac9b2 100644
--- a/plugins/woocommerce-admin/client/settings/pages/my-example/index.js
+++ b/plugins/woocommerce-admin/client/settings/pages/my-example/index.js
@@ -8,6 +8,7 @@ import { useSettingsLocation } from '../../routes';
  */
 import { getNewPath } from '@woocommerce/navigation';
 import { Link } from '@woocommerce/components';
+import { addFilter } from '@wordpress/hooks';
 
 export const MyExample = () => {
 	const { section } = useSettingsLocation();
@@ -31,3 +32,20 @@ export const MyExampleEdit = () => {
 		</>
 	);
 };
+
+addFilter( 'woocommerce_admin_settings_pages', 'woocommerce', ( pages ) => {
+	return [
+		...pages,
+		{
+			page: 'my-example',
+			areas: {
+				content: <MyExample />,
+				edit: <MyExampleEdit />,
+			},
+			widths: {
+				content: undefined,
+				edit: 380,
+			},
+		},
+	];
+} );
diff --git a/plugins/woocommerce-admin/client/settings/routes.js b/plugins/woocommerce-admin/client/settings/routes.js
index d31c88612be..abfee638cb0 100644
--- a/plugins/woocommerce-admin/client/settings/routes.js
+++ b/plugins/woocommerce-admin/client/settings/routes.js
@@ -2,12 +2,12 @@
  * External dependencies
  */
 import { getQuery } from '@woocommerce/navigation';
+import { applyFilters } from '@wordpress/hooks';
 
 /**
  * Internal dependencies
  */
 import { Content } from './content';
-import { MyExample, MyExampleEdit } from './pages/my-example';
 
 const NotFound = () => {
 	return <h1>Not Found</h1>;
@@ -42,11 +42,11 @@ export const getRoute = () => {
 		};
 	}
 
-	const legacyPages = Object.keys( settingsData ).filter(
+	const legacyRoutes = Object.keys( settingsData ).filter(
 		( p ) => ! settingsData[ p ].is_modern
 	);
 
-	if ( legacyPages.includes( page ) ) {
+	if ( legacyRoutes.includes( page ) ) {
 		return {
 			page,
 			areas: {
@@ -60,19 +60,23 @@ export const getRoute = () => {
 		};
 	}
 
-	const pages = [
-		{
-			page: 'my-example',
+	const routes = applyFilters( 'woocommerce_admin_settings_pages', [] );
+
+	const pageRoute = routes.find( ( route ) => route.page === page );
+
+	if ( ! pageRoute ) {
+		return {
+			page,
 			areas: {
-				content: <MyExample />,
-				edit: <MyExampleEdit />,
+				content: <NotFound />,
+				edit: null,
 			},
 			widths: {
 				content: undefined,
-				edit: 380,
+				edit: undefined,
 			},
-		},
-	];
+		};
+	}
 
-	return pages.find( ( p ) => p.page === page );
+	return pageRoute;
 };