diff --git a/interface/src/project/SettingsCustomization.tsx b/interface/src/project/SettingsCustomization.tsx index 2fb0e47b0..db41d3761 100644 --- a/interface/src/project/SettingsCustomization.tsx +++ b/interface/src/project/SettingsCustomization.tsx @@ -86,7 +86,7 @@ const SettingsCustomization: FC = () => { const entities_theme = useTheme({ Table: ` - --data-table-library_grid-template-columns: 150px repeat(1, minmax(80px, 1fr)) 45px minmax(45px, auto) minmax(120px, auto); + --data-table-library_grid-template-columns: 156px repeat(1, minmax(80px, 1fr)) 45px minmax(45px, auto) minmax(120px, auto); `, BaseRow: ` font-size: 14px; @@ -192,17 +192,9 @@ const SettingsCustomization: FC = () => { return value; } - function formatName(de: DeviceEntity) { - return ( - <> - {de.n && (de.n[0] === '!' ? LL.COMMAND(1) + ': ' + de.n.slice(1) : de.cn && de.cn !== '' ? de.cn : de.n) + ' '}( - - {de.id} - - ) - - ); - } + const formatName = (de: DeviceEntity, withShortname: boolean) => + (de.n && de.n[0] === '!' ? LL.COMMAND(1) + ': ' + de.n.slice(1) : de.cn && de.cn !== '' ? de.cn : de.n) + + (withShortname ? ' ' + de.id : ''); const getMaskNumber = (newMask: string[]) => { let new_mask = 0; @@ -232,10 +224,13 @@ const SettingsCustomization: FC = () => { return new_masks; }; + const filter_entity = (de: DeviceEntity) => + (de.m & selectedFilters || !selectedFilters) && formatName(de, true).includes(search.toLocaleLowerCase()); + const maskDisabled = (set: boolean) => { setDeviceEntities( deviceEntities.map(function (de) { - if ((de.m & selectedFilters || !selectedFilters) && de.id.toLowerCase().includes(search.toLowerCase())) { + if (filter_entity(de)) { return { ...de, m: set @@ -353,7 +348,7 @@ const SettingsCustomization: FC = () => { margin="normal" select > - + {LL.SELECT_DEVICE()}... {devices.devices.map((device: DeviceShort, index) => ( @@ -370,9 +365,7 @@ const SettingsCustomization: FC = () => { return; } - const shown_data = deviceEntities.filter( - (de) => (de.m & selectedFilters || !selectedFilters) && de.id.toLowerCase().includes(search.toLowerCase()) - ); + const shown_data = deviceEntities.filter((de) => filter_entity(de)); return ( <> @@ -470,7 +463,13 @@ const SettingsCustomization: FC = () => { - {formatName(de)} + + {formatName(de, false)} ( + + {de.id} + + ) + {!(de.m & DeviceEntityMask.DV_READONLY) && formatValue(de.mi)} {!(de.m & DeviceEntityMask.DV_READONLY) && formatValue(de.ma)} {formatValue(de.v)} diff --git a/interface/src/project/SettingsCustomizationDialog.tsx b/interface/src/project/SettingsCustomizationDialog.tsx index 8476cd501..1e616218c 100644 --- a/interface/src/project/SettingsCustomizationDialog.tsx +++ b/interface/src/project/SettingsCustomizationDialog.tsx @@ -1,4 +1,5 @@ import CancelIcon from '@mui/icons-material/Cancel'; +import CloseIcon from '@mui/icons-material/Close'; import DoneIcon from '@mui/icons-material/Done'; import { @@ -67,15 +68,34 @@ const SettingsCustomizationDialog = ({ open, onClose, onSave, selectedItem }: Se {LL.EDIT() + ' ' + LL.ENTITY()} - + + + {LL.ENTITY() + ' ID'}:  + {editItem.id} - - + + + + + {LL.DEFAULT(1) + ' ' + LL.ENTITY_NAME(1)}:  + + {editItem.n} + + + + + {LL.WRITEABLE()}:  + - {LL.DEFAULT(1) + ' ' + LL.ENTITY_NAME(1)}: {editItem.n} + {editItem.w ? ( + + ) : ( + + )} - - + + +