From d8cc844adfadf2579a3ab1e444203c2eb4a1d653 Mon Sep 17 00:00:00 2001 From: Luke Cotter <4013877+lukecotter@users.noreply.github.com> Date: Thu, 27 Feb 2025 11:54:27 +0000 Subject: [PATCH 1/8] feat: add actions buttons for analysis table - Copy to clipboard - Export to CSV --- .../components/analysis-view/AnalysisView.ts | 49 ++++++++++++++++++- 1 file changed, 47 insertions(+), 2 deletions(-) diff --git a/log-viewer/modules/components/analysis-view/AnalysisView.ts b/log-viewer/modules/components/analysis-view/AnalysisView.ts index 0ed1c1b7..e6c46448 100644 --- a/log-viewer/modules/components/analysis-view/AnalysisView.ts +++ b/log-viewer/modules/components/analysis-view/AnalysisView.ts @@ -3,6 +3,7 @@ */ import { provideVSCodeDesignSystem, + vsCodeButton, vsCodeCheckbox, vsCodeDropdown, vsCodeOption, @@ -11,6 +12,7 @@ import { LitElement, css, html, unsafeCSS, type PropertyValues } from 'lit'; import { customElement, property } from 'lit/decorators.js'; import { Tabulator, type ColumnComponent, type RowComponent } from 'tabulator-tables'; import * as CommonModules from '../../datagrid/module/CommonModules.js'; +import codiconStyles from '../../styles/codicon.css'; import NumberAccessor from '../../datagrid/dataaccessor/Number.js'; import { progressFormatter } from '../../datagrid/format/Progress.js'; @@ -28,12 +30,18 @@ import { callStackSum } from './column-calcs/CallStackSum.js'; // Components import '../skeleton/GridSkeleton.js'; -provideVSCodeDesignSystem().register(vsCodeCheckbox(), vsCodeDropdown(), vsCodeOption()); +provideVSCodeDesignSystem().register( + vsCodeButton(), + vsCodeCheckbox(), + vsCodeDropdown(), + vsCodeOption(), +); @customElement('analysis-view') export class AnalysisView extends LitElement { static styles = [ unsafeCSS(dataGridStyles), + unsafeCSS(codiconStyles), globalStyles, css` :host { @@ -66,6 +74,17 @@ export class AnalysisView extends LitElement { line-height: normal; margin-bottom: 2px; } + + .actions-container { + display: flex; + } + + .actions-container .actions-container--right { + align-items: center; + display: flex; + flex: 1 1 auto; + justify-content: flex-end; + } `, ]; @@ -104,7 +123,7 @@ export class AnalysisView extends LitElement { const skeleton = !this.timelineRoot ? html`` : ''; return html` -
+
+
+ + + + + + +
${skeleton} @@ -121,6 +158,14 @@ export class AnalysisView extends LitElement { `; } + _copyToClipboard() { + this.analysisTable?.copyToClipboard('all'); + } + + _exportToCSV() { + this.analysisTable?.download('csv', 'analysis.csv', { bom: true, delimiter: ',' }); + } + get _tableWrapper(): HTMLDivElement | null | undefined { return (this.tableContainer ??= this.renderRoot?.querySelector('#analysis-table')); } From caf6f812a22f7303bfe7466a93c1433d68b33bc3 Mon Sep 17 00:00:00 2001 From: Luke Cotter <4013877+lukecotter@users.noreply.github.com> Date: Sun, 16 Mar 2025 16:07:41 +0000 Subject: [PATCH 2/8] docs: update changelog --- CHANGELOG.md | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index 68cc516f..d423b760 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -7,6 +7,10 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 ## [Unreleased] +### Added + +- Table actions: copy to clipboard and export to CSV + ### Change - Highlight and copy text to clipboard: Call Tree, Analysis and Database views ([#504][#504]) From abd01614ca10b135e6db2938159826b009a516f1 Mon Sep 17 00:00:00 2001 From: Luke Cotter <4013877+lukecotter@users.noreply.github.com> Date: Mon, 7 Apr 2025 14:42:45 +0100 Subject: [PATCH 3/8] feat: add data grid filter bar Reduces boiler plate --- .../components/analysis-view/AnalysisView.ts | 24 +++---- .../components/database-view/DMLView.ts | 51 ++++++++++++--- .../components/database-view/SOQLView.ts | 62 ++++++++++++++----- .../datagrid/datagrid-filter-bar.ts | 50 +++++++++++++++ 4 files changed, 147 insertions(+), 40 deletions(-) create mode 100644 log-viewer/modules/components/datagrid/datagrid-filter-bar.ts diff --git a/log-viewer/modules/components/analysis-view/AnalysisView.ts b/log-viewer/modules/components/analysis-view/AnalysisView.ts index 98d03de7..04596533 100644 --- a/log-viewer/modules/components/analysis-view/AnalysisView.ts +++ b/log-viewer/modules/components/analysis-view/AnalysisView.ts @@ -30,6 +30,7 @@ import { callStackSum } from './column-calcs/CallStackSum.js'; import { GroupCalcs } from '../../datagrid/group-calcs/GroupCalcs.js'; // Components +import '../datagrid/datagrid-filter-bar.js'; import '../skeleton/GridSkeleton.js'; provideVSCodeDesignSystem().register( @@ -76,17 +77,6 @@ export class AnalysisView extends LitElement { line-height: normal; margin-bottom: 2px; } - - .actions-container { - display: flex; - } - - .actions-container .actions-container--right { - align-items: center; - display: flex; - flex: 1 1 auto; - justify-content: flex-end; - } `, ]; @@ -125,16 +115,17 @@ export class AnalysisView extends LitElement { const skeleton = !this.timelineRoot ? html`` : ''; return html` -
-