Integration branch: Sidebar Metabox

.babelrc

@@ -0,0 +1,11 @@
+{
+	"presets": [
+		"@babel/preset-env",
+		[
+			"@babel/preset-react",
+			{
+				"runtime": "automatic"
+			}
+		]
+	]
+}

.eslintrc

@@ -3,12 +3,28 @@
 	"env": {
 		"browser": true,
 		"node": false,
-		"jest": true,
+		"jest": true
 	},
 	"globals": {
 		"wp": true,
 		"jQuery": true,
 		"edac_script_vars": true,
 		"ajaxurl": true
-	}
+	},
+	"overrides": [
+		{
+			"files": [ "src/sidebar/**/*.js", "src/sidebar/**/*.jsx", "src/issueModal/**/*.js", "src/issueModal/**/*.jsx" ],
+			"plugins": [ "react" ],
+			"parserOptions": {
+				"ecmaVersion": 2021,
+				"sourceType": "module",
+				"ecmaFeatures": {
+					"jsx": true
+				}
+			},
+			"rules": {
+				"react/jsx-uses-vars": "error"
+			}
+		}
+	]
 }

accessibility-checker.php

@@ -41,7 +41,7 @@
 
 // Current database version.
 if ( ! defined( 'EDAC_DB_VERSION' ) ) {
-	define( 'EDAC_DB_VERSION', '1.0.4' );
+	define( 'EDAC_DB_VERSION', '1.0.6' );
 }
 
 // Plugin Folder Path.

admin/class-ajax.php

