From 6c7ca537035a58a47bee9fb0e2073302f54b1fb0 Mon Sep 17 00:00:00 2001
From: Kuba Orlik <kontakt@kuba-orlik.name>
Date: Fri, 16 Aug 2024 23:27:48 +0200
Subject: [PATCH] Add derivative displays

---
 src/back/routes/dashboard.sreact.tsx | 75 +++++++++++++++++++++-------
 1 file changed, 56 insertions(+), 19 deletions(-)

diff --git a/src/back/routes/dashboard.sreact.tsx b/src/back/routes/dashboard.sreact.tsx
index 7552d51..51b4c77 100644
--- a/src/back/routes/dashboard.sreact.tsx
+++ b/src/back/routes/dashboard.sreact.tsx
@@ -34,6 +34,11 @@ async function with_unit(s: HA_RESPONSE | Promise<HA_RESPONSE>) {
 	return `${s.state}${s.attributes.unit_of_measurement as string}`;
 }
 
+async function arrow(entity: string) {
+	const number = parseFloat((await get_state(entity)).state);
+	return number < 0 ? "↓" : number > 0 ? "↑" : "=";
+}
+
 export default new (class DashboardPage extends StatefulPage<State, typeof actions> {
 	actions = actions;
 
@@ -49,18 +54,8 @@ export default new (class DashboardPage extends StatefulPage<State, typeof actio
 		}
 	}
 
-	render(ctx: BaseContext, state: State, inputs: Record<string, string>) {
+	async render(ctx: BaseContext, state: State, inputs: Record<string, string>) {
 		const date = new Date();
-		const stuff = [
-			{ label: "Temperatura na balkonie", entity: "input_number.balkon_average" },
-			{ label: "Temperatura w salonie", entity: "sensor.ewelink_th01_temperature" },
-			{ label: "Wilgotność w salonie", entity: "sensor.ewelink_th01_humidity" },
-			{ label: "Temperatura na strychu", entity: "sensor.strych_temperature_3" },
-			{
-				label: "Docelowa temp. na strychu",
-				entity: "input_number.strych_target_temperature",
-			},
-		];
 
 		return (
 			<div style="font-size: 2rem">
@@ -70,14 +65,56 @@ export default new (class DashboardPage extends StatefulPage<State, typeof actio
 				</div>
 				<table style="margin: 0 auto">
 					<tbody>
-						{stuff.map(({ label, entity }) => (
-							<tr>
-								<td style="text-align: right">{label}:</td>
-								<td>
-									<strong>{with_unit(get_state(entity))}</strong>
-								</td>
-							</tr>
-						))}
+						<tr>
+							<td style="text-align: right">Temperatura na balkonie:</td>
+							<td>
+								<strong>
+									{with_unit(get_state("input_number.balkon_average"))}
+									{arrow("sensor.balkon_temperature_derivative")}
+								</strong>
+							</td>
+						</tr>
+						<tr>
+							<td style="text-align: right">Temperatura w salonie:</td>
+							<td>
+								<strong>
+									{with_unit(
+										get_state("sensor.ewelink_th01_temperature")
+									)}
+									{arrow("sensor.temperatura_w_salonie_derivative")}
+								</strong>
+							</td>
+						</tr>
+						<tr>
+							<td style="text-align: right">Wilgotność w salonie</td>
+							<td>
+								<strong>
+									{with_unit(get_state("sensor.ewelink_th01_humidity"))}
+								</strong>
+							</td>
+						</tr>
+						<tr>
+							<td style="text-align: right">Temperatura na strychu</td>
+							<td>
+								<strong>
+									{with_unit(get_state("sensor.strych_temperature_3"))}
+									{arrow("sensor.strych_temperature_derivative")}
+								</strong>
+							</td>
+						</tr>
+						{/*
+						<tr>
+							<td style="text-align: right">Docelowa temp. na strychu</td>
+							<td>
+								<strong>
+									{with_unit(
+										get_state(
+											"input_number.strych_target_temperature"
+										)
+									)}
+								</strong>
+							</td>
+							</tr>*/}
 					</tbody>
 				</table>
 				{this.makeActionButton(state, {