Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

tidy up dashboard text and alerts #2380

Merged
merged 1 commit into from
Jan 28, 2025
Merged

tidy up dashboard text and alerts #2380

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 3 additions & 3 deletions interface/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -45,9 +45,9 @@
"@eslint/js": "^9.19.0",
"@preact/compat": "^18.3.1",
"@preact/preset-vite": "^2.10.0",
"@trivago/prettier-plugin-sort-imports": "^5.2.1",
"@trivago/prettier-plugin-sort-imports": "^5.2.2",
"@types/formidable": "^3",
"@types/node": "^22.10.10",
"@types/node": "^22.12.0",
"@types/react": "^19.0.8",
"@types/react-dom": "^19.0.3",
"concurrently": "^9.1.2",
Expand All @@ -57,7 +57,7 @@
"prettier": "^3.4.2",
"rollup-plugin-visualizer": "^5.14.0",
"terser": "^5.37.0",
"typescript-eslint": "8.21.0",
"typescript-eslint": "8.22.0",
"vite": "^6.0.11",
"vite-plugin-imagemin": "^0.6.1",
"vite-tsconfig-paths": "^5.1.4"
Expand Down
4 changes: 2 additions & 2 deletions interface/src/api/app.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ import type {
Action,
Activity,
CoreData,
DashboardItem,
DashboardData,
DeviceData,
DeviceEntity,
Entities,
Expand All @@ -22,7 +22,7 @@ import type {

// Dashboard
export const readDashboard = () =>
alovaInstance.Get<DashboardItem[]>('/rest/dashboardData', {
alovaInstance.Get<DashboardData>('/rest/dashboardData', {
responseType: 'arraybuffer' // uses msgpack
});

Expand Down
224 changes: 113 additions & 111 deletions interface/src/app/main/Dashboard.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,11 +6,11 @@ import { toast } from 'react-toastify';
import ChevronRightIcon from '@mui/icons-material/ChevronRight';
import EditIcon from '@mui/icons-material/Edit';
import ExpandMoreIcon from '@mui/icons-material/ExpandMore';
import HelpOutlineIcon from '@mui/icons-material/HelpOutline';
import UnfoldLessIcon from '@mui/icons-material/UnfoldLess';
import UnfoldMoreIcon from '@mui/icons-material/UnfoldMore';
import {
Box,
Grid2 as Grid,
IconButton,
ToggleButton,
ToggleButtonGroup,
Expand Down Expand Up @@ -58,10 +58,10 @@ const Dashboard = () => {
error,
loading
} = useRequest(readDashboard, {
initialData: []
initialData: { connected: false, nodes: [] }
}).onSuccess((event) => {
if (event.data.length !== parentNodes) {
setParentNodes(event.data.length); // count number of parents/devices
if (event.data.nodes.length !== parentNodes) {
setParentNodes(event.data.nodes.length); // count number of parents/devices
}
});

Expand Down Expand Up @@ -121,7 +121,7 @@ const Dashboard = () => {
});

const tree = useTree(
{ nodes: data },
{ nodes: data.nodes },
{
onChange: undefined // not used but needed
},
Expand Down Expand Up @@ -154,7 +154,7 @@ const Dashboard = () => {

useEffect(() => {
showAll
? tree.fns.onAddAll(data.map((item: DashboardItem) => item.id)) // expand tree
? tree.fns.onAddAll(data.nodes.map((item: DashboardItem) => item.id)) // expand tree
: tree.fns.onRemoveAll(); // collapse tree
}, [parentNodes]);

Expand Down Expand Up @@ -224,47 +224,22 @@ const Dashboard = () => {
return <FormLoader onRetry={fetchDashboard} errorMessage={error?.message} />;
}

const hasFavEntities = data.filter(
if (loading) {
return;
}

const hasFavEntities = data.nodes.filter(
(item: DashboardItem) => item.id <= 90
).length;

return (
<>
<Box
sx={{
backgroundColor: 'black',
pt: 1,
pl: 2
}}
>
<Grid container spacing={0} justifyContent="flex-start">
<Grid size={11}>
<Typography mb={2} variant="body1" color="warning">
{LL.DASHBOARD_1()}
</Typography>
</Grid>

<Grid size={1} alignItems="end">
<ToggleButtonGroup
color="primary"
size="small"
value={showAll}
exclusive
onChange={handleShowAll}
>
<ToggleButton value={true}>
<UnfoldMoreIcon sx={{ fontSize: 18 }} />
</ToggleButton>
<ToggleButton value={false}>
<UnfoldLessIcon sx={{ fontSize: 18 }} />
</ToggleButton>
</ToggleButtonGroup>
</Grid>
</Grid>
</Box>
{!data.connected && (
<MessageBox mb={2} level="error" message={LL.EMS_BUS_WARNING()} />
)}

{!loading && !hasFavEntities && (
<MessageBox my={1} level="info">
{data.connected && !hasFavEntities && (
<MessageBox mb={2} level="warning">
<Typography>
{LL.NO_DATA_1()}&nbsp;
<Link to="/customizations" style={{ color: 'white' }}>
Expand All @@ -280,80 +255,107 @@ const Dashboard = () => {
</MessageBox>
)}

{data.length > 0 && (
<Box
padding={1}
justifyContent="center"
flexDirection="column"
sx={{
borderRadius: 1,
border: '1px solid grey'
}}
>
<IconContext.Provider
value={{
color: 'lightblue',
size: '18',
style: { verticalAlign: 'middle' }
{data.nodes.length > 0 && (
<>
<ToggleButtonGroup
color="primary"
size="small"
value={showAll}
exclusive
onChange={handleShowAll}
>
<Tooltip placement="top" title={LL.ALLVALUES()} arrow>
<ToggleButton value={true}>
<UnfoldMoreIcon sx={{ fontSize: 18 }} />
</ToggleButton>
</Tooltip>
<Tooltip placement="top" title={LL.COMPACT()} arrow>
<ToggleButton value={false}>
<UnfoldLessIcon sx={{ fontSize: 18 }} />
</ToggleButton>
</Tooltip>
</ToggleButtonGroup>
<Tooltip placement="top" title={LL.DASHBOARD_1()} arrow>
<HelpOutlineIcon color="primary" sx={{ ml: 1, fontSize: 20 }} />
</Tooltip>

<Box
padding={1}
justifyContent="center"
flexDirection="column"
sx={{
borderRadius: 1,
border: '1px solid grey'
}}
>
<Table
data={{ nodes: data }}
theme={dashboard_theme}
layout={{ custom: true }}
tree={tree}
<IconContext.Provider
value={{
color: 'lightblue',
size: '18',
style: { verticalAlign: 'middle' }
}}
>
{(tableList: DashboardItem[]) => (
<Body>
{tableList.map((di: DashboardItem) => (
<Row
key={di.id}
item={di}
onClick={() => editDashboardValue(di)}
>
{di.id > 99 ? (
<>
<Cell>{showName(di)}</Cell>
<Cell>
<Tooltip
placement="left"
title={formatValue(LL, di.dv?.v, di.dv?.u)}
arrow
>
<span>{formatValue(LL, di.dv?.v, di.dv?.u)}</span>
</Tooltip>
</Cell>
<Table
data={{ nodes: data.nodes }}
theme={dashboard_theme}
layout={{ custom: true }}
tree={tree}
>
{(tableList: DashboardItem[]) => (
<Body>
{tableList.map((di: DashboardItem) => (
<Row
key={di.id}
item={di}
onClick={() => editDashboardValue(di)}
>
{di.id > 99 ? (
<>
<Cell>{showName(di)}</Cell>
<Cell>
<Tooltip
placement="left"
title={formatValue(LL, di.dv?.v, di.dv?.u)}
arrow
>
<span>{formatValue(LL, di.dv?.v, di.dv?.u)}</span>
</Tooltip>
</Cell>

<Cell>
{me.admin &&
di.dv?.c &&
!hasMask(di.dv.id, DeviceEntityMask.DV_READONLY) && (
<IconButton
size="small"
onClick={() => editDashboardValue(di)}
>
<EditIcon
color="primary"
sx={{ fontSize: 16 }}
/>
</IconButton>
)}
</Cell>
</>
) : (
<>
<CellTree item={di}>{showName(di)}</CellTree>
<Cell />
<Cell />
</>
)}
</Row>
))}
</Body>
)}
</Table>
</IconContext.Provider>
</Box>
<Cell>
{me.admin &&
di.dv?.c &&
!hasMask(
di.dv.id,
DeviceEntityMask.DV_READONLY
) && (
<IconButton
size="small"
onClick={() => editDashboardValue(di)}
>
<EditIcon
color="primary"
sx={{ fontSize: 16 }}
/>
</IconButton>
)}
</Cell>
</>
) : (
<>
<CellTree item={di}>{showName(di)}</CellTree>
<Cell />
<Cell />
</>
)}
</Row>
))}
</Body>
)}
</Table>
</IconContext.Provider>
</Box>
</>
)}
</>
);
Expand Down
5 changes: 5 additions & 0 deletions interface/src/app/main/types.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -124,6 +124,11 @@ export interface DashboardItem {
nodes?: DashboardItem[]; // children nodes, optional
}

export interface DashboardData {
connected: boolean; // true if connected to EMS bus
nodes: DashboardItem[];
}

export interface DeviceValue {
id: string; // index, contains mask+name
v?: unknown; // value, Number, String or Boolean - can be undefined
Expand Down
2 changes: 1 addition & 1 deletion interface/src/i18n/cz/index.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -344,7 +344,7 @@ const cz: Translation = {
DUPLICATE: 'Duplikát',
UPGRADE: 'Upgrade',
DASHBOARD_1: 'All EMS entities that are active and marked as Favorite, plus all Custom Entities, Schedules and external Sensors data are displayed below.', // TODO translate
NO_DATA_1: 'No favourite EMS entities found. Use the', // TODO translate
NO_DATA_1: 'No favourite EMS entities found yet. Use the', // TODO translate
NO_DATA_2: 'module to mark them.', // TODO translate
NO_DATA_3: 'To see all available entities go to' // TODO translate
};
Expand Down
2 changes: 1 addition & 1 deletion interface/src/i18n/en/index.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -344,7 +344,7 @@ const en: Translation = {
DEVELOPER_MODE: 'Developer Mode',
DUPLICATE: 'Duplicate',
UPGRADE: 'Upgrade',
NO_DATA_1: 'No favourite EMS entities found! Use the',
NO_DATA_1: 'No favourite EMS entities found yet. Use the',
NO_DATA_2: 'module to mark them.',
NO_DATA_3: 'To see all available entities go to'
};
Expand Down
2 changes: 1 addition & 1 deletion interface/src/i18n/fr/index.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -344,7 +344,7 @@ const fr: Translation = {
DUPLICATE: 'Duplicate', // TODO translate
UPGRADE: 'Upgrade', // TODO translate
DASHBOARD_1: 'All EMS entities that are active and marked as Favorite, plus all Custom Entities, Schedules and external Sensors data are displayed below.', // TODO translate
NO_DATA_1: 'No favourite EMS entities found. Use the', // TODO translate
NO_DATA_1: 'No favourite EMS entities found yet. Use the', // TODO translate
NO_DATA_2: 'module to mark them.', // TODO translate
NO_DATA_3: 'To see all available entities go to' // TODO translate
};
Expand Down
2 changes: 1 addition & 1 deletion interface/src/i18n/it/index.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -344,7 +344,7 @@ const it: Translation = {
DUPLICATE: 'Duplicate', // TODO translate
UPGRADE: 'Upgrade', // TODO translate
DASHBOARD_1: 'All EMS entities that are active and marked as Favorite, plus all Custom Entities, Schedules and external Sensors data are displayed below.', // TODO translate
NO_DATA_1: 'No favourite EMS entities found. Use the', // TODO translate
NO_DATA_1: 'No favourite EMS entities found yet. Use the', // TODO translate
NO_DATA_2: 'module to mark them.', // TODO translate
NO_DATA_3: 'To see all available entities go to' // TODO translate
};
Expand Down
2 changes: 1 addition & 1 deletion interface/src/i18n/nl/index.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -344,7 +344,7 @@ const nl: Translation = {
DUPLICATE: 'Duplicaat',
UPGRADE: 'Upgraden',
DASHBOARD_1: 'All EMS entities that are active and marked as Favorite, plus all Custom Entities, Schedules and external Sensors data are displayed below.', // TODO translate
NO_DATA_1: 'No favourite EMS entities found. Use the', // TODO translate
NO_DATA_1: 'No favourite EMS entities found yet. Use the', // TODO translate
NO_DATA_2: 'module to mark them.', // TODO translate
NO_DATA_3: 'To see all available entities go to' // TODO translate
};
Expand Down
2 changes: 1 addition & 1 deletion interface/src/i18n/no/index.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -344,7 +344,7 @@ const no: Translation = {
DUPLICATE: 'Duplicate', // TODO translate
UPGRADE: 'Upgrade', // TODO translate
DASHBOARD_1: 'All EMS entities that are active and marked as Favorite, plus all Custom Entities, Schedules and external Sensors data are displayed below.', // TODO translate
NO_DATA_1: 'No favourite EMS entities found. Use the', // TODO translate
NO_DATA_1: 'No favourite EMS entities found yet. Use the', // TODO translate
NO_DATA_2: 'module to mark them.', // TODO translate
NO_DATA_3: 'To see all available entities go to' // TODO translate
};
Expand Down
2 changes: 1 addition & 1 deletion interface/src/i18n/pl/index.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -344,7 +344,7 @@ const pl: BaseTranslation = {
DUPLICATE: 'Duplicate', // TODO translate
UPGRADE: 'Upgrade', // TODO translate
DASHBOARD_1: 'All EMS entities that are active and marked as Favorite, plus all Custom Entities, Schedules and external Sensors data are displayed below.', // TODO translate
NO_DATA_1: 'No favourite EMS entities found. Use the', // TODO translate
NO_DATA_1: 'No favourite EMS entities found yet. Use the', // TODO translate
NO_DATA_2: 'module to mark them.', // TODO translate
NO_DATA_3: 'To see all available entities go to' // TODO translate
};
Expand Down
Loading