diff --git a/frontend/src/components/DataGrid.layout.test.tsx b/frontend/src/components/DataGrid.layout.test.tsx index 5e301bc..e0755fb 100644 --- a/frontend/src/components/DataGrid.layout.test.tsx +++ b/frontend/src/components/DataGrid.layout.test.tsx @@ -3,6 +3,7 @@ import { renderToStaticMarkup } from 'react-dom/server'; import { describe, expect, it, vi } from 'vitest'; import DataGrid, { + buildGridFieldSelectOptions, formatCellDisplayText, resolveContextMenuFieldName, resolveDefaultGridFilterOperator, @@ -140,6 +141,16 @@ describe('DataGrid layout', () => { })).toBe('STARTS_WITH'); }); + it('keeps full field names in filter field select options', () => { + const [option] = buildGridFieldSelectOptions(['mes_manufacture_order_really_long_column_name']); + + expect(option).toEqual({ + value: 'mes_manufacture_order_really_long_column_name', + label: 'mes_manufacture_order_really_long_column_name', + title: 'mes_manufacture_order_really_long_column_name', + }); + }); + it('renders a DDL action for table data pages only', () => { const tableMarkup = renderToStaticMarkup( ( + (columnNames || []).map((columnName) => { + const text = String(columnName || ''); + return { + value: text, + label: text, + title: text, + }; + }) +); + +const renderGridFieldSelectOption = (option: { label?: React.ReactNode; value?: unknown; title?: unknown }) => { + const text = String(option?.title ?? option?.label ?? option?.value ?? ''); + return ( + + {text} + + ); +}; + type NormalizeCommitCellValue = (columnName: string, value: any, mode: 'insert' | 'update') => any; type DataGridCommitChangeSet = { @@ -2786,6 +2819,11 @@ const DataGrid: React.FC = ({ })); }, [allTableColumnNames, displayColumnNames, quickWhereDraft, dbType, darkMode]); + const gridFieldSelectOptions = useMemo( + () => buildGridFieldSelectOptions(displayColumnNames), + [displayColumnNames], + ); + useEffect(() => { if (!showFilter) { return; @@ -6363,12 +6401,14 @@ const DataGrid: React.FC = ({ disabled={condIndex === 0} /> { const next = [...sortInfo]; @@ -6458,9 +6498,11 @@ const DataGrid: React.FC = ({ }} options={displayColumnNames .filter(c => c === s.columnKey || !sortInfo.some(si => si.columnKey === c)) - .map(c => ({ value: c, label: c }))} + .map(c => ({ value: c, label: c, title: c }))} showSearch optionFilterProp="label" + optionRender={renderGridFieldSelectOption} + popupMatchSelectWidth={FILTER_FIELD_POPUP_WIDTH} filterOption={(input, option) => String(option?.label ?? '') .toLowerCase()