From 760985a7cd5f8baef0095ad749b8a2c68e0a6e16 Mon Sep 17 00:00:00 2001 From: Felipe Elia Date: Wed, 13 Sep 2023 18:01:42 -0300 Subject: [PATCH 1/4] Add support to Query Monitor --- assets/css/main.css | 35 ++++++--- classes/CommonPanel.php | 78 ++++++++++++++++++++ classes/EP_Debug_Bar_ElasticPress.php | 29 +++----- classes/QueryMonitorCollector.php | 23 ++++++ classes/QueryMonitorOutput.php | 101 ++++++++++++++++++++++++++ debug-bar-elasticpress.php | 45 +++++++++++- 6 files changed, 281 insertions(+), 30 deletions(-) create mode 100644 classes/CommonPanel.php create mode 100644 classes/QueryMonitorCollector.php create mode 100644 classes/QueryMonitorOutput.php diff --git a/assets/css/main.css b/assets/css/main.css index 1d27389..f8f5d42 100755 --- a/assets/css/main.css +++ b/assets/css/main.css @@ -69,17 +69,14 @@ clear: left; } -#query-monitor-main .qm-debug-bar { - margin: 20px; -} - /* stylelint-disable selector-id-pattern */ /* The giant list of selectors here is needed to * override QM's important rules */ #debug-menu-target-EP_Debug_Bar_ElasticPress .button, -#debug-menu-target-EP_Debug_Bar_ElasticPress a.button { +#debug-menu-target-EP_Debug_Bar_ElasticPress a.button, +#qm-elasticpress .button { background: #f6f7f7 !important; border: 1px solid #2271b1 !important; border-radius: 3px !important; @@ -97,7 +94,7 @@ } #debug-menu-target-EP_Debug_Bar_ElasticPress .button:hover, -#query-monitor-main #qm-debug_bar_ep_debug_bar_elasticpress .button:hover { +#query-monitor-main #qm-elasticpress .button:hover { background: #f0f0f1; border-color: #0a4b78; color: #0a4b78 !important; @@ -105,29 +102,47 @@ } #debug-menu-target-EP_Debug_Bar_ElasticPress .button:active, -#query-monitor-main #qm-debug_bar_ep_debug_bar_elasticpress .button:hover { +#query-monitor-main #qm-elasticpress .button:hover { background: #f6f7f7 !important; border-color: #8c8f94 !important; box-shadow: none; } -#debug-menu-target-EP_Debug_Bar_ElasticPress .button:focus { +#debug-menu-target-EP_Debug_Bar_ElasticPress .button:focus, +#query-monitor-main #qm-elasticpress .button:focus { outline: none; } /* Overriding some Debug Bar "important" rules */ #debug-menu-target-EP_Debug_Bar_ElasticPress .button-primary, #debug-menu-target-EP_Debug_Bar_ElasticPress a.button-primary, -#debug-menu-target-EP_Debug_Bar_ElasticPress button.button-primary { +#debug-menu-target-EP_Debug_Bar_ElasticPress button.button-primary, +#query-monitor-main #qm-elasticpress .button-primary { background: #007cba !important; border: 1px solid #007cba !important; color: #fff !important; } #debug-menu-target-EP_Debug_Bar_ElasticPress a.button-primary:hover, -#debug-menu-target-EP_Debug_Bar_ElasticPress a.button-primary:focus { +#debug-menu-target-EP_Debug_Bar_ElasticPress a.button-primary:focus, +#query-monitor-main #qm-elasticpress a.button-primary:hover, +#query-monitor-main #qm-elasticpress a.button-primary:focus { + background: #007cba !important; color: #fff !important; text-decoration: none !important; } +#query-monitor-main #qm-elasticpress h3, +#query-monitor-main #qm-elasticpress p { + margin: 0 !important; + padding: 0 !important; + text-align: center !important; +} + +#query-monitor-main #qm-elasticpress li { + border-top: 1px solid var(--qm-panel-separator) !important; + line-height: 20px !important; + padding: 20px 0 !important; +} + /* stylelint-enable selector-id-pattern */ diff --git a/classes/CommonPanel.php b/classes/CommonPanel.php new file mode 100644 index 0000000..af1142e --- /dev/null +++ b/classes/CommonPanel.php @@ -0,0 +1,78 @@ +title = esc_html__( 'ElasticPress', 'debug-bar-elasticpress' ); + } + + /** + * Enqueue assets + */ + public function enqueue_assets() { + add_action( 'wp_enqueue_scripts', array( $this, 'enqueue_scripts_styles' ) ); + add_action( 'admin_enqueue_scripts', array( $this, 'enqueue_scripts_styles' ) ); + } + + /** + * Return the panel title + * + * @return string + */ + public function get_title() : string { + return $this->title; + } + /** + * Enqueue scripts for front end and admin + */ + public function enqueue_scripts_styles() { + if ( ! is_user_logged_in() ) { + return; + } + + wp_enqueue_script( 'debug-bar-elasticpress', EP_DEBUG_URL . 'assets/js/main.js', array( 'wp-dom-ready', 'clipboard' ), EP_DEBUG_VERSION, true ); + wp_enqueue_style( 'debug-bar-elasticpress', EP_DEBUG_URL . 'assets/css/main.css', array(), EP_DEBUG_VERSION ); + } + + /** + * Show the contents of the panel + */ + public function render() { + $queries = \ElasticPress\Elasticsearch::factory()->get_query_log(); + + if ( function_exists( '\ElasticPress\Utils\is_indexing' ) && \ElasticPress\Utils\is_indexing() ) { + ?> +
+ +
+ render_buttons(); + $debug_bar_output->render_additional_buttons(); + $debug_bar_output->render_queries(); + } +} diff --git a/classes/EP_Debug_Bar_ElasticPress.php b/classes/EP_Debug_Bar_ElasticPress.php index 61d3e5c..6536290 100755 --- a/classes/EP_Debug_Bar_ElasticPress.php +++ b/classes/EP_Debug_Bar_ElasticPress.php @@ -24,26 +24,28 @@ class EP_Debug_Bar_ElasticPress extends \Debug_Bar_Panel { */ public $title; + /** + * Common panel instance + * + * @var \DebugBarElasticPress\CommonPanel + */ + protected $common_panel; + /** * Initial debug bar stuff */ public function init() { $this->title( esc_html__( 'ElasticPress', 'debug-bar-elasticpress' ) ); - add_action( 'wp_enqueue_scripts', array( $this, 'enqueue_scripts_styles' ) ); - add_action( 'admin_enqueue_scripts', array( $this, 'enqueue_scripts_styles' ) ); + $this->common_panel = \DebugBarElasticPress\get_common_panel(); + $this->common_panel->enqueue_assets(); } /** * Enqueue scripts for front end and admin */ public function enqueue_scripts_styles() { - if ( ! is_user_logged_in() ) { - return; - } - - wp_enqueue_script( 'debug-bar-elasticpress', EP_DEBUG_URL . 'assets/js/main.js', array( 'wp-dom-ready', 'clipboard' ), EP_DEBUG_VERSION, true ); - wp_enqueue_style( 'debug-bar-elasticpress', EP_DEBUG_URL . 'assets/css/main.css', array(), EP_DEBUG_VERSION ); + _deprecated_function( __METHOD__, '3.1.0', 'DebugBarElasticPress\EP_Panel::enqueue_scripts_styles()' ); } /** @@ -85,16 +87,7 @@ public function render() { ?> - -
- -
- - render_buttons(); - $debug_bar_output->render_additional_buttons(); - $debug_bar_output->render_queries(); + $this->common_panel->render(); } } diff --git a/classes/QueryMonitorCollector.php b/classes/QueryMonitorCollector.php new file mode 100644 index 0000000..0e177ce --- /dev/null +++ b/classes/QueryMonitorCollector.php @@ -0,0 +1,23 @@ +common_panel = \DebugBarElasticPress\get_common_panel(); + + add_filter( 'qm/output/menus', [ $this, 'admin_menu' ] ); + } + + /** + * Panel title + * + * @return string + */ + public function name() : string { + return $this->common_panel->get_title(); + } + + /** + * Echoes the output + * + * @return void + */ + public function output() { + ?> +
+ render_summary(); ?> + common_panel->render(); ?> +
+ get_query_log(); + $total_query_time = 0; + + foreach ( $queries as $query ) { + if ( ! empty( $query['time_start'] ) && ! empty( $query['time_finish'] ) ) { + $total_query_time += ( $query['time_finish'] - $query['time_start'] ); + } + } + ?> +
+
+

+ +

+

+
+
+

+ +

+

+ +

+
+
+ get( 'post' )->get( get_the_ID() ); } + +/** + * Include our QM Output + * + * @since 3.1.0 + * @param array $output Array of registered output + * @return array + */ +function register_qm_output( $output ) { + $collector = \QM_Collectors::get( 'elasticpress' ); + + if ( $collector ) { + $output['elasticpress'] = new QueryMonitorOutput( $collector ); + } + + return $output; +} From 12560aac304b5ee3c472be57dbaf1d8bc0724d77 Mon Sep 17 00:00:00 2001 From: Felipe Elia Date: Thu, 14 Sep 2023 09:18:30 -0300 Subject: [PATCH 2/4] Adjust styles --- assets/css/main.css | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/assets/css/main.css b/assets/css/main.css index f8f5d42..ea39970 100755 --- a/assets/css/main.css +++ b/assets/css/main.css @@ -5,6 +5,10 @@ padding: 0.5em 10px; } +.ep-queries-debug pre { + padding: 10px; +} + .ep-queries-debug .dashicons { cursor: pointer; } From 1b8726dae63cee8591463c26b4ec35ba058b533a Mon Sep 17 00:00:00 2001 From: Felipe Elia Date: Thu, 14 Sep 2023 09:21:11 -0300 Subject: [PATCH 3/4] Simplify assets enqueue --- classes/CommonPanel.php | 8 -------- classes/EP_Debug_Bar_ElasticPress.php | 2 +- classes/QueryLog.php | 27 +++++++++++++++++++++++++-- debug-bar-elasticpress.php | 2 +- 4 files changed, 27 insertions(+), 12 deletions(-) diff --git a/classes/CommonPanel.php b/classes/CommonPanel.php index af1142e..bdfd655 100644 --- a/classes/CommonPanel.php +++ b/classes/CommonPanel.php @@ -28,14 +28,6 @@ public function __construct() { $this->title = esc_html__( 'ElasticPress', 'debug-bar-elasticpress' ); } - /** - * Enqueue assets - */ - public function enqueue_assets() { - add_action( 'wp_enqueue_scripts', array( $this, 'enqueue_scripts_styles' ) ); - add_action( 'admin_enqueue_scripts', array( $this, 'enqueue_scripts_styles' ) ); - } - /** * Return the panel title * diff --git a/classes/EP_Debug_Bar_ElasticPress.php b/classes/EP_Debug_Bar_ElasticPress.php index 6536290..a4dd499 100755 --- a/classes/EP_Debug_Bar_ElasticPress.php +++ b/classes/EP_Debug_Bar_ElasticPress.php @@ -38,7 +38,7 @@ public function init() { $this->title( esc_html__( 'ElasticPress', 'debug-bar-elasticpress' ) ); $this->common_panel = \DebugBarElasticPress\get_common_panel(); - $this->common_panel->enqueue_assets(); + $this->common_panel->enqueue_scripts_styles(); } /** diff --git a/classes/QueryLog.php b/classes/QueryLog.php index 7b78b0d..81f2c97 100644 --- a/classes/QueryLog.php +++ b/classes/QueryLog.php @@ -31,6 +31,7 @@ public function setup() { add_action( 'ep_remote_request', array( $this, 'log_query' ), 10, 2 ); add_action( 'admin_init', array( $this, 'action_admin_init' ) ); add_action( 'admin_init', array( $this, 'maybe_clear_log' ) ); + add_action( 'admin_enqueue_scripts', array( $this, 'admin_enqueue_scripts' ) ); /** * Handle query storage as JSON strings. @@ -86,11 +87,18 @@ public function maybe_clear_log() { /** * Add options page * - * @since 1.3 + * @since 1.3 * @return void */ public function action_admin_menu() { - add_submenu_page( 'elasticpress', esc_html__( 'Query Log', 'debug-bar-elasticpress' ), esc_html__( 'Query Log', 'debug-bar-elasticpress' ), 'manage_options', 'ep-query-log', array( $this, 'screen_options' ) ); + add_submenu_page( + 'elasticpress', + esc_html__( 'Query Log', 'debug-bar-elasticpress' ), + esc_html__( 'Query Log', 'debug-bar-elasticpress' ), + 'manage_options', + 'ep-query-log', + array( $this, 'screen_options' ) + ); } /** @@ -394,6 +402,21 @@ public function maybe_add_request_query_type( array $request_args, string $path, return $request_args; } + /** + * Enqueue assets if we are in the correct admin screen + * + * @since 3.1.0 + */ + public function admin_enqueue_scripts() { + $current_screen = get_current_screen(); + + if ( ! isset( $current_screen->id ) || 'elasticpress_page_ep-query-log' !== $current_screen->id ) { + return; + } + + get_common_panel()->enqueue_scripts_styles(); + } + /** * Conditionally add the request type to the request args (for query requests) * diff --git a/debug-bar-elasticpress.php b/debug-bar-elasticpress.php index dfb40aa..8b1baa4 100755 --- a/debug-bar-elasticpress.php +++ b/debug-bar-elasticpress.php @@ -83,7 +83,7 @@ function setup() { if ( class_exists( '\QM_Collectors' ) ) { \QM_Collectors::add( new QueryMonitorCollector() ); add_filter( 'qm/outputter/html', $n( 'register_qm_output' ) ); - add_action( 'qm/output/enqueued-assets', [ get_common_panel(), 'enqueue_assets' ] ); + add_action( 'qm/output/enqueued-assets', [ get_common_panel(), 'enqueue_scripts_styles' ] ); } else { add_filter( 'debug_bar_panels', $n( 'add_debug_bar_panel' ) ); add_filter( 'debug_bar_statuses', $n( 'add_debug_bar_stati' ) ); From e146f0148eea339fd7ee25dcbca2df4d5fd559c0 Mon Sep 17 00:00:00 2001 From: Felipe Elia Date: Thu, 14 Sep 2023 09:30:03 -0300 Subject: [PATCH 4/4] Remove get_common_panel() --- classes/EP_Debug_Bar_ElasticPress.php | 2 +- classes/QueryLog.php | 2 +- classes/QueryMonitorOutput.php | 2 +- debug-bar-elasticpress.php | 18 +----------------- 4 files changed, 4 insertions(+), 20 deletions(-) diff --git a/classes/EP_Debug_Bar_ElasticPress.php b/classes/EP_Debug_Bar_ElasticPress.php index a4dd499..ed0ab2b 100755 --- a/classes/EP_Debug_Bar_ElasticPress.php +++ b/classes/EP_Debug_Bar_ElasticPress.php @@ -37,7 +37,7 @@ class EP_Debug_Bar_ElasticPress extends \Debug_Bar_Panel { public function init() { $this->title( esc_html__( 'ElasticPress', 'debug-bar-elasticpress' ) ); - $this->common_panel = \DebugBarElasticPress\get_common_panel(); + $this->common_panel = new \DebugBarElasticPress\CommonPanel(); $this->common_panel->enqueue_scripts_styles(); } diff --git a/classes/QueryLog.php b/classes/QueryLog.php index 81f2c97..99ca05e 100644 --- a/classes/QueryLog.php +++ b/classes/QueryLog.php @@ -414,7 +414,7 @@ public function admin_enqueue_scripts() { return; } - get_common_panel()->enqueue_scripts_styles(); + ( new CommonPanel() )->enqueue_scripts_styles(); } /** diff --git a/classes/QueryMonitorOutput.php b/classes/QueryMonitorOutput.php index 1d32783..4a211bb 100644 --- a/classes/QueryMonitorOutput.php +++ b/classes/QueryMonitorOutput.php @@ -29,7 +29,7 @@ class QueryMonitorOutput extends \QM_Output_Html { public function __construct( QueryMonitorCollector $collector ) { parent::__construct( $collector ); - $this->common_panel = \DebugBarElasticPress\get_common_panel(); + $this->common_panel = new CommonPanel(); add_filter( 'qm/output/menus', [ $this, 'admin_menu' ] ); } diff --git a/debug-bar-elasticpress.php b/debug-bar-elasticpress.php index 8b1baa4..06a09d8 100755 --- a/debug-bar-elasticpress.php +++ b/debug-bar-elasticpress.php @@ -48,22 +48,6 @@ function( $class ) { } ); -/** - * Get the panel common to both Query Monitor and Debug Bar. - * - * @since 3.1.0 - * @return CommonPanel - */ -function get_common_panel() { - static $common_panel = null; - - if ( ! $common_panel ) { - $common_panel = new CommonPanel(); - } - - return $common_panel; -} - /** * Setup plugin * @@ -83,7 +67,7 @@ function setup() { if ( class_exists( '\QM_Collectors' ) ) { \QM_Collectors::add( new QueryMonitorCollector() ); add_filter( 'qm/outputter/html', $n( 'register_qm_output' ) ); - add_action( 'qm/output/enqueued-assets', [ get_common_panel(), 'enqueue_scripts_styles' ] ); + add_action( 'qm/output/enqueued-assets', [ new CommonPanel(), 'enqueue_scripts_styles' ] ); } else { add_filter( 'debug_bar_panels', $n( 'add_debug_bar_panel' ) ); add_filter( 'debug_bar_statuses', $n( 'add_debug_bar_stati' ) );