diff --git a/packages/datalib/src/GridDisplay.ts b/packages/datalib/src/GridDisplay.ts index 66d86e168..b62689ec7 100644 --- a/packages/datalib/src/GridDisplay.ts +++ b/packages/datalib/src/GridDisplay.ts @@ -528,10 +528,12 @@ export abstract class GridDisplay { this.setConfig((cfg) => ({ ...cfg, isFormView: true, - formViewKey: _.pick( - rowData, - columns.map((x) => x.columnName) - ), + formViewKey: rowData + ? _.pick( + rowData, + columns.map((x) => x.columnName) + ) + : null, })); } } diff --git a/packages/web/src/datagrid/DataGridCore.js b/packages/web/src/datagrid/DataGridCore.js index 8fbb48f47..bb5ca2937 100644 --- a/packages/web/src/datagrid/DataGridCore.js +++ b/packages/web/src/datagrid/DataGridCore.js @@ -968,9 +968,7 @@ export default function DataGridCore(props) { formViewAvailable && display.baseTable && display.baseTable.primaryKey ? () => { const cell = currentCell; - if (!isRegularCell(cell)) return; - const rowData = grider.getRowData(cell[0]); - if (!rowData) return; + const rowData = isRegularCell(cell) ? grider.getRowData(cell[0]) : null; display.switchToFormView(rowData); } : null; diff --git a/packages/web/src/formview/FormView.js b/packages/web/src/formview/FormView.js index 584543e88..a4b1944d9 100644 --- a/packages/web/src/formview/FormView.js +++ b/packages/web/src/formview/FormView.js @@ -342,6 +342,7 @@ export default function FormView(props) { } if ( + rowData && !event.ctrlKey && !event.altKey && ((event.keyCode >= keycodes.a && event.keyCode <= keycodes.z) || @@ -352,7 +353,7 @@ export default function FormView(props) { dispatchInsplaceEditor({ type: 'show', text: event.nativeEvent.key, cell: currentCell }); return; } - if (event.keyCode == keycodes.f2) { + if (rowData && event.keyCode == keycodes.f2) { // @ts-ignore dispatchInsplaceEditor({ type: 'show', cell: currentCell, selectAll: true }); return; @@ -374,7 +375,9 @@ export default function FormView(props) { if (isDataCell(cell) && !_.isEqual(cell, inplaceEditorState.cell) && _.isEqual(cell, currentCell)) { // @ts-ignore - dispatchInsplaceEditor({ type: 'show', cell, selectAll: true }); + if (rowData) { + dispatchInsplaceEditor({ type: 'show', cell, selectAll: true }); + } } else if (!_.isEqual(cell, inplaceEditorState.cell)) { // @ts-ignore dispatchInsplaceEditor({ type: 'close' }); @@ -391,6 +394,7 @@ export default function FormView(props) { }; const rowCountInfo = React.useMemo(() => { + if (rowData == null) return 'No data'; if (allRowCount == null || rowCountBefore == null) return 'Loading row count...'; return `Row: ${(rowCountBefore + 1).toLocaleString()} / ${allRowCount.toLocaleString()}`; }, [rowCountBefore, allRowCount]); @@ -490,11 +494,9 @@ export default function FormView(props) { /> ) : ( <> - + {rowData && ( + + )} {!!col.hintColumnName && rowData && !(rowStatus.modifiedFields && rowStatus.modifiedFields.has(col.uniqueName)) && ( diff --git a/packages/web/src/formview/SqlFormView.js b/packages/web/src/formview/SqlFormView.js index 7472dbf75..3c3323479 100644 --- a/packages/web/src/formview/SqlFormView.js +++ b/packages/web/src/formview/SqlFormView.js @@ -11,6 +11,7 @@ import ErrorMessageModal from '../modals/ErrorMessageModal'; import { scriptToSql } from 'dbgate-sqltree'; import useModalState from '../modals/useModalState'; import useShowModal from '../modals/showModal'; +import stableStringify from 'json-stable-stringify'; async function loadRow(props, sql) { const { conid, database } = props; @@ -45,6 +46,7 @@ export default function SqlFormView(props) { const [reloadToken, setReloadToken] = React.useState(0); const [rowCountInfo, setRowCountInfo] = React.useState(null); const [isLoading, setIsLoading] = React.useState(false); + const loadedFiltersRef = React.useRef(''); const confirmSqlModalState = useModalState(); const [confirmSql, setConfirmSql] = React.useState(''); @@ -94,6 +96,10 @@ export default function SqlFormView(props) { if (onReferenceSourceChanged && rowData) onReferenceSourceChanged([rowData]); }, [rowData, refReloadToken]); + React.useEffect(() => { + loadedFiltersRef.current = formDisplay ? stableStringify(formDisplay.config) : null; + }, [rowData]); + React.useEffect(() => { if (formDisplay) handleLoadCurrentRow(); setRowCountInfo(null); @@ -103,7 +109,11 @@ export default function SqlFormView(props) { React.useEffect(() => { if (!formDisplay.isLoadedCorrectly) return; - if (formDisplay && !formDisplay.isLoadedCurrentRow(rowData)) { + if ( + formDisplay && + (!formDisplay.isLoadedCurrentRow(rowData) || + loadedFiltersRef.current != stableStringify(formDisplay.config.filters)) + ) { handleLoadCurrentRow(); } setRowCountInfo(null);