Add Gutenberg editor support and cache fix for dots in license slugs

Author: mlaetitia

plugins/osi-features/assets/src/js/license-slug-dots.js

@@ -0,0 +1,119 @@
+/**
+ * Preserve dots in license post slugs within the Gutenberg editor.
+ *
+ * Gutenberg's cleanForSlug (in wp.url) replaces dots with dashes,
+ * which breaks SPDX identifiers like "Apache-2.0". This script:
+ *
+ * 1. Watches title changes via wp.data.subscribe and corrects the
+ *    slug when the title contains dots.
+ * 2. Listens for focusout on the slug input (capture phase) to
+ *    preserve dots when a user manually edits the slug.
+ *
+ * This only runs on the license post-type editor screen (enqueue
+ * is gated in PHP), so other post types are unaffected.
+ */
+( function() {
+	var data = window.wp && window.wp.data;
+	if ( ! data ) {
+		return;
+	}
+
+	var lastTitle = '';
+	var lastSlug = '';
+	var isUpdating = false;
+	var pendingDottedSlug = '';
+
+	/**
+	 * Sanitize a string into a slug while preserving dots.
+	 *
+	 * @param {string} raw The raw string to slugify.
+	 * @return {string} The slugified string with dots intact.
+	 */
+	function slugifyWithDots( raw ) {
+		return raw
+			.toLowerCase()
+			.replace( / |–|—/g, '-' )
+			.replace( /[^\w.\s-]/g, '' )
+			.replace( /[\s]+/g, '-' )
+			.replace( /-+/g, '-' )
+			.replace( /(^-+)|(-+$)/g, '' );
+	}
+
+	/*
+	 * Capture-phase focusout on the document.
+	 *
+	 * Fires before React's synthetic onBlur, so we can read the raw
+	 * input value (with dots) before cleanForSlug strips them.
+	 * After a short delay (to let Gutenberg commit its sanitized slug),
+	 * we overwrite the store with the dotted version.
+	 */
+	document.addEventListener( 'focusout', function( e ) {
+		var target = e.target;
+		if ( ! target || 'INPUT' !== target.tagName ) {
+			return;
+		}
+
+		var urlWrapper = target.closest( '.editor-post-url__input' );
+		if ( ! urlWrapper ) {
+			return;
+		}
+
+		var val = target.value || '';
+		if ( val.indexOf( '.' ) === -1 ) {
+			return;
+		}
+
+		pendingDottedSlug = slugifyWithDots( val );
+
+		// Let Gutenberg commit its sanitized version, then overwrite.
+		setTimeout( function() {
+			if ( ! pendingDottedSlug ) {
+				return;
+			}
+			isUpdating = true;
+			data.dispatch( 'core/editor' ).editPost( { slug: pendingDottedSlug } );
+			isUpdating = false;
+			lastSlug = pendingDottedSlug;
+			pendingDottedSlug = '';
+		}, 100 );
+	}, true );
+
+	/*
+	 * Store subscriber: fix title-driven slug generation.
+	 *
+	 * When the title changes and contains a dot, Gutenberg generates
+	 * a slug via cleanForSlug which strips the dot. We detect this
+	 * and dispatch the corrected dotted slug.
+	 */
+	data.subscribe( function() {
+		if ( isUpdating ) {
+			return;
+		}
+
+		var editor = data.select( 'core/editor' );
+		if ( ! editor ) {
+			return;
+		}
+
+		var title = editor.getEditedPostAttribute( 'title' ) || '';
+		var slug = editor.getEditedPostAttribute( 'slug' ) || '';
+
+		// Title changed and contains a dot — fix the slug.
+		if ( title !== lastTitle && title.indexOf( '.' ) !== -1 ) {
+			lastTitle = title;
+
+			var dottedSlug = slugifyWithDots( title );
+
+			if ( slug !== dottedSlug && dottedSlug.indexOf( '.' ) !== -1 ) {
+				isUpdating = true;
+				data.dispatch( 'core/editor' ).editPost( { slug: dottedSlug } );
+				isUpdating = false;
+				lastSlug = dottedSlug;
+				return;
+			}
+		}
+
+		lastTitle = title;
+		lastSlug = slug;
+	} );
+}() );

plugins/osi-features/inc/classes/post-types/class-post-type-license.php

@@ -52,6 +52,9 @@ protected function setup_hooks() {
 		add_action( 'save_post_' . self::SLUG, array( $this, 'clear_slug_cache' ) );
 		add_action( 'before_delete_post', array( $this, 'clear_slug_cache' ) );
 		add_action( 'wp_trash_post', array( $this, 'clear_slug_cache' ) );
+
+		// Gutenberg: override cleanForSlug to preserve dots in the editor UI.
+		add_action( 'enqueue_block_editor_assets', array( $this, 'enqueue_editor_slug_script' ) );
 	}
 
 	/**
@@ -163,13 +166,13 @@ public function restore_dots_on_query( string $title, string $raw_title, string
 
 		// Check if a license post with this dotted slug exists.
 		global $wpdb;
-		$exists = (bool) $wpdb->get_var(
+		$exists = $wpdb->get_var(
 			$wpdb->prepare(
 				"SELECT ID FROM {$wpdb->posts} WHERE post_name = %s AND post_type = %s LIMIT 1",
 				$dotted_slug,
 				self::SLUG
 			)
-		);
+		) ? 1 : 0;
 
 		wp_cache_set( $cache_key, $exists, self::CACHE_GROUP );
 
@@ -197,6 +200,29 @@ public function clear_slug_cache( int $post_id ) {
 		wp_cache_delete( $cache_key, self::CACHE_GROUP );
 	}
 
+	/**
+	 * Enqueue the Gutenberg slug override script on the license editor screen.
+	 *
+	 * Subscribes to the editor data store and restores dots in the slug
+	 * when the post title contains dots (e.g., SPDX identifiers).
+	 *
+	 * @return void
+	 */
+	public function enqueue_editor_slug_script() {
+		$screen = get_current_screen();
+		if ( ! $screen || self::SLUG !== $screen->post_type ) {
+			return;
+		}
+
+		wp_enqueue_script(
+			'osi-license-slug-dots',
+			OSI_URL . '/assets/src/js/license-slug-dots.js',
+			array( 'wp-data', 'wp-editor' ),
+			filemtime( OSI_PATH . '/assets/src/js/license-slug-dots.js' ),
+			true
+		);
+	}
+
 	/**
 	 * Sanitize a string as a slug while preserving dots.
 	 *