From 6e576faefd6097b860c0fe4e8f4bfc286ac8219d Mon Sep 17 00:00:00 2001
From: Daniel Kluge <daniel.kluge.98@gmx.de>
Date: Thu, 6 Jan 2022 21:15:17 +0100
Subject: [PATCH] Last improvements

---
 src/components/DVB.tsx            |  7 +++----
 src/components/PlantState.tsx     |  1 -
 src/components/Spotify.tsx        | 17 +++++++++++------
 src/components/WeatherAndTime.tsx | 15 +++++++++------
 src/lib/interfaces.ts             |  7 +++++++
 5 files changed, 30 insertions(+), 17 deletions(-)

diff --git a/src/components/DVB.tsx b/src/components/DVB.tsx
index 9c05fd0..80ab66b 100644
--- a/src/components/DVB.tsx
+++ b/src/components/DVB.tsx
@@ -10,11 +10,10 @@ const DVB = ({ stopId }: { stopId: number }) => {
     const [departuresTable, setDeparturesTable] = React.useState([])
 
     React.useEffect(() => {
-        //pullDepartures();
-        // TODO
-        //const dvbInterval = setInterval(pullDepartures, DVB_REFRESH_INTERVAL);
+        pullDepartures();
+        const dvbInterval = setInterval(pullDepartures, DVB_REFRESH_INTERVAL);
 
-        //return () => clearInterval(dvbInterval);
+        return () => clearInterval(dvbInterval);
     }, [])
 
     const processDepatures = (departures: Departure[]) => {
diff --git a/src/components/PlantState.tsx b/src/components/PlantState.tsx
index 2375e9d..11711d8 100644
--- a/src/components/PlantState.tsx
+++ b/src/components/PlantState.tsx
@@ -22,7 +22,6 @@ const PlantState = ({ hassUrl, token, plants }: { hassUrl: string, token: string
             plantStates[plant] = data.attributes
         }
 
-        console.log(plantStates);
         setPlantStates(plantStates);
     }
 
diff --git a/src/components/Spotify.tsx b/src/components/Spotify.tsx
index 3d55852..1f7f7bf 100644
--- a/src/components/Spotify.tsx
+++ b/src/components/Spotify.tsx
@@ -1,14 +1,19 @@
 import * as React from "react"
 //import useWebSocket from "react-use-websocket";
 import {connect} from "mqtt"
-import type { SecretsMQTT } from "../lib/interfaces"
+import type { SecretsMQTT, SongInfo } from "../lib/interfaces"
 import * as styles from "../styles/containers/Spotify.module.css"
 
 const Spotify = ({ mqtt, Alternative }: { mqtt: SecretsMQTT, Alternative: any }) => {
-    const [lastSongInfo, setLastSongInfo] = React.useState<string>("")
+    const [lastSongInfo, setLastSongInfo] = React.useState<SongInfo|undefined>(undefined)
 
     const handleMessage = (_topic: string, message: string) => {
-        setLastSongInfo(message.toString())
+        try {
+            const songInfo: SongInfo = JSON.parse(message.toString());
+            setLastSongInfo(songInfo);
+        } catch {
+            console.warn(`Can't parse song info: ${message.toString()}`);
+        }
     }
 
     React.useEffect(() => {
@@ -18,10 +23,10 @@ const Spotify = ({ mqtt, Alternative }: { mqtt: SecretsMQTT, Alternative: any })
             protocol: "mqtt"
         });
 
-        client.on("message", handleMessage)
+        client.on("message", handleMessage);
 
         client.on("connect", () => {
-            console.log("CONNECTED")
+            //console.log("CONNECTED")
             client.publish("infoscreen/hello", "hello");
             client.subscribe("infoscreen/spotify")
         })
@@ -29,7 +34,7 @@ const Spotify = ({ mqtt, Alternative }: { mqtt: SecretsMQTT, Alternative: any })
         return () => {client.end()}
     }, [])
 
-    if (true /*!lastJsonMessage || lastJsonMessage.playbackState !== "Play"*/) {
+    if (true || !lastSongInfo || lastSongInfo.playbackState !== "PLAYING") {
         return Alternative;
     }
 
diff --git a/src/components/WeatherAndTime.tsx b/src/components/WeatherAndTime.tsx
index 1baac6d..2dc6330 100644
--- a/src/components/WeatherAndTime.tsx
+++ b/src/components/WeatherAndTime.tsx
@@ -6,7 +6,6 @@ import * as styles from "../styles/containers/WeatherAndTime.module.css";
 const WEATHER_REFRESH_INTERVAL = 15 * 60 * 1000;
 
 function getWeatherIcon(icon: string) {
-    //const isNight = document.querySelector(':root[data-theme="night"]') !== null
     let weatherIcon: string;
     switch (icon) {
         case "clear-day":
@@ -26,8 +25,13 @@ function getWeatherIcon(icon: string) {
             break;
         default: weatherIcon = icon
     }
-    const ImportedIcon = require(`../images/weather-icons/svg/wi-${weatherIcon}.svg`);
-    return <ImportedIcon />
+    try {
+        const ImportedIcon = require(`../images/weather-icons/svg/wi-${weatherIcon}.svg`);
+        return <ImportedIcon />
+    } catch {
+        const ImportedIcon = require("../images/weather-icons/svg/wi-alien.svg");
+        return <ImportedIcon />
+    }
 }
 
 const WeatherAndTime = ({ secrets }: { secrets: SecretsWeather }) => {
@@ -57,12 +61,11 @@ const WeatherAndTime = ({ secrets }: { secrets: SecretsWeather }) => {
         }, 1000);
 
         pullWeather()
-        //TODO
-        //const weatherInterval = setInterval(pullWeather, WEATHER_REFRESH_INTERVAL);
+        const weatherInterval = setInterval(pullWeather, WEATHER_REFRESH_INTERVAL);
 
         return () => {
             clearInterval(dateInterval);
-            //clearInterval(weatherInterval);
+            clearInterval(weatherInterval);
         }
     }, [])
 
diff --git a/src/lib/interfaces.ts b/src/lib/interfaces.ts
index aed595a..99eb142 100644
--- a/src/lib/interfaces.ts
+++ b/src/lib/interfaces.ts
@@ -70,4 +70,11 @@ export interface PlantState {
         moisture: string;
         temperature: string;
     }
+}
+
+export interface SongInfo {
+    playbackState: "PLAYING" | "PAUSE" | "STOPPED";
+    title: string;
+    artists: string[];
+    album: string;
 }
\ No newline at end of file