From 6794b9a6adff08a6ce78a47051464363af05c048 Mon Sep 17 00:00:00 2001 From: Daniel Date: Wed, 9 Apr 2025 21:36:09 +1000 Subject: [PATCH 1/8] feat: add row number --- src/components/BrowserRow/BrowserRow.react.js | 1 + .../DataBrowserHeaderBar.scss | 5 +++-- src/dashboard/Data/Browser/Browser.scss | 16 ++++++++++++++++ src/dashboard/Data/Browser/BrowserTable.react.js | 4 ++-- .../Data/Browser/BrowserToolbar.react.js | 1 + 5 files changed, 23 insertions(+), 4 deletions(-) diff --git a/src/components/BrowserRow/BrowserRow.react.js b/src/components/BrowserRow/BrowserRow.react.js index 35e2752647..da48646c48 100644 --- a/src/components/BrowserRow/BrowserRow.react.js +++ b/src/components/BrowserRow/BrowserRow.react.js @@ -71,6 +71,7 @@ export default class BrowserRow extends Component { } return (
onMouseOverRow(obj.id)}> + {row + 1} (visible ? rowWidth + width : rowWidth), this.props.onAddRow ? 210 : 0 - ); + ) + 30; let editCloneRows; if (this.props.editCloneRows) { editCloneRows = ( @@ -540,7 +540,7 @@ export default class BrowserTable extends React.Component { id="browser-table" style={{ right: rightValue, - 'overflow-x': this.props.isResizing ? 'hidden' : 'auto', + overflowX: this.props.isResizing ? 'hidden' : 'auto', }} > onExecuteScriptRows(selection)} /> +
{menu} From c8cd2b234ac074ea63af315d7fe867273a04f0c4 Mon Sep 17 00:00:00 2001 From: Daniel Date: Sat, 26 Apr 2025 20:29:59 +1000 Subject: [PATCH 2/8] add skip values --- src/dashboard/Data/Browser/Browser.react.js | 1 + src/dashboard/Data/Browser/Browser.scss | 3 +++ src/dashboard/Data/Browser/BrowserTable.react.js | 4 ++-- 3 files changed, 6 insertions(+), 2 deletions(-) diff --git a/src/dashboard/Data/Browser/Browser.react.js b/src/dashboard/Data/Browser/Browser.react.js index 86c90182f9..de7bb41a8a 100644 --- a/src/dashboard/Data/Browser/Browser.react.js +++ b/src/dashboard/Data/Browser/Browser.react.js @@ -2096,6 +2096,7 @@ class Browser extends DashboardView { errorAggregatedData={this.state.errorAggregatedData} appName={this.props.params.appId} limit={this.state.limit} + skip={this.state.skip} /> Date: Mon, 28 Apr 2025 02:37:04 +0100 Subject: [PATCH 3/8] Update src/dashboard/Data/Browser/Browser.scss Signed-off-by: Manuel <5673677+mtrezza@users.noreply.github.com> --- src/dashboard/Data/Browser/Browser.scss | 1 - 1 file changed, 1 deletion(-) diff --git a/src/dashboard/Data/Browser/Browser.scss b/src/dashboard/Data/Browser/Browser.scss index 1e20cb5db4..9a454286be 100644 --- a/src/dashboard/Data/Browser/Browser.scss +++ b/src/dashboard/Data/Browser/Browser.scss @@ -128,7 +128,6 @@ body:global(.expanded) { text-overflow: ellipsis; } - .addRow { height: 30px; padding: 8px; From 21e39332e28764778efef6c20be8de34565f4b9a Mon Sep 17 00:00:00 2001 From: Daniel Date: Wed, 30 Apr 2025 22:15:17 +1000 Subject: [PATCH 4/8] dynamic header width --- src/components/BrowserRow/BrowserRow.react.js | 5 +++-- .../DataBrowserHeaderBar.react.js | 3 ++- .../DataBrowserHeaderBar/DataBrowserHeaderBar.scss | 2 +- src/dashboard/Data/Browser/Browser.scss | 4 ---- src/dashboard/Data/Browser/BrowserTable.react.js | 13 ++++++++++++- 5 files changed, 18 insertions(+), 9 deletions(-) diff --git a/src/components/BrowserRow/BrowserRow.react.js b/src/components/BrowserRow/BrowserRow.react.js index da48646c48..61c310ea9a 100644 --- a/src/components/BrowserRow/BrowserRow.react.js +++ b/src/components/BrowserRow/BrowserRow.react.js @@ -33,6 +33,7 @@ export default class BrowserRow extends Component { row, rowValue, rowWidth, + headerWidth, selection, selectRow, setCopyableValue, @@ -70,8 +71,8 @@ export default class BrowserRow extends Component { requiredCols = ['authData']; } return ( -
onMouseOverRow(obj.id)}> - {row + 1} +
onMouseOverRow(obj.id)}> + {row + 1} +
{readonly ? null : ( selectAll(e.target.checked)} /> )} diff --git a/src/components/DataBrowserHeaderBar/DataBrowserHeaderBar.scss b/src/components/DataBrowserHeaderBar/DataBrowserHeaderBar.scss index 05737f7d26..de57441334 100644 --- a/src/components/DataBrowserHeaderBar/DataBrowserHeaderBar.scss +++ b/src/components/DataBrowserHeaderBar/DataBrowserHeaderBar.scss @@ -52,7 +52,7 @@ height: 30px; vertical-align: top; text-align: center; - width: 60px; + width: 30px; background: rgb(114, 111, 133); padding-left: 30px; } diff --git a/src/dashboard/Data/Browser/Browser.scss b/src/dashboard/Data/Browser/Browser.scss index 9a454286be..730d9c2031 100644 --- a/src/dashboard/Data/Browser/Browser.scss +++ b/src/dashboard/Data/Browser/Browser.scss @@ -112,7 +112,6 @@ body:global(.expanded) { .rowNumber { display: inline-block; - width: 30px; height: 30px; line-height: 31px; vertical-align: top; @@ -123,9 +122,6 @@ body:global(.expanded) { z-index: 1; border-bottom: 1px solid #e3e3ea; background: white; - overflow: hidden; - direction: rtl; - text-overflow: ellipsis; } .addRow { diff --git a/src/dashboard/Data/Browser/BrowserTable.react.js b/src/dashboard/Data/Browser/BrowserTable.react.js index 63b2a4fcbf..039d5bf652 100644 --- a/src/dashboard/Data/Browser/BrowserTable.react.js +++ b/src/dashboard/Data/Browser/BrowserTable.react.js @@ -35,6 +35,7 @@ export default class BrowserTable extends React.Component { this.tableRef = React.createRef(); this.handleResize = this.handleResize.bind(this); this.updateMaxWidth = this.updateMaxWidth.bind(this); + this.headerWidth = 34; } componentWillReceiveProps(props) { @@ -121,10 +122,16 @@ export default class BrowserTable extends React.Component { let editor = null; let table =
; if (this.props.data) { - const rowWidth = this.props.order.reduce( + let rowWidth = this.props.order.reduce( (rowWidth, { visible, width }) => (visible ? rowWidth + width : rowWidth), this.props.onAddRow ? 210 : 0 ) + 30; + + this.headerWidth = Math.max( + 30, + Math.floor(Math.log10(this.props.data.length + this.props.skip)) * 10 + ) + 4; + let editCloneRows; if (this.props.editCloneRows) { editCloneRows = ( @@ -159,6 +166,7 @@ export default class BrowserTable extends React.Component { row={index + this.props.skip} rowValue={this.props.data[index]} rowWidth={rowWidth} + headerWidth={this.headerWidth} selection={this.props.selection} selectRow={this.props.selectRow} setCurrent={this.props.setCurrent} @@ -240,6 +248,7 @@ export default class BrowserTable extends React.Component { readOnlyFields={READ_ONLY} row={-1} rowWidth={rowWidth} + headerWidth={this.headerWidth} selection={this.props.selection} selectRow={this.props.selectRow} setCurrent={this.props.setCurrent} @@ -332,6 +341,7 @@ export default class BrowserTable extends React.Component { row={i + this.props.skip} rowValue={this.props.data[i]} rowWidth={rowWidth} + headerWidth={this.headerWidth} selection={this.props.selection} selectRow={this.props.selectRow} setCurrent={this.props.setCurrent} @@ -563,6 +573,7 @@ export default class BrowserTable extends React.Component { isDataLoaded={!this.props.isLoading} setSelectedObjectId={this.props.setSelectedObjectId} setCurrent={this.props.setCurrent} + headerWidth={this.headerWidth} /> {table}
From f5ca27cfe0386d4876ee7e8dae259fe64a4f7ff5 Mon Sep 17 00:00:00 2001 From: Manuel <5673677+mtrezza@users.noreply.github.com> Date: Fri, 2 May 2025 15:41:54 +0100 Subject: [PATCH 5/8] lint Signed-off-by: Manuel <5673677+mtrezza@users.noreply.github.com> --- src/dashboard/Data/Browser/BrowserTable.react.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/dashboard/Data/Browser/BrowserTable.react.js b/src/dashboard/Data/Browser/BrowserTable.react.js index 039d5bf652..54b1476f52 100644 --- a/src/dashboard/Data/Browser/BrowserTable.react.js +++ b/src/dashboard/Data/Browser/BrowserTable.react.js @@ -122,7 +122,7 @@ export default class BrowserTable extends React.Component { let editor = null; let table =
; if (this.props.data) { - let rowWidth = this.props.order.reduce( + const rowWidth = this.props.order.reduce( (rowWidth, { visible, width }) => (visible ? rowWidth + width : rowWidth), this.props.onAddRow ? 210 : 0 ) + 30; From 6931a7165b777c71a02c2d6f6ee142b68cfdbff1 Mon Sep 17 00:00:00 2001 From: Daniel Date: Sun, 18 May 2025 18:55:12 +1000 Subject: [PATCH 6/8] Update Browser.scss --- src/dashboard/Data/Browser/Browser.scss | 3 --- 1 file changed, 3 deletions(-) diff --git a/src/dashboard/Data/Browser/Browser.scss b/src/dashboard/Data/Browser/Browser.scss index 730d9c2031..5ba23258b3 100644 --- a/src/dashboard/Data/Browser/Browser.scss +++ b/src/dashboard/Data/Browser/Browser.scss @@ -117,9 +117,6 @@ body:global(.expanded) { vertical-align: top; border-right: 1px solid #e3e3ea; text-align: center; - position: sticky; - left: 0; - z-index: 1; border-bottom: 1px solid #e3e3ea; background: white; } From 20cda7e43362801b3aa8637ede1b8c2ce5e54931 Mon Sep 17 00:00:00 2001 From: Daniel Date: Sun, 18 May 2025 18:58:59 +1000 Subject: [PATCH 7/8] Update Browser.scss --- src/dashboard/Data/Browser/Browser.scss | 1 - 1 file changed, 1 deletion(-) diff --git a/src/dashboard/Data/Browser/Browser.scss b/src/dashboard/Data/Browser/Browser.scss index 5ba23258b3..2548bf8ea1 100644 --- a/src/dashboard/Data/Browser/Browser.scss +++ b/src/dashboard/Data/Browser/Browser.scss @@ -118,7 +118,6 @@ body:global(.expanded) { border-right: 1px solid #e3e3ea; text-align: center; border-bottom: 1px solid #e3e3ea; - background: white; } .addRow { From 04ad502ce5e3149129428bbc451c8922c4d6cb8e Mon Sep 17 00:00:00 2001 From: Daniel Date: Tue, 3 Jun 2025 20:08:53 +1000 Subject: [PATCH 8/8] review feedback --- .../DataBrowserHeaderBar.react.js | 5 ++++- .../DataBrowserHeaderBar/DataBrowserHeaderBar.scss | 11 +++++++++++ 2 files changed, 15 insertions(+), 1 deletion(-) diff --git a/src/components/DataBrowserHeaderBar/DataBrowserHeaderBar.react.js b/src/components/DataBrowserHeaderBar/DataBrowserHeaderBar.react.js index a88902434e..d2722d70ff 100644 --- a/src/components/DataBrowserHeaderBar/DataBrowserHeaderBar.react.js +++ b/src/components/DataBrowserHeaderBar/DataBrowserHeaderBar.react.js @@ -29,7 +29,10 @@ export default class DataBrowserHeaderBar extends React.Component { headerWidth } = this.props; const elements = [ -
+
+
#
+
, +
{readonly ? null : ( selectAll(e.target.checked)} /> )} diff --git a/src/components/DataBrowserHeaderBar/DataBrowserHeaderBar.scss b/src/components/DataBrowserHeaderBar/DataBrowserHeaderBar.scss index de57441334..a60126b74c 100644 --- a/src/components/DataBrowserHeaderBar/DataBrowserHeaderBar.scss +++ b/src/components/DataBrowserHeaderBar/DataBrowserHeaderBar.scss @@ -108,3 +108,14 @@ } } + +.rowNumberColumn { + height: 30px; + line-height: 31px; + vertical-align: top; + text-align: center; + background-color: #66637A; + color: white; + font-size: 12px; + font-weight: normal; +} \ No newline at end of file