From 9d6d7af29bf2542bec135ecb23c8684aae51250c Mon Sep 17 00:00:00 2001 From: Manuel <5673677+mtrezza@users.noreply.github.com> Date: Wed, 9 Jul 2025 15:06:19 +0200 Subject: [PATCH 1/5] feat(data-browser): add optional row number column --- src/components/BrowserRow/BrowserRow.react.js | 34 +++++++++++--- .../DataBrowserHeaderBar.react.js | 38 ++++++++++++++-- .../DataBrowserHeaderBar.scss | 22 ++++++--- src/dashboard/Data/Browser/Browser.react.js | 45 +++++++++++-------- src/dashboard/Data/Browser/Browser.scss | 35 ++++++++++----- .../Data/Browser/BrowserTable.react.js | 35 ++++++++++----- .../Data/Browser/DataBrowser.react.js | 33 +++++++++----- 7 files changed, 175 insertions(+), 67 deletions(-) diff --git a/src/components/BrowserRow/BrowserRow.react.js b/src/components/BrowserRow/BrowserRow.react.js index 12f577de63..2b9495e7fb 100644 --- a/src/components/BrowserRow/BrowserRow.react.js +++ b/src/components/BrowserRow/BrowserRow.react.js @@ -33,6 +33,9 @@ export default class BrowserRow extends Component { row, rowValue, rowWidth, + showRowNumber, + rowNumberWidth, + skip, selection, selectRow, setCopyableValue, @@ -82,12 +85,12 @@ export default class BrowserRow extends Component { style={ freezeIndex >= 0 ? { - position: 'sticky', - left: 0, - zIndex: 1, - background: rowBackground, - borderBottom: '1px solid #e3e3ea', - } + position: 'sticky', + left: 0, + zIndex: 1, + background: rowBackground, + borderBottom: '1px solid #e3e3ea', + } : {} } > @@ -98,6 +101,25 @@ export default class BrowserRow extends Component { onMouseDown={e => onMouseDownRowCheckBox(e.target.checked)} /> + {showRowNumber && ( + = 0 + ? { + position: 'sticky', + left: 30, + zIndex: 1, + background: rowBackground, + borderBottom: '1px solid #e3e3ea', + width: rowNumberWidth, + } + : { width: rowNumberWidth } + } + > + {row >= 0 ? (skip + row + 1).toLocaleString() : ''} + + )} {order.map(({ name, width, visible }, j) => { if (!visible) { return null; diff --git a/src/components/DataBrowserHeaderBar/DataBrowserHeaderBar.react.js b/src/components/DataBrowserHeaderBar/DataBrowserHeaderBar.react.js index b5955df6dd..c84334b417 100644 --- a/src/components/DataBrowserHeaderBar/DataBrowserHeaderBar.react.js +++ b/src/components/DataBrowserHeaderBar/DataBrowserHeaderBar.react.js @@ -15,11 +15,23 @@ import { DndProvider } from 'react-dnd'; export default class DataBrowserHeaderBar extends React.Component { handleContextMenu = (index, event) => { event.preventDefault(); - const { freezeIndex, freezeColumns, unfreezeColumns, setContextMenu } = this.props; - const items = + const { + freezeIndex, + freezeColumns, + unfreezeColumns, + setContextMenu, + showRowNumber, + setShowRowNumber, + } = this.props; + const items = [ + { + text: showRowNumber ? 'Hide row number' : 'Display row number', + callback: () => setShowRowNumber(!showRowNumber), + }, freezeIndex >= 0 && index <= freezeIndex - ? [{ text: 'Unfreeze column', callback: () => unfreezeColumns() }] - : [{ text: 'Freeze column', callback: () => freezeColumns(index) }]; + ? { text: 'Unfreeze column', callback: () => unfreezeColumns() } + : { text: 'Freeze column', callback: () => freezeColumns(index) }, + ]; setContextMenu(event.pageX, event.pageY, items); }; @@ -39,6 +51,8 @@ export default class DataBrowserHeaderBar extends React.Component { stickyLefts, handleLefts, freezeIndex, + showRowNumber, + rowNumberWidth, } = this.props; const elements = [
, ]; + if (showRowNumber) { + elements.push( +
= 0 + ? { position: 'sticky', left: 30, zIndex: 11, width: rowNumberWidth } + : { width: rowNumberWidth } + } + > + # +
+ ); + } + headers.forEach(({ width, name, type, targetClass, order, visible, preventSort }, i) => { if (!visible) { return; diff --git a/src/components/DataBrowserHeaderBar/DataBrowserHeaderBar.scss b/src/components/DataBrowserHeaderBar/DataBrowserHeaderBar.scss index a69e8eba73..953b9ea53e 100644 --- a/src/components/DataBrowserHeaderBar/DataBrowserHeaderBar.scss +++ b/src/components/DataBrowserHeaderBar/DataBrowserHeaderBar.scss @@ -18,7 +18,7 @@ display: inline-block; min-width: 100%; // to resolve rendering issue with retina displays - -webkit-transform: translate3d(0,0,0); + -webkit-transform: translate3d(0, 0, 0); } .wrap { @@ -53,7 +53,18 @@ vertical-align: top; text-align: center; width: 30px; - background: rgb(114, 111, 133) + background: rgb(114, 111, 133); +} + +.rowNumber { + line-height: 30px; + height: 30px; + vertical-align: top; + text-align: right; + background: rgb(114, 111, 133); + border-right: 1px solid #e3e3ea; + padding: 0 4px; + box-sizing: border-box; } .handle { @@ -90,20 +101,19 @@ border-top: 1px solid #e3e3ea; border-bottom: 1px solid #e3e3ea; height: 30px; - width:100%; + width: 100%; vertical-align: middle; padding-left: 2px; margin-top: 30px; line-height: 31px; animation: skeleton-loading 1s linear infinite alternate; } - + @keyframes skeleton-loading { 0% { - background-color:#ffffff; + background-color: #ffffff; } 100% { background-color: #e3e3ea; - } } diff --git a/src/dashboard/Data/Browser/Browser.react.js b/src/dashboard/Data/Browser/Browser.react.js index c61d216b29..17dd7b411a 100644 --- a/src/dashboard/Data/Browser/Browser.react.js +++ b/src/dashboard/Data/Browser/Browser.react.js @@ -661,7 +661,7 @@ class Browser extends DashboardView { } obj.save(null, { useMasterKey }).then( objectSaved => { - const msg = objectSaved.className + ' with id \'' + objectSaved.id + '\' created'; + const msg = objectSaved.className + " with id '" + objectSaved.id + "' created"; this.showNote(msg, false); const state = { data: this.state.data }; @@ -764,7 +764,7 @@ class Browser extends DashboardView { obj.save(null, { useMasterKey: true }).then( objectSaved => { - const msg = objectSaved.className + ' with id \'' + objectSaved.id + '\' ' + 'created'; + const msg = objectSaved.className + " with id '" + objectSaved.id + "' " + 'created'; this.showNote(msg, false); const state = { @@ -908,7 +908,7 @@ class Browser extends DashboardView { const { useMasterKey, skip, limit } = this.state; this.setState({ data: null, - }) + }); const query = await queryFromFilters(source, filters); const sortDir = this.state.ordering[0] === '-' ? '-' : '+'; const field = this.state.ordering.substr(sortDir === '-' ? 1 : 0); @@ -1270,7 +1270,7 @@ class Browser extends DashboardView { const { useMasterKey } = this.state; obj.save(null, { useMasterKey }).then( objectSaved => { - const msg = objectSaved.className + ' with id \'' + objectSaved.id + '\' updated'; + const msg = objectSaved.className + " with id '" + objectSaved.id + "' updated"; this.showNote(msg, false); const state = { @@ -1398,7 +1398,7 @@ class Browser extends DashboardView { let deletedNote; if (toDeleteObjectIds.length == 1) { - deletedNote = className + ' with id \'' + toDeleteObjectIds[0] + '\' deleted'; + deletedNote = className + " with id '" + toDeleteObjectIds[0] + "' deleted"; } else { deletedNote = toDeleteObjectIds.length + ' ' + className + ' objects deleted'; } @@ -1426,7 +1426,7 @@ class Browser extends DashboardView { if (error.code === Parse.Error.AGGREGATE_ERROR) { if (error.errors.length == 1) { errorDeletingNote = - 'Error deleting ' + className + ' with id \'' + error.errors[0].object.id + '\''; + 'Error deleting ' + className + " with id '" + error.errors[0].object.id + "'"; } else if (error.errors.length < toDeleteObjectIds.length) { errorDeletingNote = 'Error deleting ' + @@ -1443,7 +1443,7 @@ class Browser extends DashboardView { } else { if (toDeleteObjectIds.length == 1) { errorDeletingNote = - 'Error deleting ' + className + ' with id \'' + toDeleteObjectIds[0] + '\''; + 'Error deleting ' + className + " with id '" + toDeleteObjectIds[0] + "'"; } else { errorDeletingNote = 'Error deleting ' + toDeleteObjectIds.length + ' ' + className + ' objects'; @@ -1598,13 +1598,15 @@ class Browser extends DashboardView { script.cloudCodeFunction, { object: object.toPointer() }, { useMasterKey: true } - ).then(response => ({ - objectId: object.id, - response, - })).catch(error => ({ - objectId: object.id, - error, - })) + ) + .then(response => ({ + objectId: object.id, + response, + })) + .catch(error => ({ + objectId: object.id, + error, + })) ); const results = await Promise.all(promises); @@ -1631,12 +1633,18 @@ class Browser extends DashboardView { totalErrorCount += batchErrorCount; if (objects.length > 1) { - this.showNote(`Ran script "${script.title}" on ${batch.length} objects in batch ${batchCount}/${totalBatchCount} with ${batchErrorCount} errors.`, batchErrorCount > 0); + this.showNote( + `Ran script "${script.title}" on ${batch.length} objects in batch ${batchCount}/${totalBatchCount} with ${batchErrorCount} errors.`, + batchErrorCount > 0 + ); } } if (objects.length > 1) { - this.showNote(`Ran script "${script.title}" on ${objects.length} objects in ${batchCount} batches with ${totalErrorCount} errors.`, totalErrorCount > 0); + this.showNote( + `Ran script "${script.title}" on ${objects.length} objects in ${batchCount} batches with ${totalErrorCount} errors.`, + totalErrorCount > 0 + ); } this.refresh(); } catch (e) { @@ -1957,7 +1965,7 @@ class Browser extends DashboardView { }} removeFilter={filter => { this.resetPage(); - this.removeFilter(filter) + this.removeFilter(filter); }} classClicked={() => { this.resetPage(); @@ -1978,7 +1986,7 @@ class Browser extends DashboardView { // Scroll to top window.scrollTo({ top: 0, - behavior: 'smooth' + behavior: 'smooth', }); // Reset pagination to page 1 @@ -2201,6 +2209,7 @@ class Browser extends DashboardView { errorAggregatedData={this.state.errorAggregatedData} appName={this.props.params.appId} limit={this.state.limit} + skip={this.state.skip} /> :nth-child(2) { + > :nth-child(2) { display: flex; align-items: center; justify-content: center; @@ -138,7 +149,8 @@ body:global(.expanded) { } } -.notificationMessage, .notificationError { +.notificationMessage, +.notificationError { @include animation('fade-in 0.2s ease-out'); position: absolute; bottom: 20px; @@ -222,8 +234,8 @@ body:global(.expanded) { right: 0; width: 142px; font-size: 12px; - color: #0E69A1; - background: #F4F5F7; + color: #0e69a1; + background: #f4f5f7; font-family: 'Source Code Pro', 'Courier New', monospace; .selectionHeader { @@ -261,7 +273,7 @@ body:global(.expanded) { position: relative; } } -} +} .dataContainer { height: 100%; @@ -273,5 +285,4 @@ body:global(.expanded) { } .confirmConfig { - padding: 10px 20px; -} \ No newline at end of file + padding: 10px 20px;} diff --git a/src/dashboard/Data/Browser/BrowserTable.react.js b/src/dashboard/Data/Browser/BrowserTable.react.js index a5c1220d50..1d8001816a 100644 --- a/src/dashboard/Data/Browser/BrowserTable.react.js +++ b/src/dashboard/Data/Browser/BrowserTable.react.js @@ -121,11 +121,13 @@ export default class BrowserTable extends React.Component { const stickyLefts = []; const handleLefts = []; - if ( - typeof this.props.freezeIndex === 'number' && - this.props.freezeIndex >= 0 - ) { - let left = 30; + const maxRowNumber = + this.props.skip + (this.props.data ? this.props.data.length : this.props.limit); + const rowNumberWidth = this.props.showRowNumber + ? maxRowNumber.toLocaleString().length * 8 + 16 + : 0; + if (typeof this.props.freezeIndex === 'number' && this.props.freezeIndex >= 0) { + let left = 30 + rowNumberWidth; headers.forEach((h, i) => { stickyLefts[i] = left; handleLefts[i] = left + h.width; @@ -137,10 +139,11 @@ export default class BrowserTable extends React.Component { let editor = null; let table =
; if (this.props.data) { - const rowWidth = this.props.order.reduce( - (rowWidth, { visible, width }) => (visible ? rowWidth + width : rowWidth), - this.props.onAddRow ? 210 : 0 - ); + const rowWidth = + this.props.order.reduce( + (rw, { visible, width }) => (visible ? rw + width : rw), + this.props.onAddRow ? 210 : 0 + ) + rowNumberWidth; let editCloneRows; if (this.props.editCloneRows) { editCloneRows = ( @@ -175,6 +178,9 @@ export default class BrowserTable extends React.Component { row={index} rowValue={this.props.data[index]} rowWidth={rowWidth} + showRowNumber={this.props.showRowNumber} + rowNumberWidth={rowNumberWidth} + skip={this.props.skip} selection={this.props.selection} selectRow={this.props.selectRow} setCurrent={this.props.setCurrent} @@ -258,6 +264,9 @@ export default class BrowserTable extends React.Component { readOnlyFields={READ_ONLY} row={-1} rowWidth={rowWidth} + showRowNumber={this.props.showRowNumber} + rowNumberWidth={rowNumberWidth} + skip={this.props.skip} selection={this.props.selection} selectRow={this.props.selectRow} setCurrent={this.props.setCurrent} @@ -352,6 +361,9 @@ export default class BrowserTable extends React.Component { row={i} rowValue={this.props.data[i]} rowWidth={rowWidth} + showRowNumber={this.props.showRowNumber} + rowNumberWidth={rowNumberWidth} + skip={this.props.skip} selection={this.props.selection} selectRow={this.props.selectRow} setCurrent={this.props.setCurrent} @@ -450,7 +462,7 @@ export default class BrowserTable extends React.Component { //for data rows & new row when there are edit clone rows wrapTop += 2 * ROW_HEIGHT * this.props.editCloneRows.length; } - let wrapLeft = 30; + let wrapLeft = 30 + rowNumberWidth; for (let i = 0; i < this.props.current.col; i++) { const column = this.props.order[i]; wrapLeft += column.visible ? column.width : 0; @@ -582,6 +594,9 @@ export default class BrowserTable extends React.Component { freezeColumns={this.props.freezeColumns} unfreezeColumns={this.props.unfreezeColumns} updateOrdering={this.props.updateOrdering} + showRowNumber={this.props.showRowNumber} + setShowRowNumber={this.props.setShowRowNumber} + rowNumberWidth={rowNumberWidth} readonly={!!this.props.relation || !!this.props.isUnique} handleDragDrop={this.props.handleHeaderDragDrop} onResize={this.props.handleResize} diff --git a/src/dashboard/Data/Browser/DataBrowser.react.js b/src/dashboard/Data/Browser/DataBrowser.react.js index 1ab16c48e9..540e6febf5 100644 --- a/src/dashboard/Data/Browser/DataBrowser.react.js +++ b/src/dashboard/Data/Browser/DataBrowser.react.js @@ -50,6 +50,7 @@ export default class DataBrowser extends React.Component { maxWidth: window.innerWidth - 300, showAggregatedData: true, frozenColumnIndex: -1, + showRowNumber: false, }; this.handleResizeDiv = this.handleResizeDiv.bind(this); @@ -69,6 +70,7 @@ export default class DataBrowser extends React.Component { this.setContextMenu = this.setContextMenu.bind(this); this.freezeColumns = this.freezeColumns.bind(this); this.unfreezeColumns = this.unfreezeColumns.bind(this); + this.setShowRowNumber = this.setShowRowNumber.bind(this); this.handleCellClick = this.handleCellClick.bind(this); this.saveOrderTimeout = null; } @@ -297,9 +299,10 @@ export default class DataBrowser extends React.Component { for (let colIndex = colStart; colIndex <= colEnd; colIndex++) { const field = this.state.order[colIndex].name; - const value = field === 'objectId' - ? this.props.data[rowIndex].id - : this.props.data[rowIndex].attributes[field]; + const value = + field === 'objectId' + ? this.props.data[rowIndex].id + : this.props.data[rowIndex].attributes[field]; if (typeof value === 'number' && !isNaN(value)) { rowData.push(String(value)); @@ -389,10 +392,10 @@ export default class DataBrowser extends React.Component { e.ctrlKey || e.metaKey ? firstVisibleColumnIndex : this.getNextVisibleColumnIndex( - -1, - firstVisibleColumnIndex, - lastVisibleColumnIndex - ), + -1, + firstVisibleColumnIndex, + lastVisibleColumnIndex + ), }, }); e.preventDefault(); @@ -430,10 +433,10 @@ export default class DataBrowser extends React.Component { e.ctrlKey || e.metaKey ? lastVisibleColumnIndex : this.getNextVisibleColumnIndex( - 1, - firstVisibleColumnIndex, - lastVisibleColumnIndex - ), + 1, + firstVisibleColumnIndex, + lastVisibleColumnIndex + ), }, }); e.preventDefault(); @@ -551,6 +554,10 @@ export default class DataBrowser extends React.Component { this.setState({ frozenColumnIndex: -1 }); } + setShowRowNumber(show) { + this.setState({ showRowNumber: show }); + } + handleColumnsOrder(order, shouldReload) { this.setState({ order: [...order] }, () => { this.updatePreferences(order, shouldReload); @@ -666,6 +673,10 @@ export default class DataBrowser extends React.Component { panelWidth={this.state.panelWidth} isResizing={this.state.isResizing} setShowAggregatedData={this.setShowAggregatedData} + showRowNumber={this.state.showRowNumber} + setShowRowNumber={this.setShowRowNumber} + skip={this.props.skip} + limit={this.props.limit} firstSelectedCell={this.state.firstSelectedCell} {...other} /> From e41a30dc7a4fb5d5345587e2b1e19cc5d8375e21 Mon Sep 17 00:00:00 2001 From: Manuel <5673677+mtrezza@users.noreply.github.com> Date: Wed, 9 Jul 2025 15:20:28 +0200 Subject: [PATCH 2/5] Style row number column --- .../DataBrowserHeaderBar/DataBrowserHeaderBar.scss | 5 +++-- src/dashboard/Data/Browser/Browser.scss | 2 +- 2 files changed, 4 insertions(+), 3 deletions(-) diff --git a/src/components/DataBrowserHeaderBar/DataBrowserHeaderBar.scss b/src/components/DataBrowserHeaderBar/DataBrowserHeaderBar.scss index 953b9ea53e..42fa242798 100644 --- a/src/components/DataBrowserHeaderBar/DataBrowserHeaderBar.scss +++ b/src/components/DataBrowserHeaderBar/DataBrowserHeaderBar.scss @@ -60,9 +60,10 @@ line-height: 30px; height: 30px; vertical-align: top; - text-align: right; + text-align: center; background: rgb(114, 111, 133); - border-right: 1px solid #e3e3ea; + color: #A2A6B1; + font-size: 12px; padding: 0 4px; box-sizing: border-box; } diff --git a/src/dashboard/Data/Browser/Browser.scss b/src/dashboard/Data/Browser/Browser.scss index 53e0d3bd2d..26e4809a0f 100644 --- a/src/dashboard/Data/Browser/Browser.scss +++ b/src/dashboard/Data/Browser/Browser.scss @@ -116,7 +116,7 @@ body:global(.expanded) { line-height: 31px; vertical-align: top; border-right: 1px solid #e3e3ea; - text-align: right; + text-align: center; padding: 0 4px; box-sizing: border-box; } From 9b3a7b64b101e954540390008da156cd7c7e9f6c Mon Sep 17 00:00:00 2001 From: Manuel <5673677+mtrezza@users.noreply.github.com> Date: Wed, 9 Jul 2025 15:38:39 +0200 Subject: [PATCH 3/5] fix: keep checkbox and row numbers sticky --- src/components/BrowserRow/BrowserRow.react.js | 38 ++++++++----------- .../DataBrowserHeaderBar.react.js | 8 +--- 2 files changed, 17 insertions(+), 29 deletions(-) diff --git a/src/components/BrowserRow/BrowserRow.react.js b/src/components/BrowserRow/BrowserRow.react.js index 2b9495e7fb..c9993b7a0b 100644 --- a/src/components/BrowserRow/BrowserRow.react.js +++ b/src/components/BrowserRow/BrowserRow.react.js @@ -82,17 +82,13 @@ export default class BrowserRow extends Component { className={styles.checkCell} onMouseUp={onMouseUpRowCheckBox} onMouseOver={() => onMouseOverRowCheckBox(obj.id)} - style={ - freezeIndex >= 0 - ? { - position: 'sticky', - left: 0, - zIndex: 1, - background: rowBackground, - borderBottom: '1px solid #e3e3ea', - } - : {} - } + style={{ + position: 'sticky', + left: 0, + zIndex: 1, + background: rowBackground, + borderBottom: '1px solid #e3e3ea', + }} > = 0 - ? { - position: 'sticky', - left: 30, - zIndex: 1, - background: rowBackground, - borderBottom: '1px solid #e3e3ea', - width: rowNumberWidth, - } - : { width: rowNumberWidth } - } + style={{ + position: 'sticky', + left: 30, + zIndex: 1, + background: rowBackground, + borderBottom: '1px solid #e3e3ea', + width: rowNumberWidth, + }} > {row >= 0 ? (skip + row + 1).toLocaleString() : ''} diff --git a/src/components/DataBrowserHeaderBar/DataBrowserHeaderBar.react.js b/src/components/DataBrowserHeaderBar/DataBrowserHeaderBar.react.js index c84334b417..7570f79734 100644 --- a/src/components/DataBrowserHeaderBar/DataBrowserHeaderBar.react.js +++ b/src/components/DataBrowserHeaderBar/DataBrowserHeaderBar.react.js @@ -58,7 +58,7 @@ export default class DataBrowserHeaderBar extends React.Component {
= 0 ? { position: 'sticky', left: 0, zIndex: 11 } : {}} + style={{ position: 'sticky', left: 0, zIndex: 11 }} > {readonly ? null : ( selectAll(e.target.checked)} /> @@ -71,11 +71,7 @@ export default class DataBrowserHeaderBar extends React.Component {
= 0 - ? { position: 'sticky', left: 30, zIndex: 11, width: rowNumberWidth } - : { width: rowNumberWidth } - } + style={{ position: 'sticky', left: 30, zIndex: 11, width: rowNumberWidth }} > #
From 7bc005203e03b749df8f067ab5e3ae9c5cd4cdae Mon Sep 17 00:00:00 2001 From: Manuel <5673677+mtrezza@users.noreply.github.com> Date: Wed, 9 Jul 2025 15:48:58 +0200 Subject: [PATCH 4/5] Persist row number column setting --- src/dashboard/Data/Browser/DataBrowser.react.js | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/src/dashboard/Data/Browser/DataBrowser.react.js b/src/dashboard/Data/Browser/DataBrowser.react.js index 540e6febf5..a9901aeb3b 100644 --- a/src/dashboard/Data/Browser/DataBrowser.react.js +++ b/src/dashboard/Data/Browser/DataBrowser.react.js @@ -16,6 +16,8 @@ import styles from './Databrowser.scss'; import AggregationPanel from '../../../components/AggregationPanel/AggregationPanel'; +const BROWSER_SHOW_ROW_NUMBER = 'browserShowRowNumber'; + /** * DataBrowser renders the browser toolbar and data table * It also manages the fetching / updating of column size prefs, @@ -32,6 +34,9 @@ export default class DataBrowser extends React.Component { props.className, columnPreferences[props.className] ); + const storedRowNumber = + window.localStorage?.getItem(BROWSER_SHOW_ROW_NUMBER) === 'true'; + this.state = { order: order, current: null, @@ -50,7 +55,7 @@ export default class DataBrowser extends React.Component { maxWidth: window.innerWidth - 300, showAggregatedData: true, frozenColumnIndex: -1, - showRowNumber: false, + showRowNumber: storedRowNumber, }; this.handleResizeDiv = this.handleResizeDiv.bind(this); @@ -556,6 +561,7 @@ export default class DataBrowser extends React.Component { setShowRowNumber(show) { this.setState({ showRowNumber: show }); + window.localStorage?.setItem(BROWSER_SHOW_ROW_NUMBER, show); } handleColumnsOrder(order, shouldReload) { From d23c8d49b8b131c8f0b4a0127599c82d1f77a7be Mon Sep 17 00:00:00 2001 From: Manuel Trezza <5673677+mtrezza@users.noreply.github.com> Date: Wed, 9 Jul 2025 15:54:53 +0200 Subject: [PATCH 5/5] lint --- src/dashboard/Data/Browser/Browser.react.js | 26 +++++++------------ .../Data/Browser/DataBrowser.react.js | 16 ++++++------ 2 files changed, 18 insertions(+), 24 deletions(-) diff --git a/src/dashboard/Data/Browser/Browser.react.js b/src/dashboard/Data/Browser/Browser.react.js index 17dd7b411a..1d5cd34da1 100644 --- a/src/dashboard/Data/Browser/Browser.react.js +++ b/src/dashboard/Data/Browser/Browser.react.js @@ -661,7 +661,7 @@ class Browser extends DashboardView { } obj.save(null, { useMasterKey }).then( objectSaved => { - const msg = objectSaved.className + " with id '" + objectSaved.id + "' created"; + const msg = `${objectSaved.className} with id '${objectSaved.id}' created`; this.showNote(msg, false); const state = { data: this.state.data }; @@ -764,7 +764,7 @@ class Browser extends DashboardView { obj.save(null, { useMasterKey: true }).then( objectSaved => { - const msg = objectSaved.className + " with id '" + objectSaved.id + "' " + 'created'; + const msg = `${objectSaved.className} with id '${objectSaved.id}' created`; this.showNote(msg, false); const state = { @@ -1270,7 +1270,7 @@ class Browser extends DashboardView { const { useMasterKey } = this.state; obj.save(null, { useMasterKey }).then( objectSaved => { - const msg = objectSaved.className + " with id '" + objectSaved.id + "' updated"; + const msg = `${objectSaved.className} with id '${objectSaved.id}' updated`; this.showNote(msg, false); const state = { @@ -1398,9 +1398,9 @@ class Browser extends DashboardView { let deletedNote; if (toDeleteObjectIds.length == 1) { - deletedNote = className + " with id '" + toDeleteObjectIds[0] + "' deleted"; + deletedNote = `${className} with id '${toDeleteObjectIds[0]}' deleted`; } else { - deletedNote = toDeleteObjectIds.length + ' ' + className + ' objects deleted'; + deletedNote = `${toDeleteObjectIds.length} ${className} objects deleted`; } this.showNote(deletedNote, false); @@ -1426,27 +1426,21 @@ class Browser extends DashboardView { if (error.code === Parse.Error.AGGREGATE_ERROR) { if (error.errors.length == 1) { errorDeletingNote = - 'Error deleting ' + className + " with id '" + error.errors[0].object.id + "'"; + `Error deleting ${className} with id '${error.errors[0].object.id}'`; } else if (error.errors.length < toDeleteObjectIds.length) { errorDeletingNote = - 'Error deleting ' + - error.errors.length + - ' out of ' + - toDeleteObjectIds.length + - ' ' + - className + - ' objects'; + `Error deleting ${error.errors.length} out of ${toDeleteObjectIds.length} ${className} objects`; } else { errorDeletingNote = - 'Error deleting all ' + error.errors.length + ' ' + className + ' objects'; + `Error deleting all ${error.errors.length} ${className} objects`; } } else { if (toDeleteObjectIds.length == 1) { errorDeletingNote = - 'Error deleting ' + className + " with id '" + toDeleteObjectIds[0] + "'"; + `Error deleting ${className} with id '${toDeleteObjectIds[0]}'`; } else { errorDeletingNote = - 'Error deleting ' + toDeleteObjectIds.length + ' ' + className + ' objects'; + `Error deleting ${toDeleteObjectIds.length} ${className} objects`; } } diff --git a/src/dashboard/Data/Browser/DataBrowser.react.js b/src/dashboard/Data/Browser/DataBrowser.react.js index a9901aeb3b..31cc764810 100644 --- a/src/dashboard/Data/Browser/DataBrowser.react.js +++ b/src/dashboard/Data/Browser/DataBrowser.react.js @@ -397,10 +397,10 @@ export default class DataBrowser extends React.Component { e.ctrlKey || e.metaKey ? firstVisibleColumnIndex : this.getNextVisibleColumnIndex( - -1, - firstVisibleColumnIndex, - lastVisibleColumnIndex - ), + -1, + firstVisibleColumnIndex, + lastVisibleColumnIndex + ), }, }); e.preventDefault(); @@ -438,10 +438,10 @@ export default class DataBrowser extends React.Component { e.ctrlKey || e.metaKey ? lastVisibleColumnIndex : this.getNextVisibleColumnIndex( - 1, - firstVisibleColumnIndex, - lastVisibleColumnIndex - ), + 1, + firstVisibleColumnIndex, + lastVisibleColumnIndex + ), }, }); e.preventDefault();