some more stuffs.

frontend/src/lib/components/DeviceIcon.svelte

@@ -11,6 +11,10 @@
   import hue_lightbulb_gu10 from "./icons/hue_lightbulb_gu10.svg?raw";
   import hue_adore_tube from "./icons/hue_adore_tube.svg?raw";
   import hue_playbar from "./icons/hue_playbar.svg?raw";
+  import hue_go from "./icons/hue_go.svg?raw";
+  import square from "./icons/square.svg?raw";
+  import hexagon from "./icons/hexagon.svg?raw";
+  import triangle from "./icons/triangle.svg?raw";
 
   export const iconMap = Object.seal({
     generic_lamp,
@@ -25,6 +29,10 @@
     hue_lightbulb_gu10,
     hue_adore_tube,
     hue_playbar,
+    square,
+    hexagon,
+    triangle,
+    hue_go,
   });
 
   export type IconName = keyof typeof iconMap;
@@ -44,16 +52,18 @@
   $: voldemort = rgbToHex(darkColor);
 
   let icon: string;
-  $: icon = iconMap[name];
+  $: icon = iconMap[name] || iconMap.generic_lamp;
 
   let dataUrl: string;
   $: {
-    const data = encodeURIComponent(
-      icon
-        .replaceAll("fill:#ff0000", `fill:${gandalf}`)
-        .replaceAll("fill:#0000ff", `fill:${voldemort}`)
-    );
-    dataUrl = `data:image/svg+xml;url,${data}`
+    if (icon != null) {
+      const data = encodeURIComponent(
+        icon
+          .replaceAll("fill:#ff0000", `fill:${gandalf}`)
+          .replaceAll("fill:#0000ff", `fill:${voldemort}`)
+      );
+      dataUrl = `data:image/svg+xml;url,${data}`
+    }
   }
 </script>