feat(waybar): implement all dummy widgets

src/components/Waybar/Widgets/WaybarTemperatureWidget.tsx

@@ -0,0 +1,29 @@
+import { useEffect, useState } from "react";
+import { WaybarWidget } from "../WaybarWidget";
+import { clamp, randomMinMax } from "~/utils/math";
+
+export const WaybarTemperatureWidget = (props: {
+  min: number;
+  max: number;
+  variation: number;
+  frequency: number;
+}) => {
+  const [temperature, setTemperature] = useState(
+    randomMinMax(props.min, props.max),
+  );
+
+  useEffect(() => {
+    const interval = setInterval(() => {
+      const offset = randomMinMax(-props.variation, props.variation + 1);
+      setTemperature((x) => clamp(x + offset, props.min, props.max));
+    }, props.frequency);
+
+    return () => clearInterval(interval);
+  });
+
+  return (
+    <WaybarWidget className="pl-3 pr-[0.625rem]">
+       {temperature}°C
+    </WaybarWidget>
+  );
+};