Merge pull request #57 from Automattic/release/1.5.1

Author: GaryJones

CHANGELOG.md

@@ -4,6 +4,16 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+## [1.5.1] - 2025-10-14
+
+### Fixed
+
+- fix: implicitly marking parameter as nullable is deprecated by @sjinks in https://github.com/Automattic/Rewrite-Rules-Inspector/pull/55
+
+### Changed
+
+- refactor: Update UI to use tabs navigation by @GaryJones in https://github.com/Automattic/Rewrite-Rules-Inspector/pull/56
+
 ## [1.5.0] - 2025-10-14
 
 ### Added
@@ -71,6 +81,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - Filter by different sources of rewrite rules.
 - An error message appears if rewrite rules are missing in the database.
 
+[1.5.1]: https://github.com/Automattic/Rewrite-Rules-Inspector/compare/1.5.0...1.5.1
 [1.5.0]: https://github.com/Automattic/Rewrite-Rules-Inspector/compare/1.4.0...1.5.0
 [1.4.0]: https://github.com/Automattic/Rewrite-Rules-Inspector/compare/1.3.1...1.4.0
 [1.3.1]: https://github.com/Automattic/Rewrite-Rules-Inspector/compare/1.3.0...1.3.1

README.md

@@ -1,6 +1,6 @@
 # Rewrite Rules Inspector
 
-Stable tag: 1.5.0  
+Stable tag: 1.5.1  
 Requires at least: 5.9  
 Tested up to: 6.8  
 Requires PHP: 7.4  

assets/css/admin.css

@@ -34,33 +34,11 @@
 }
 
 /* ==========================================================================
-   Navigation and Jump Links
+   Tabs
    ========================================================================== */
-
-.jump-link {
-	display: inline-block;
-	margin-left: var(--rri-spacing-sm);
-	padding: 1px 4px;
-	background: transparent;
-	border: none;
-	border-radius: 2px;
-	text-decoration: none;
-	color: #666;
-	font-size: 12px;
-	font-weight: normal;
-	transition: color 0.15s ease;
-}
-
-.jump-link:hover,
-.jump-link:focus {
-	color: var(--rri-primary-color);
-	text-decoration: none;
-	background: transparent;
-}
-
-.jump-link:focus {
-	outline: 1px solid var(--rri-primary-color);
-	outline-offset: 1px;
+/* WordPress provides base styles for .nav-tab-wrapper and .nav-tab */
+.nav-tab-wrapper {
+	margin-bottom: 12px;
 }
 
 /* ==========================================================================
@@ -144,9 +122,22 @@
 .custom-tablenav-top .tablenav-actions {
 	float: right;
 	display: flex;
+	align-items: center;
 	gap: var(--rri-spacing-sm);
 }
 
+.rri-rules-count {
+	color: #666;
+	font-size: 13px;
+	margin-right: var(--rri-spacing-sm);
+}
+
+/* Priority column should be narrow */
+.column-priority {
+	width: 60px;
+	text-align: center;
+}
+
 .custom-tablenav-top form {
 	display: inline-block;
 	margin-right: var(--rri-spacing-md);
@@ -247,11 +238,6 @@
 		padding: 2px 4px;
 	}
 
-	.jump-link {
-		display: inline-block;
-		margin-left: var(--rri-spacing-sm);
-		margin-top: 0;
-	}
 }
 
 @media (max-width: 600px) {
@@ -352,6 +338,29 @@
 	border-radius: 4px;
 }
 
+/* Notices kept inside the tab content to avoid core relocation */
+.rri-notice {
+    /* Match core .notice spacing */
+    margin: 5px 0 15px;
+    padding: 12px;
+    background: #fff;
+    border-left: 4px solid #72aee6; /* info color default */
+    box-shadow: 0 1px 1px rgba(0,0,0,.04);
+    color: #1d2327;
+}
+
+.rri-notice p {
+    margin: .5em 0;
+}
+
+.rri-notice-success {
+    border-left-color: #46b450; /* core success */
+}
+
+.rri-notice-error {
+    border-left-color: #dc3232; /* core error */
+}
+
 .rri-url-test-results h3 {
 	margin-top: 0;
 	color: #23282d;

assets/js/admin.js

@@ -12,76 +12,18 @@
 	 * Initialize admin functionality when document is ready.
 	 */
 	$(document).ready(function() {
-		initSmoothScrolling();
 		initAccessibilityEnhancements();
 	});
 
-	/**
-	 * Initialize smooth scrolling for jump links.
-	 */
-	function initSmoothScrolling() {
-		// Check if user prefers reduced motion.
-		const prefersReducedMotion = window.matchMedia('(prefers-reduced-motion: reduce)').matches;
-		
-		if (prefersReducedMotion) {
-			return; // Skip smooth scrolling if user prefers reduced motion.
-		}
-
-		// Handle jump link clicks.
-		$('.jump-link').on('click', function(e) {
-			const href = $(this).attr('href');
-			
-			// Only handle internal anchor links.
-			if (href && href.startsWith('#')) {
-				e.preventDefault();
-				
-				const target = $(href);
-				if (target.length) {
-					// Calculate offset for WordPress admin toolbar.
-					const adminBarHeight = $('#wpadminbar').length ? $('#wpadminbar').outerHeight() : 0;
-					const offset = adminBarHeight + 20; // 20px additional spacing
-					
-					// Smooth scroll to target.
-					$('html, body').animate({
-						scrollTop: target.offset().top - offset
-					}, 500, 'swing');
-					
-					// Add focus to target for accessibility.
-					target.focus();
-					
-					// Add a temporary highlight effect (subtle).
-					target.addClass('rri-highlight');
-					setTimeout(function() {
-						target.removeClass('rri-highlight');
-					}, 1500);
-				}
-			}
-		});
-	}
 
 	/**
 	 * Initialize accessibility enhancements.
 	 */
 	function initAccessibilityEnhancements() {
-		// Add keyboard navigation support for jump links.
-		$('.jump-link').on('keydown', function(e) {
-			// Handle Enter and Space key presses.
-			if (e.which === 13 || e.which === 32) { // Enter or Space
-				e.preventDefault();
-				$(this).click();
-			}
-		});
-
 		// Add ARIA live region for dynamic content updates.
 		if (!$('#rri-live-region').length) {
 			$('body').append('<div id="rri-live-region" class="screen-reader-text" aria-live="polite" aria-atomic="true"></div>');
 		}
-
-		// Announce section changes when jumping.
-		$('.jump-link').on('click', function() {
-			const targetText = $(this).text();
-			$('#rri-live-region').text('Navigated to ' + targetText);
-		});
 	}
 
 	/**
@@ -97,38 +39,4 @@
 		);
 	}
 
-	/**
-	 * Add scroll spy functionality for better navigation.
-	 */
-	function initScrollSpy() {
-		const sections = $('.rri-section h2[id]');
-		
-		if (sections.length < 2) {
-			return; // No need for scroll spy with less than 2 sections.
-		}
-
-		$(window).on('scroll', function() {
-			let current = '';
-			
-			sections.each(function() {
-				if (isInViewport(this)) {
-					current = $(this).attr('id');
-				}
-			});
-			
-			// Update active state of jump links.
-			$('.jump-link').removeClass('rri-active');
-			if (current) {
-				$('.jump-link[href="#' + current + '"]').addClass('rri-active');
-			}
-		});
-	}
-
-	// Initialize scroll spy if there are multiple sections.
-	$(document).ready(function() {
-		if ($('.rri-section').length > 1) {
-			initScrollSpy();
-		}
-	});
-
 })(jQuery);