@@ -33,7 +33,6 @@ public function init_hooks() {
 		add_action( 'wp_ajax_edac_details_ajax', [ $this, 'details' ] );
 		add_action( 'wp_ajax_edac_readability_ajax', [ $this, 'readability' ] );
 		add_action( 'wp_ajax_edac_insert_ignore_data', [ $this, 'add_ignore' ] );
-		add_action( 'wp_ajax_edac_update_simplified_summary', [ $this, 'simplified_summary' ] );
 		add_action( 'wp_ajax_edac_dismiss_welcome_cta_ajax', [ $this, 'dismiss_welcome_cta' ] );
 		add_action( 'wp_ajax_edac_dismiss_dashboard_cta_ajax', [ $this, 'dismiss_dashboard_cta' ] );
 		( new Email_Opt_In() )->register_ajax_handlers();
@@ -775,48 +774,6 @@ function ( $value ) {
 		wp_send_json_success( wp_json_encode( $data ) );
 	}
 
-	/**
-	 * Update simplified summary
-	 *
-	 * @return void
-	 *
-	 *  - '-1' means that nonce could not be varified
-	 *  - '-2' means that the post ID was not specified
-	 *  - '-3' means that the summary was not specified
-	 *  - '-5' means that the user does not have permission to view this information for this post
-	 */
-	public function simplified_summary() {
-
-			// nonce security.
-		if ( ! isset( $_REQUEST['nonce'] ) || ! wp_verify_nonce( sanitize_key( wp_unslash( $_REQUEST['nonce'] ) ), 'ajax-nonce' ) ) {
-			wp_send_json_error( new \WP_Error( '-1', __( 'Permission Denied', 'accessibility-checker' ) ) );
-		}
-
-		if ( ! isset( $_REQUEST['post_id'] ) ) {
-			wp_send_json_error( new \WP_Error( '-2', __( 'The post ID was not set', 'accessibility-checker' ) ) );
-		}
-
-		if ( ! isset( $_REQUEST['summary'] ) ) {
-			wp_send_json_error( new \WP_Error( '-3', __( 'The summary was not set', 'accessibility-checker' ) ) );
-		}
-
-		if ( ! current_user_can( 'edit_post', (int) $_REQUEST['post_id'] ) ) {
-			wp_send_json_error( new \WP_Error( '-5', __( 'You do not have permission to edit this post.', 'accessibility-checker' ) ) );
-		}
-
-		$post_id = (int) $_REQUEST['post_id'];
-		update_post_meta(
-			$post_id,
-			'_edac_simplified_summary',
-			sanitize_text_field( wp_unslash( $_REQUEST['summary'] ) )
-		);
-
-		$edac_simplified_summary = get_post_meta( $post_id, '_edac_simplified_summary', $single = true );
-		$simplified_summary      = $edac_simplified_summary ? $edac_simplified_summary : '';
-
-		wp_send_json_success( wp_json_encode( $simplified_summary ) );
-	}
-
 	/**
 	 * Handle AJAX request to dismiss Welcome CTA
 	 *

admin/class-enqueue-admin.php

@@ -28,6 +28,8 @@ public function __construct() {
 	public static function enqueue() {
 		self::enqueue_styles();
 		self::maybe_enqueue_admin_and_editor_app_scripts();
+		self::maybe_enqueue_sidebar_script();
+		self::maybe_enqueue_issue_modal_script();
 		self::maybe_enqueue_email_opt_in_script();
 	}
 
@@ -49,7 +51,8 @@ public static function maybe_enqueue_admin_and_editor_app_scripts() {
 
 		global $pagenow;
 		$post_types        = Settings::get_scannable_post_types();
-		$current_post_type = get_post_type();
+		$has_post_types    = is_array( $post_types ) && count( $post_types );
+		$is_scannable_post = Helpers::is_current_post_type_scannable( $post_types );
 		$page              = self::get_current_page_slug();
 		$enabled_pages     = apply_filters(
 			'edac_filter_admin_scripts_slugs',
@@ -63,10 +66,9 @@ public static function maybe_enqueue_admin_and_editor_app_scripts() {
 
 		if (
 			(
-				is_array( $post_types ) &&
-				count( $post_types ) &&
+				$has_post_types &&
 				(
-					in_array( $current_post_type, $post_types, true ) ||
+					$is_scannable_post ||
 					in_array( $page, $enabled_pages, true )
 				)
 			) ||
@@ -93,9 +95,7 @@ public static function maybe_enqueue_admin_and_editor_app_scripts() {
 			if ( 'post.php' === $pagenow || 'post-new.php' === $pagenow ) {
 
 				// Is this posttype setup to be checked?
-				$post_types        = Settings::get_scannable_post_types();
-				$current_post_type = get_post_type();
-				$active            = ( is_array( $post_types ) && in_array( $current_post_type, $post_types, true ) );
+				$active = $is_scannable_post;
 
 				$pro = defined( 'EDACP_VERSION' ) && EDAC_KEY_VALID;
 
@@ -149,6 +149,131 @@ public static function maybe_enqueue_admin_and_editor_app_scripts() {
 		}
 	}
 
+	/**
+	 * Enqueue the Gutenberg sidebar script.
+	 *
+	 * @return void
+	 */
+	public static function maybe_enqueue_sidebar_script() {
+		global $pagenow;
+
+		// Only load on post edit screens.
+		if ( 'post.php' !== $pagenow && 'post-new.php' !== $pagenow ) {
+			return;
+		}
+
+		if ( ! Helpers::is_block_editor() ) {
+			return;
+		}
+
+		// Check if this post type is scannable.
+		$post_types = Settings::get_scannable_post_types();
+		if ( ! Helpers::is_current_post_type_scannable( $post_types ) ) {
+			return;
+		}
+
+		// Enqueue the sidebar script with WordPress dependencies.
+		wp_enqueue_script(
+			'edac-sidebar',
+			plugin_dir_url( EDAC_PLUGIN_FILE ) . 'build/sidebar.bundle.js',
+			[
+				'wp-plugins',
+				'wp-edit-post',
+				'wp-editor',
+				'wp-element',
+				'wp-data',
+				'wp-i18n',
+				'wp-api-fetch',
+				'wp-components',
+			],
+			EDAC_VERSION,
+			false
+		);
+
+		// Set translations for the sidebar.
+		wp_set_script_translations( 'edac-sidebar', 'accessibility-checker', plugin_dir_path( EDAC_PLUGIN_FILE ) . 'languages' );
+
+		// Localize script with necessary data.
+		wp_localize_script(
+			'edac-sidebar',
+			'edac_sidebar_app',
+			[
+				'gutenbergEnabled'    => true,
+				'postID'              => get_the_ID(),
+				'highlightNonce'      => wp_create_nonce( 'edac_highlight' ),
+				'ajaxNonce'           => wp_create_nonce( 'ajax-nonce' ),
+				'ajaxUrl'             => admin_url( 'admin-ajax.php' ),
+				'edacApiUrl'          => esc_url_raw( rest_url() . 'accessibility-checker/v1' ),
+				'settingsUrl'         => esc_url_raw( admin_url( 'admin.php?page=accessibility_checker_settings' ) ),
+				'canManageSettings'   => current_user_can( apply_filters( 'edac_filter_settings_capability', 'manage_options' ) ),
+				'readabilityHelpUrl'  => esc_url_raw( edac_link_wrapper( 'https://a11ychecker.com/help3265', 'wordpress-general', 'content-analysis-sidebar', false ) ),
+				'manuallyTestHelpUrl' => esc_url_raw( edac_link_wrapper( 'https://a11ychecker.com/help4280', 'wordpress-general', 'content-analysis-sidebar', false ) ),
+			]
+		);
+
+		// Enqueue sidebar styles.
+		wp_enqueue_style(
+			'edac-sidebar',
+			plugin_dir_url( EDAC_PLUGIN_FILE ) . 'build/css/sidebar.css',
+			[],
+			EDAC_VERSION,
+			'all'
+		);
+
+		// Enqueue CodeMirror for HTML syntax highlighting in the issue modal.
+		wp_enqueue_code_editor( [ 'type' => 'text/html' ] );
+	}
+
+	/**
+	 * Enqueue the issue modal bundle (used in sidebar and other admin areas).
+	 *
+	 * @return void
+	 */
+	public static function maybe_enqueue_issue_modal_script() {
+		global $pagenow;
+
+		// Only load on post edit screens where the sidebar is active.
+		if ( 'post.php' !== $pagenow && 'post-new.php' !== $pagenow ) {
+			return;
+		}
+
+		// Check if this post type is scannable.
+		$post_types = Settings::get_scannable_post_types();
+		if ( ! Helpers::is_current_post_type_scannable( $post_types ) ) {
+			return;
+		}
+
+		// Enqueue the issue modal script with WordPress dependencies.
+		wp_enqueue_script(
+			'edac-issue-modal',
+			plugin_dir_url( EDAC_PLUGIN_FILE ) . 'build/issueModal.bundle.js',
+			[
+				'wp-element',
+				'wp-components',
+				'wp-i18n',
+				'wp-api-fetch',
+				'wp-html-entities',
+			],
+			EDAC_VERSION,
+			true
+		);
+
+		// Set translations for the issue modal.
+		wp_set_script_translations( 'edac-issue-modal', 'accessibility-checker', plugin_dir_path( EDAC_PLUGIN_FILE ) . 'languages' );
+
+		// Enqueue issue modal styles.
+		wp_enqueue_style(
+			'edac-issue-modal',
+			plugin_dir_url( EDAC_PLUGIN_FILE ) . 'build/css/issueModal.css',
+			[ 'wp-components' ],
+			EDAC_VERSION,
+			'all'
+		);
+
+		// Enqueue CodeMirror for HTML syntax highlighting.
+		wp_enqueue_code_editor( [ 'type' => 'text/html' ] );
+	}
+
 	/**
 	 * Enqueue the email opt-in script on the welcome page.
 	 *
@@ -170,6 +295,7 @@ public static function maybe_enqueue_email_opt_in_script() {
 		$email_opt_in->enqueue_scripts();
 	}
 
+
 	/**
 	 * Gets the current admin page slug.
 	 *

admin/class-helpers.php

@@ -228,4 +228,35 @@ public static function current_user_can_see_widgets_and_notices(): bool {
 		 */
 		return current_user_can( apply_filters( 'edac_filter_dashboard_widget_capability', 'edit_posts' ) );
 	}
