diff --git a/source/wp-content/themes/wporg-developer-2023/src/dashicons-page/render.php b/source/wp-content/themes/wporg-developer-2023/src/dashicons-page/render.php
index 3ebaea12..007a264b 100644
--- a/source/wp-content/themes/wporg-developer-2023/src/dashicons-page/render.php
+++ b/source/wp-content/themes/wporg-developer-2023/src/dashicons-page/render.php
@@ -90,7 +90,7 @@
);
?>
-
data-wp-interactive="wporg/dashicons-page">
+
data-wp-interactive="wporg/dashicons-page" data-wp-init="init">
role="main">
diff --git a/source/wp-content/themes/wporg-developer-2023/src/dashicons-page/view.js b/source/wp-content/themes/wporg-developer-2023/src/dashicons-page/view.js
index 59a98ee1..4e32701c 100644
--- a/source/wp-content/themes/wporg-developer-2023/src/dashicons-page/view.js
+++ b/source/wp-content/themes/wporg-developer-2023/src/dashicons-page/view.js
@@ -45,6 +45,27 @@ const { state } = IAPI.store( 'wporg/dashicons-page', {
state.filter = event.target.value;
},
+ /**
+ * A previous implementation used #icon-slug to pick an ico.
+ * Respect those links, but replace the URL with our query-based version.
+ */
+ init: () => {
+ const url = new URL( document.location.href );
+ const iconFromQuery = url.searchParams.get( 'icon' );
+
+ // Prefer an icon from query, but if a hash (legacy link) includes it, fall-back to that.
+ if ( ! Object.hasOwn( config.icons, iconFromQuery ) && url.hash ) {
+ const iconFromHash = `dashicons-${ url.hash.substring( 1 ) }`;
+ console.log( iconFromQuery, iconFromHash );
+ if ( Object.hasOwn( config.icons, iconFromHash ) ) {
+ url.hash = '';
+ state.selectedIcon = [ iconFromHash ];
+ url.searchParams.set( 'icon', iconFromHash );
+ window.history.replaceState( undefined, undefined, url );
+ }
+ }
+ },
+
copyClickHandlers: {
css: makeCopyHandler( 'css' ),
html: makeCopyHandler( 'html' ),