fix truncate of long device names in data box

This commit is contained in:
proddy
2023-06-08 16:50:29 +02:00
parent 5784bf744e
commit e11d5bed9d

View File

@@ -50,9 +50,6 @@ import { AuthenticatedContext } from 'contexts/authentication';
import { useI18nContext } from 'i18n/i18n-react'; import { useI18nContext } from 'i18n/i18n-react';
// TODO what to do with extractErrorMessage?
import { extractErrorMessage } from 'utils';
const DashboardDevices: FC = () => { const DashboardDevices: FC = () => {
const [size, setSize] = useState([0, 0]); const [size, setSize] = useState([0, 0]);
const { me } = useContext(AuthenticatedContext); const { me } = useContext(AuthenticatedContext);
@@ -83,7 +80,6 @@ const DashboardDevices: FC = () => {
const { loading: submitting, send: writeDeviceValue } = useRequest( const { loading: submitting, send: writeDeviceValue } = useRequest(
(id: number, deviceValue: DeviceValue) => EMSESP.writeDeviceValue(id, deviceValue), (id: number, deviceValue: DeviceValue) => EMSESP.writeDeviceValue(id, deviceValue),
{ {
// } = useRequest((data) => alovaInstance.Post('/writeDeviceValue', data), {
immediate: false immediate: false
} }
); );
@@ -171,7 +167,7 @@ const DashboardDevices: FC = () => {
common_theme, common_theme,
{ {
Table: ` Table: `
--data-table-library_grid-template-columns: minmax(0, 1fr) minmax(150px, auto) 40px; --data-table-library_grid-template-columns: minmax(200px, auto) minmax(150px, auto) 40px;
height: auto; height: auto;
max-height: 100%; max-height: 100%;
overflow-y: scroll; overflow-y: scroll;
@@ -494,20 +490,11 @@ const DashboardDevices: FC = () => {
}} }}
> >
<Box sx={{ border: '1px solid #177ac9' }}> <Box sx={{ border: '1px solid #177ac9' }}>
<Grid container justifyContent="space-between"> <Typography noWrap variant="subtitle1" color="warning.main" sx={{ mx: 1 }}>
<Box color="warning.main" ml={1}> {coreData.devices[deviceIndex].n}
<Typography noWrap variant="h6"> </Typography>
{coreData.devices[deviceIndex].n}
</Typography>
</Box>
<Grid item zeroMinWidth justifyContent="flex-end">
<IconButton onClick={resetDeviceSelect}>
<CancelIcon color="info" sx={{ fontSize: 18, verticalAlign: 'middle' }} />
</IconButton>
</Grid>
</Grid>
<Grid item xs> <Grid container justifyContent="space-between">
<Typography sx={{ ml: 1 }} variant="subtitle2" color="primary"> <Typography sx={{ ml: 1 }} variant="subtitle2" color="primary">
{shown_data.length + ' ' + LL.ENTITIES(shown_data.length)} {shown_data.length + ' ' + LL.ENTITIES(shown_data.length)}
<IconButton onClick={() => setShowDeviceInfo(true)}> <IconButton onClick={() => setShowDeviceInfo(true)}>
@@ -527,6 +514,11 @@ const DashboardDevices: FC = () => {
<RefreshIcon color="primary" sx={{ fontSize: 18, verticalAlign: 'middle' }} /> <RefreshIcon color="primary" sx={{ fontSize: 18, verticalAlign: 'middle' }} />
</IconButton> </IconButton>
</Typography> </Typography>
<Grid item zeroMinWidth justifyContent="flex-end">
<IconButton onClick={resetDeviceSelect}>
<CancelIcon color="info" sx={{ fontSize: 18, verticalAlign: 'middle' }} />
</IconButton>
</Grid>
</Grid> </Grid>
</Box> </Box>