+
+	/**
+	 * Determine if the current post type is scannable.
+	 *
+	 * @param array $post_types List of scannable post types (optional).
+	 * @return bool
+	 */
+	public static function is_current_post_type_scannable( array $post_types = [] ): bool {
+		if ( empty( $post_types ) ) {
+			$post_types = Settings::get_scannable_post_types();
+		}
+
+		$current_post_type = get_post_type();
+
+		return is_array( $post_types ) && in_array( $current_post_type, $post_types, true );
+	}
+
+	/**
+	 * Check whether the current screen is using the block editor.
+	 *
+	 * @return bool
+	 */
+	public static function is_block_editor(): bool {
+		if ( ! function_exists( 'get_current_screen' ) ) {
+			return false;
+		}
+
+		$screen = get_current_screen();
+
+		return $screen && method_exists( $screen, 'is_block_editor' ) && $screen->is_block_editor();
+	}
 }

admin/class-insert-rule-data.php

@@ -154,10 +154,26 @@ public function insert( object $post, string $rule, string $ruletype, string $ru
 				'ignre'             => absint( $rule_data['ignre'] ),
 				'ignre_user'        => isset( $rule_data['ignre_user'] ) ? absint( $rule_data['ignre_user'] ) : null,
 				'ignre_date'        => isset( $rule_data['ignre_date'] ) ? sanitize_text_field( $rule_data['ignre_date'] ) : null,
-				'ignre_comment'     => isset( $rule_data['ignre_comment'] ) ? sanitize_text_field( $rule_data['ignre_comment'] ) : null,
+				'ignre_comment'     => isset( $rule_data['ignre_comment'] ) ? null : null,
 				'ignre_global'      => absint( $rule_data['ignre_global'] ),
 			];
 
+			if ( isset( $rule_data['ignre_comment'] ) ) {
+				$allowed_html = [
+					'strong' => [],
+					'b'      => [],
+					'em'     => [],
+					'i'      => [],
+					'a'      => [
+						'href'   => true,
+						'target' => true,
+						'rel'    => true,
+					],
+				];
+
+				$rule_data_sanitized['ignre_comment'] = esc_html( wp_kses( $rule_data['ignre_comment'], $allowed_html ) );
+			}
+
 			// phpcs:ignore WordPress.DB.DirectDatabaseQuery.DirectQuery -- Using direct query for adding data to database.
 			$wpdb->insert( $table_name, $rule_data_sanitized );
 

admin/class-update-database.php

@@ -66,6 +66,7 @@ public function edac_update_database() {
 				ignre_global mediumint(9) NOT NULL,
 				ignre_user bigint(20) NULL,
 				ignre_date timestamp NULL,
+				ignre_reason varchar(50) NULL,
 				ignre_comment mediumtext NULL,
 				PRIMARY KEY (id),
 				KEY postid_index (postid)