Translate Device Name #872

interface/src/project/DashboardData.tsx

@@ -142,7 +142,7 @@ const DashboardData: FC = () => {
     common_theme,
     {
       Table: `
-        --data-table-library_grid-template-columns: 40px 100px repeat(1, minmax(0, 1fr)) 100px 40px;
+        --data-table-library_grid-template-columns: 40px 160px repeat(1, minmax(0, 1fr)) 100px 40px;
       `,
       BaseRow: `
         .td {
@@ -704,9 +704,9 @@ const DashboardData: FC = () => {
               {tableList.map((device: Device, index: number) => (
                 <Row key={device.id} item={device}>
                   <Cell stiff>
-                    <DeviceIcon type={device.t} />
+                    <DeviceIcon type_id={device.t} />
                   </Cell>
-                  <Cell stiff>{device.t}</Cell>
+                  <Cell stiff>{device.tn}</Cell>
                   <Cell>{device.n}</Cell>
                   <Cell stiff>{device.e}</Cell>
                   <Cell stiff>
@@ -719,7 +719,7 @@ const DashboardData: FC = () => {
               {(coreData.active_sensors > 0 || coreData.analog_enabled) && (
                 <Row key="sensor" item={{ id: 'sensor' }}>
                   <Cell>
-                    <DeviceIcon type="Sensor" />
+                    <DeviceIcon type_id={1} />
                   </Cell>
                   <Cell>Sensors</Cell>
                   <Cell>{LL.ATTACHED_SENSORS()}</Cell>

interface/src/project/DeviceIcon.tsx

@@ -13,32 +13,35 @@ import { AiOutlineAlert } from 'react-icons/ai';
 import { AiOutlineChrome } from 'react-icons/ai';
 
 interface DeviceIconProps {
-  type: string;
+  type_id: number;
 }
 
-const DeviceIcon: FC<DeviceIconProps> = ({ type }) => {
-  switch (type) {
-    case 'Boiler':
-      return <CgSmartHomeBoiler />;
-    case 'Sensor':
+// matches emsdevice.h DeviceType
+const DeviceIcon: FC<DeviceIconProps> = ({ type_id }) => {
+  switch (type_id) {
+    case 1:
+    case 2:
       return <MdOutlineSensors />;
-    case 'Solar':
-      return <FaSolarPanel />;
-    case 'Thermostat':
+    case 3:
+      return <CgSmartHomeBoiler />;
+    case 4:
       return <MdThermostatAuto />;
-    case 'Mixer':
+    case 5:
       return <AiOutlineControl />;
-    case 'Heatpump':
+    case 6:
+      return <FaSolarPanel />;
+    case 7:
       return <GiHeatHaze />;
-    case 'Switch':
-      return <TiFlowSwitch />;
-    case 'Connect':
-      return <VscVmConnect />;
-    case 'Gateway':
+    case 8:
       return <AiOutlineGateway />;
-    case 'Alert':
+    case 9:
+      return <TiFlowSwitch />;
+    case 10:
+    case 11:
+      return <VscVmConnect />;
+    case 12:
       return <AiOutlineAlert />;
-    case 'Pump':
+    case 13:
       return <AiOutlineChrome />;
     default:
       return null;

interface/src/project/SettingsCustomization.tsx

@@ -180,7 +180,7 @@ const SettingsCustomization: FC = () => {
     return (
       <>
         {de.n && (de.n[0] === '!' ? LL.COMMAND() + ': ' + de.n.slice(1) : de.cn && de.cn !== '' ? de.cn : de.n) + ' '}(
-        <Link target="_blank" href={APIURL + devices?.devices[selectedDevice].t + '/' + de.id}>
+        <Link target="_blank" href={APIURL + devices?.devices[selectedDevice].tn + '/' + de.id}>
           {de.id}
         </Link>
         )

interface/src/project/types.ts

@@ -59,7 +59,8 @@ export interface Status {
 }
 export interface Device {
   id: string; // id index
-  t: string; // type
+  tn: string; // device type translated name
+  t: number; // device type id
   b: string; // brand
   n: string; // name
   d: number; // deviceid
@@ -110,7 +111,8 @@ export interface DeviceShort {
   d?: number; // deviceid
   p?: number; // productid
   s: string; // shortname
-  t?: string; // device type name
+  t?: number; // device type id
+  tn?: string; // device type internal name
 }
 
 export interface Devices {