show message in Dashboard if no fav entities set

proddy · Jan 14, 2025 · 570678e · 570678e
1 parent 64a2f5e
commit 570678e
Show file tree

Hide file tree

Showing 13 changed files with 112 additions and 75 deletions.
diff --git a/interface/src/app/main/Dashboard.tsx b/interface/src/app/main/Dashboard.tsx
@@ -1,9 +1,9 @@
 import { useContext, useEffect, useState } from 'react';
 import { IconContext } from 'react-icons/lib';
+import { Link } from 'react-router';
 import { toast } from 'react-toastify';
 
 import ChevronRightIcon from '@mui/icons-material/ChevronRight';
-import ConstructionIcon from '@mui/icons-material/Construction';
 import EditIcon from '@mui/icons-material/Edit';
 import ExpandMoreIcon from '@mui/icons-material/ExpandMore';
 import UnfoldLessIcon from '@mui/icons-material/UnfoldLess';
@@ -22,7 +22,7 @@ import { Body, Cell, Row, Table } from '@table-library/react-table-library/table
 import { useTheme } from '@table-library/react-table-library/theme';
 import { CellTree, useTree } from '@table-library/react-table-library/tree';
 import { useRequest } from 'alova/client';
-import { FormLoader, SectionContent, useLayoutTitle } from 'components';
+import { FormLoader, MessageBox, SectionContent, useLayoutTitle } from 'components';
 import { AuthenticatedContext } from 'contexts/authentication';
 import { useI18nContext } from 'i18n/i18n-react';
 import { useInterval, usePersistState } from 'utils';
@@ -224,6 +224,10 @@ const Dashboard = () => {
       return <FormLoader onRetry={fetchDashboard} errorMessage={error?.message} />;
     }
 
