feat: better icons for smart meters and Remo E (lite)

components/NatureDeviceCard.vue

@@ -7,7 +7,8 @@
       <div class="flex flex-row items-center gap-4">
         <div class="flex-1 flex flex-col items-center gap-4 overflow-hidden">
           <div
-            class="w-20 h-20 i-solar-notification-unread-outline text-gray-800 dark:text-gray-200"
+            class="w-20 h-20 text-gray-800 dark:text-gray-200"
+            :class="getNatureDeviceIcon(device)"
           />
           <div class="max-w-full truncate" v-text="device.name" />
         </div>

pages/devices/[id].vue

@@ -3,7 +3,8 @@
     <div id="overview" class="relative flex flex-row items-start gap-16">
       <div class="flex-none flex flex-col items-center gap-2 overflow-hidden">
         <div
-          class="w-32 h-32 i-solar-notification-unread-outline text-gray-800 dark:text-gray-200"
+          class="w-32 h-32 text-gray-800 dark:text-gray-200"
+          :class="getNatureDeviceIcon(device)"
         />
         <div class="max-w-full text-2xl line-clamp-2" v-text="device.name" />
       </div>

utils/natureDeviceIcons.ts

@@ -0,0 +1,7 @@
+import type { NatureDevice } from "./natureTypes";
+
+export function getNatureDeviceIcon(device: NatureDevice): string {
+  return /^remo-e(-lite)?\//i.test(device.firmware_version)
+    ? "i-solar-graph-new-linear"
+    : "i-solar-notification-unread-outline";
+}

utils/icons.ts → utils/natureIcons.ts

@@ -17,9 +17,9 @@ const MAP: ReadonlyMap<NatureIcon, string> = new Map([
   ["ico_light_projector", "i-ph-lamp-light"],
   ["ico_lock", "i-ph-app-window-light"],
   ["ico_power_dist_board", "i-ph-app-window-light"],
-  ["ico_projector", "i-ph-app-window-light"],
+  ["ico_projector", "i-ph-projector-screen-chart-light"],
   ["ico_robot", "i-ph-app-window-light"],
-  ["ico_smartmeter", "i-ph-app-window-light"],
+  ["ico_smartmeter", "i-ph-wave-sine-light"],
   ["ico_solarpower", "i-ph-app-window-light"],
   ["ico_tv", "i-ph-television-simple-light"],
   ["ico_other", "i-ph-app-window-light"],