From 800cec8d0d1feaa6336b8d21d90006800417875d Mon Sep 17 00:00:00 2001 From: "Barry vd. Heuvel" Date: Tue, 13 Feb 2024 20:05:46 +0100 Subject: [PATCH] Use upstream SQL widget (#1519) * Use upstream widget * Fix version * Remove file --- composer.json | 2 +- src/DataCollector/QueryCollector.php | 2 +- src/JavascriptRenderer.php | 1 - src/Resources/sqlqueries/widget.js | 314 --------------------------- 4 files changed, 2 insertions(+), 317 deletions(-) delete mode 100644 src/Resources/sqlqueries/widget.js diff --git a/composer.json b/composer.json index 96c6f486..9ff594fb 100644 --- a/composer.json +++ b/composer.json @@ -11,7 +11,7 @@ ], "require": { "php": "^8.0", - "maximebf/debugbar": "1.20.x", + "maximebf/debugbar": "~1.20.1", "illuminate/routing": "^9|^10|^11", "illuminate/session": "^9|^10|^11", "illuminate/support": "^9|^10|^11", diff --git a/src/DataCollector/QueryCollector.php b/src/DataCollector/QueryCollector.php index 4e6f2dc9..cd676ce7 100644 --- a/src/DataCollector/QueryCollector.php +++ b/src/DataCollector/QueryCollector.php @@ -666,7 +666,7 @@ public function getWidgets() return [ "queries" => [ "icon" => "database", - "widget" => "PhpDebugBar.Widgets.LaravelSQLQueriesWidget", + "widget" => "PhpDebugBar.Widgets.SQLQueriesWidget", "map" => "queries", "default" => "[]" ], diff --git a/src/JavascriptRenderer.php b/src/JavascriptRenderer.php index 2df32a5c..16e9494b 100644 --- a/src/JavascriptRenderer.php +++ b/src/JavascriptRenderer.php @@ -21,7 +21,6 @@ public function __construct(DebugBar $debugBar, $baseUrl = null, $basePath = nul $this->cssFiles['laravel'] = __DIR__ . '/Resources/laravel-debugbar.css'; $this->cssVendors['fontawesome'] = __DIR__ . '/Resources/vendor/font-awesome/style.css'; - $this->jsFiles['laravel-sql'] = __DIR__ . '/Resources/sqlqueries/widget.js'; $this->jsFiles['laravel-cache'] = __DIR__ . '/Resources/cache/widget.js'; $theme = config('debugbar.theme', 'auto'); diff --git a/src/Resources/sqlqueries/widget.js b/src/Resources/sqlqueries/widget.js deleted file mode 100644 index 4254c943..00000000 --- a/src/Resources/sqlqueries/widget.js +++ /dev/null @@ -1,314 +0,0 @@ -(function ($) { - - var csscls = PhpDebugBar.utils.makecsscls('phpdebugbar-widgets-'); - - /** - * Widget for the displaying sql queries - * - * Options: - * - data - */ - var LaravelSQLQueriesWidget = PhpDebugBar.Widgets.LaravelSQLQueriesWidget = PhpDebugBar.Widget.extend({ - - className: csscls('sqlqueries'), - - onFilterClick: function (el) { - $(el).toggleClass(csscls('excluded')); - - var excludedLabels = []; - this.$toolbar.find(csscls('.filter') + csscls('.excluded')).each(function () { - excludedLabels.push(this.rel); - }); - - this.$list.$el.find("li[connection=" + $(el).attr("rel") + "]").toggle(); - - this.set('exclude', excludedLabels); - }, - - onCopyToClipboard: function (el) { - var code = $(el).parent('li').find('code').get(0); - var copy = function () { - try { - document.execCommand('copy'); - alert('Query copied to the clipboard'); - } catch (err) { - console.log('Oops, unable to copy'); - } - }; - var select = function (node) { - if (document.selection) { - var range = document.body.createTextRange(); - range.moveToElementText(node); - range.select(); - } else if (window.getSelection) { - var range = document.createRange(); - range.selectNodeContents(node); - window.getSelection().removeAllRanges(); - window.getSelection().addRange(range); - } - copy(); - window.getSelection().removeAllRanges(); - }; - select(code); - }, - - render: function () { - this.$status = $('
').addClass(csscls('status')).appendTo(this.$el); - - this.$toolbar = $('
').addClass(csscls('toolbar')).appendTo(this.$el); - - var filters = [], self = this; - - this.$list = new PhpDebugBar.Widgets.ListWidget({ itemRenderer: function (li, stmt) { - if (stmt.type === 'transaction') { - $('').addClass(csscls('sql')).addClass(csscls('name')).text(stmt.sql).appendTo(li); - } else { - $('').addClass(csscls('sql')).html(PhpDebugBar.Widgets.highlight(stmt.sql, 'sql')).appendTo(li); - } - if (stmt.width_percent) { - $('
').addClass(csscls('bg-measure')).append( - $('
').addClass(csscls('value')).css({ - left: stmt.start_percent + '%', - width: Math.max(stmt.width_percent, 0.01) + '%', - }) - ).appendTo(li); - } - if (stmt.duration_str) { - $('').addClass(csscls('duration')).text(stmt.duration_str).appendTo(li); - } - if (stmt.memory_str) { - $('').addClass(csscls('memory')).text(stmt.memory_str).appendTo(li); - } - if (typeof(stmt.row_count) != 'undefined') { - $('').addClass(csscls('row-count')).text(stmt.row_count).appendTo(li); - } - - if (typeof stmt.xdebug_link !== 'undefined' && stmt.xdebug_link !== null) { - var header = $('').addClass(csscls('filename')).text(stmt.xdebug_link.filename + ( stmt.xdebug_link.line ? "#" + stmt.xdebug_link.line : '')); - if (stmt.xdebug_link) { - if (stmt.xdebug_link.ajax) { - $('').on('click', function () { - $.ajax(stmt.xdebug_link.url); - }).addClass(csscls('editor-link')).appendTo(header); - } else { - $('').addClass(csscls('editor-link')).appendTo(header); - } - } - header.appendTo(li); - } - - if (stmt.connection) { - $('').addClass(csscls('database')).text(stmt.connection).appendTo(li); - li.attr("connection",stmt.connection); - if ( $.inArray(stmt.connection, filters) == -1 ) { - filters.push(stmt.connection); - $('') - .addClass(csscls('filter')) - .text(stmt.connection) - .attr('rel', stmt.connection) - .on('click', function () { - self.onFilterClick(this); }) - .appendTo(self.$toolbar); - if (filters.length > 1) { - self.$toolbar.show(); - self.$list.$el.css("margin-bottom","20px"); - } - } - } - if (typeof(stmt.is_success) != 'undefined' && !stmt.is_success) { - li.addClass(csscls('error')); - li.append($('').addClass(csscls('error')).text("[" + stmt.error_code + "] " + stmt.error_message)); - } - if (stmt.show_copy) { - $('') - .addClass(csscls('copy-clipboard')) - .css('cursor', 'pointer') - .on('click', function (event) { - self.onCopyToClipboard(this); - event.stopPropagation(); - }) - .appendTo(li); - } - - if ((stmt.bindings && stmt.bindings.length) - || (stmt.hints && stmt.hints.length) - || (stmt.backtrace && stmt.backtrace.length) - || (stmt.params && !$.isEmptyObject(stmt.params)) - ) { - var table = $('
Metadata
').addClass(csscls('params')).appendTo(li); - li.css('cursor', 'pointer').click(function () { - if (table.is(':visible')) { - table.hide(); - } else { - table.show(); - } - }); - } - - - if (stmt.bindings && stmt.bindings.length) { - table.append(function () { - var icon = 'thumb-tack'; - var $icon = ''; - var $name = $('').addClass(csscls('name')).html('Bindings ' + $icon); - var $value = $('').addClass(csscls('value')); - var $span = $('').addClass('phpdebugbar-text-muted'); - - var index = 0; - var $bindings = new PhpDebugBar.Widgets.ListWidget({ itemRenderer: function (li, binding) { - var $index = $span.clone().text(index++ + '.'); - li.append($index, ' ', binding).removeClass(csscls('list-item')).addClass(csscls('table-list-item')); - }}); - - $bindings.set('data', stmt.bindings); - - $bindings.$el - .removeClass(csscls('list')) - .addClass(csscls('table-list')) - .appendTo($value); - - return $('').append($name, $value); - }); - } - - if (stmt.hints && stmt.hints.length) { - table.append(function () { - var icon = 'question-circle'; - var $icon = ''; - var $name = $('').addClass(csscls('name')).html('Hints ' + $icon); - var $value = $('').addClass(csscls('value')); - - var $hints = new PhpDebugBar.Widgets.ListWidget({ itemRenderer: function (li, hint) { - li.append(hint).removeClass(csscls('list-item')).addClass(csscls('table-list-item')); - }}); - - $hints.set('data', stmt.hints); - $hints.$el - .removeClass(csscls('list')) - .addClass(csscls('table-list')) - .appendTo($value); - - return $('').append($name, $value); - }); - } - - if (stmt.backtrace && stmt.backtrace.length) { - table.append(function () { - var icon = 'list-ul'; - var $icon = ''; - var $name = $('').addClass(csscls('name')).html('Backtrace ' + $icon); - var $value = $('').addClass(csscls('value')); - var $span = $('').addClass('phpdebugbar-text-muted'); - - var $backtrace = new PhpDebugBar.Widgets.ListWidget({ itemRenderer: function (li, source) { - var $parts = [ - $span.clone().text(source.index + '.'), - ' ', - ]; - - if (source.namespace) { - $parts.push(source.namespace + '::'); - } - - $parts.push(source.name); - $parts.push($span.clone().text(':' + source.line)); - - li.append($parts).removeClass(csscls('list-item')).addClass(csscls('table-list-item')); - }}); - - $backtrace.set('data', stmt.backtrace); - - $backtrace.$el - .removeClass(csscls('list')) - .addClass(csscls('table-list')) - .appendTo($value); - - return $('').append($name, $value); - }); - } - - if (stmt.params && !$.isEmptyObject(stmt.params)) { - for (var key in stmt.params) { - if (typeof stmt.params[key] !== 'function') { - table.append('' + key + '' + stmt.params[key] + ''); - } - } - } - }}); - this.$list.$el.appendTo(this.$el); - - this.bindAttr('data', function (data) { - // the collector maybe is empty - if (data.length <= 0 || !data.statements) { - return false; - } - this.$list.set('data', data.statements); - this.$status.empty(); - var stmt; - - // Search for duplicate statements. - for (var sql = {}, duplicate = 0, i = 0; i < data.statements.length; i++) { - if (data.statements[i].type === 'query') { - stmt = data.statements[i].sql; - if (data.statements[i].bindings && data.statements[i].bindings.length) { - stmt += JSON.stringify(data.statements[i].bindings); - } - if (data.statements[i].connection) { - stmt += '@' + data.statements[i].connection; - } - sql[stmt] = sql[stmt] || { keys: [] }; - sql[stmt].keys.push(i); - } - } - // Add classes to all duplicate SQL statements. - for (stmt in sql) { - if (sql[stmt].keys.length > 1) { - duplicate += sql[stmt].keys.length; - - for (i = 0; i < sql[stmt].keys.length; i++) { - this.$list.$el.find('.' + csscls('list-item')).eq(sql[stmt].keys[i]) - .addClass(csscls('sql-duplicate')) - .addClass(csscls('sql-duplicate-' + duplicate)); - } - } - } - - var t = $('').text(data.nb_statements + " statements were executed").appendTo(this.$status); - if (data.nb_failed_statements) { - t.append(", " + data.nb_failed_statements + " of which failed"); - } - if (duplicate) { - t.append(", " + duplicate + " of which were duplicated"); - t.append(", " + (data.nb_statements - duplicate) + " unique"); - - // add toggler for displaying only duplicated queries - var duplicatedText = "Show only duplicated"; - var allText = "Show All"; - var id = "phpdebugbar-show-duplicates"; - t.append(". " + duplicatedText + ""); - - $(".phpdebugbar #" + id).click(function () { - var $this = $(this); - $this.toggleClass("shown_duplicated"); - $this.text($this.hasClass("shown_duplicated") ? allText : duplicatedText); - $(".phpdebugbar-widgets-sqlqueries .phpdebugbar-widgets-list-item") - .not(".phpdebugbar-widgets-sql-duplicate") - .toggle(); - - return false; - }); - - } - if (data.accumulated_duration_str) { - this.$status.append($('').addClass(csscls('duration')).text(data.accumulated_duration_str)); - } - if (data.memory_usage_str) { - this.$status.append($('').addClass(csscls('memory')).text(data.memory_usage_str)); - } - }); - } - - }); - -})(PhpDebugBar.$);