+    const hasFavEntities = data.filter(
+      (item: DashboardItem) => item.id <= 90
+    ).length;
+
     return (
       <>
         <Box
@@ -236,10 +240,7 @@ const Dashboard = () => {
           <Grid container spacing={0} justifyContent="flex-start">
             <Grid size={11}>
               <Typography mb={2} variant="body1" color="warning">
-                {LL.DASHBOARD_1()}&nbsp;
-                <ConstructionIcon
-                  sx={{ color: '#9e9e9e', fontSize: 20, verticalAlign: 'middle' }}
-                />
+                {LL.DASHBOARD_1()}
               </Typography>
             </Grid>
 
@@ -262,27 +263,40 @@ const Dashboard = () => {
           </Grid>
         </Box>
 
-        <Box
-          padding={1}
-          justifyContent="center"
-          flexDirection="column"
-          sx={{
-            borderRadius: 1,
-            border: '1px solid grey'
-          }}
-        >
-          <IconContext.Provider
-            value={{
-              color: 'lightblue',
-              size: '18',
-              style: { verticalAlign: 'middle' }
+        {!loading && !hasFavEntities && (
+          <MessageBox my={1} level="info" message="">
+            <Typography>
+              {LL.NO_DATA_1()}&nbsp;
+              <Link to="/customizations" style={{ color: 'white' }}>
+                {LL.CUSTOMIZATIONS()}
+              </Link>
+              &nbsp;{LL.NO_DATA_2()}&nbsp;
+              {LL.NO_DATA_3()}&nbsp;
+              <Link to="/devices" style={{ color: 'white' }}>
+                {LL.DEVICES()}
+              </Link>
+              .
+            </Typography>
+          </MessageBox>
+        )}
+
+        {data.length > 0 && (
+          <Box
+            padding={1}
+            justifyContent="center"
+            flexDirection="column"
+            sx={{
+              borderRadius: 1,
+              border: '1px solid grey'
             }}
           >
-            {!loading && data.length === 0 ? (
-              <Typography variant="subtitle2" color="secondary">
-                {LL.NO_DATA()}
-              </Typography>
-            ) : (
+            <IconContext.Provider
+              value={{
+                color: 'lightblue',
+                size: '18',
+                style: { verticalAlign: 'middle' }
+              }}
+            >
               <Table
                 data={{ nodes: data }}
                 theme={dashboard_theme}
@@ -338,9 +352,9 @@ const Dashboard = () => {
                   </Body>
                 )}
               </Table>
-            )}
-          </IconContext.Provider>
-        </Box>
+            </IconContext.Provider>
+          </Box>
+        )}
       </>
     );
   };

diff --git a/interface/src/i18n/cz/index.ts b/interface/src/i18n/cz/index.ts
@@ -340,11 +340,12 @@ const cz: Translation = {
   RESTARTING_POST: 'Příprava',
   AUTO_SCROLL: 'Automatické rolování',
   DASHBOARD: 'Dashboard',
-  NO_DATA: 'Žádná data nejsou k dispozici',
   DASHBOARD_1: 'Přizpůsobte si dashboard označením EMS entit jako Oblíbené pomocí modulu Přizpůsobení',
   DEVELOPER_MODE: 'Režim vývojáře',
   DUPLICATE: 'Duplicate', // TODO translate
-  UPGRADE: 'Upgrade' // TODO translate
+  NO_DATA_1: 'No favourite EMS entities found. 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
 };
 
 export default cz;
diff --git a/interface/src/i18n/de/index.ts b/interface/src/i18n/de/index.ts
@@ -340,11 +340,13 @@ const de: Translation = {
   RESTARTING_POST: 'Vorbereitung',
   AUTO_SCROLL: 'Automatisches Scrollen',
   DASHBOARD: 'Dashboard',
-  NO_DATA: 'Keine Daten verfügbar',
   DASHBOARD_1: 'Passen Sie Ihr Dashboard an, indem Sie EMS-Entitäten mithilfe des Moduls „Anpassungen“ als Favorit markieren',
   DEVELOPER_MODE: 'Entwicklermodus',
   DUPLICATE: 'Kopieren',
-  UPGRADE: 'Aktualisieren'
+  UPGRADE: 'Aktualisieren',
+  NO_DATA_1: 'No favourite EMS entities found. 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
 };
 
 export default de;
diff --git a/interface/src/i18n/en/index.ts b/interface/src/i18n/en/index.ts
@@ -340,11 +340,13 @@ const en: Translation = {
   RESTARTING_POST: 'Preparing',
   AUTO_SCROLL: 'Auto Scroll',
   DASHBOARD: 'Dashboard',
-  NO_DATA: 'No data available',
-  DASHBOARD_1: 'Customize your dashboard by marking EMS entities as Favorite using the Customizations module',
+  DASHBOARD_1: 'The Dashboard shows all EMS entities that are active and marked as a Favorite, plus any Custom Entities, Schedules and external Sensors.',
   DEVELOPER_MODE: 'Developer Mode',
   DUPLICATE: 'Duplicate',
-  UPGRADE: 'Upgrade'
+  UPGRADE: 'Upgrade',
+  NO_DATA_1: 'No favourite EMS entities found. Use the',
+  NO_DATA_2: 'module to mark them.',
+  NO_DATA_3: 'To see all available entities go to'
 };
 
 export default en;
diff --git a/interface/src/i18n/fr/index.ts b/interface/src/i18n/fr/index.ts
@@ -340,11 +340,13 @@ const fr: Translation = {
   RESTARTING_POST: 'Preparing', // TODO translate
   AUTO_SCROLL: 'Auto Scroll', // TODO translate
   DASHBOARD: 'Dashboard', // TODO translate
-  NO_DATA: 'No data available', // TODO translate
   DASHBOARD_1: 'Customize your dashboard by marking EMS entities as Favorite using the Customizations module', // TODO translate
   DEVELOPER_MODE: 'Developer Mode', // TODO translate
   DUPLICATE: 'Duplicate', // TODO translate
-  UPGRADE: 'Upgrade' // TODO translate
+  UPGRADE: 'Upgrade', // TODO translate
+  NO_DATA_1: 'No favourite EMS entities found. 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
 };
 
 export default fr;
diff --git a/interface/src/i18n/it/index.ts b/interface/src/i18n/it/index.ts
@@ -340,11 +340,13 @@ const it: Translation = {
   RESTARTING_POST: 'Preparing', // TODO translate
   AUTO_SCROLL: 'Auto Scroll', // TODO translate
   DASHBOARD: 'Dashboard', // TODO translate
-  NO_DATA: 'No data available', // TODO translate
   DASHBOARD_1: 'Customize your dashboard by marking EMS entities as Favorite using the Customizations module', // TODO translate
   DEVELOPER_MODE: 'Developer Mode', // TODO translate
   DUPLICATE: 'Duplicate', // TODO translate
-  UPGRADE: 'Upgrade' // TODO translate
+  UPGRADE: 'Upgrade', // TODO translate
+  NO_DATA_1: 'No favourite EMS entities found. 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
 };
 
 export default it;
diff --git a/interface/src/i18n/nl/index.ts b/interface/src/i18n/nl/index.ts
@@ -340,11 +340,13 @@ const nl: Translation = {
   RESTARTING_POST: 'Voorbereiding',
   AUTO_SCROLL: 'Automatisch Scrollen',
   DASHBOARD: 'Dashboard',
-  NO_DATA: 'Geen data beschikbaar',
   DASHBOARD_1: 'Pas uw dashboard aan door EMS-entiteiten als favoriet te markeren met behulp van de module Aanpassingen',
   DEVELOPER_MODE: 'Ontwikkelaarsmodus',
   DUPLICATE: 'Duplicaat',
-  UPGRADE: 'Upgraden'
+  UPGRADE: 'Upgraden',
+  NO_DATA_1: 'Geen favorite EMS entiteiten gevonden. Gebruik de',
+  NO_DATA_2: 'module om ze te markeren.',
+  NO_DATA_3: 'Om alle beschikbare entiteiten te bekijken ga naar'
 };
 
 export default nl;
diff --git a/interface/src/i18n/no/index.ts b/interface/src/i18n/no/index.ts
@@ -340,11 +340,13 @@ const no: Translation = {
   RESTARTING_POST: 'Preparing', // TODO translate
   AUTO_SCROLL: 'Auto Scroll', // TODO translate
   DASHBOARD: 'Dashboard', // TODO translate
-  NO_DATA: 'No data available', // TODO translate
   DASHBOARD_1: 'Customize your dashboard by marking EMS entities as Favorite using the Customizations module', // TODO translate
   DEVELOPER_MODE: 'Developer Mode', // TODO translate
   DUPLICATE: 'Duplicate', // TODO translate
-  UPGRADE: 'Upgrade' // TODO translate
+  UPGRADE: 'Upgrade', // TODO translate
+  NO_DATA_1: 'No favourite EMS entities found. 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
 };
 
 export default no;
diff --git a/interface/src/i18n/pl/index.ts b/interface/src/i18n/pl/index.ts
@@ -340,11 +340,13 @@ const pl: BaseTranslation = {
   RESTARTING_POST: 'Preparing', // TODO translate
   AUTO_SCROLL: 'Auto Scroll', // TODO translate
   DASHBOARD: 'Dashboard', // TODO translate
-  NO_DATA: 'No data available', // TODO translate
   DASHBOARD_1: 'Customize your dashboard by marking EMS entities as Favorite using the Customizations module', // TODO translate
   DEVELOPER_MODE: 'Developer Mode', // TODO translate
   DUPLICATE: 'Duplicate', // TODO translate
-  UPGRADE: 'Upgrade' // TODO translate
+  UPGRADE: 'Upgrade', // TODO translate
+  NO_DATA_1: 'No favourite EMS entities found. 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
 };
 
 export default pl;
diff --git a/interface/src/i18n/sk/index.ts b/interface/src/i18n/sk/index.ts
@@ -340,11 +340,13 @@ const sk: Translation = {
   RESTARTING_POST: 'Príprava',
   AUTO_SCROLL: 'Automatické rolovanie',
   DASHBOARD: 'Panel',
-  NO_DATA: 'Nie sú k dispozícii žiadne údaje',
   DASHBOARD_1: 'Prispôsobte si svoj informačný panel tak, že označíte entity EMS ako Obľúbené pomocou modulu Prispôsobenia',
   DEVELOPER_MODE: 'Režim vývojára',
   DUPLICATE: 'Duplicitné',
-  UPGRADE: 'Inovovať'
+  UPGRADE: 'Inovovať',
+  NO_DATA_1: 'No favourite EMS entities found. 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
 };
 
 export default sk;
diff --git a/interface/src/i18n/sv/index.ts b/interface/src/i18n/sv/index.ts
@@ -340,11 +340,13 @@ const sv: Translation = {
   RESTARTING_POST: 'Förbereder',
   AUTO_SCROLL: 'Autoskrolla',
   DASHBOARD: 'Kontrollpanel',
-  NO_DATA: 'Ingen data tillgänglig',
   DASHBOARD_1: 'Anpassa din kontrollpanel genom att markera EMS enheter som Favorit i modulen Anpassningar',
   DEVELOPER_MODE: 'Utvecklarläge',
   DUPLICATE: 'Dublett',
-  UPGRADE: 'Uppgradera'
+  UPGRADE: 'Uppgradera',
+  NO_DATA_1: 'Inga EMS entiteter har markeras som Favorit. Använd',
+  NO_DATA_2: 'modulen Anpassningar för att markera dem.',
+  NO_DATA_3: 'För att se alla tillgängliga entiteter gå till'
 };
 
 export default sv;
diff --git a/interface/src/i18n/tr/index.ts b/interface/src/i18n/tr/index.ts
@@ -340,11 +340,13 @@ const tr: Translation = {
   RESTARTING_POST: 'Preparing', // TODO translate
   AUTO_SCROLL: 'Auto Scroll', // TODO translate
   DASHBOARD: 'Dashboard', // TODO translate
-  NO_DATA: 'No data available', // TODO translate
   DASHBOARD_1: 'Customize your dashboard by marking EMS entities as Favorite using the Customizations module', // TODO translate
   DEVELOPER_MODE: 'Developer Mode', // TODO translate
   DUPLICATE: 'Duplicate', // TODO translate
-  UPGRADE: 'Upgrade' // TODO translate
+  UPGRADE: 'Upgrade', // TODO translate
+  NO_DATA_1: 'No favourite EMS entities found. 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
 };
 
 export default tr;
diff --git a/mock-api/rest_server.ts b/mock-api/rest_server.ts
@@ -4507,7 +4507,7 @@ router
 
     let fake = false;
 
-    // fake = true; // for testing
+    // fake = true; // for testing, shows a subset of data
 
     if (!fake) {
       // pick EMS devices from coredata
@@ -4603,35 +4603,37 @@ router
       // for testing only
 
       // add the custom entity data
-      // dashboard_object = {
-      //   id: DeviceTypeUniqueID.CUSTOM_UID, // unique ID for custom entities
-      //   t: DeviceType.CUSTOM,
-      //   nodes: getDashboardEntityData(99)
-      // };
-      // // only add to dashboard if we have values
-      // if ((dashboard_object.nodes ?? []).length > 0) {
-      //   dashboard_data.push(dashboard_object);
-      // }
-
-      let scheduler_data = emsesp_schedule.schedule.filter((item) => item.name);
-      let scheduler_data2 = scheduler_data.map((item, index) => ({
-        id: DeviceTypeUniqueID.SCHEDULER_UID * 100 + index,
-        dv: {
-          id: '00' + item.name,
-          v: item.active ? 'on' : 'off',
-          c: item.name,
-          l: ['off', 'on']
-        }
-      }));
       dashboard_object = {
-        id: DeviceTypeUniqueID.SCHEDULER_UID,
-        t: DeviceType.SCHEDULER,
-        nodes: scheduler_data2
+        id: DeviceTypeUniqueID.CUSTOM_UID, // unique ID for custom entities
+        t: DeviceType.CUSTOM,
+        nodes: getDashboardEntityData(DeviceTypeUniqueID.CUSTOM_UID)
       };
       // only add to dashboard if we have values
       if ((dashboard_object.nodes ?? []).length > 0) {
         dashboard_data.push(dashboard_object);
       }
+
+      // add the scheduler data
+      // let scheduler_data = emsesp_schedule.schedule.filter((item) => item.name);
+      // let scheduler_data2 = scheduler_data.map((item, index) => ({
+      //   id: DeviceTypeUniqueID.SCHEDULER_UID * 100 + index,
+      //   dv: {
+      //     id: '00' + item.name,
+      //     v: item.active ? 'on' : 'off',
+      //     c: item.name,
+      //     l: ['off', 'on']
+      //   }
+      // }));
+      // dashboard_object = {
+      //   id: DeviceTypeUniqueID.SCHEDULER_UID,
+      //   t: DeviceType.SCHEDULER,
+      //   nodes: scheduler_data2
+      // };
+
+      // only add to dashboard if we have values
+      // if ((dashboard_object.nodes ?? []).length > 0) {
+      //   dashboard_data.push(dashboard_object);
+      // }
     }
 
     // console.log('dashboard_data: ', dashboard_data);