Converted a significant amount of files from js to ts.

modules/menus/calendar/weather/hourly/icon/index.ts

@@ -1,6 +1,8 @@
+import { Weather } from "lib/types/weather.js";
+import { Variable } from "types/variable.js";
 import icons from "../../../../../icons/index.js";
 
-export const HourlyIcon = (theWeather, getNextEpoch) => {
+export const HourlyIcon = (theWeather: Variable<Weather>, getNextEpoch: any) => {
     return Widget.Icon({
         class_name: "hourly-weather-icon",
         icon: theWeather.bind("value").as((w) => {
@@ -16,9 +18,11 @@ export const HourlyIcon = (theWeather, getNextEpoch) => {
             let iconQuery = weatherAtEpoch?.condition.text
                 .trim()
                 .toLowerCase()
-                .replaceAll(" ", "_");
+                .replaceAll(" ", "_")
+                || "warning"
+                ;
 
-            if (!weatherAtEpoch?.isDay && iconQuery === "partly_cloudy") {
+            if (!weatherAtEpoch?.is_day && iconQuery === "partly_cloudy") {
                 iconQuery = "partly_cloudy_night";
             }
 

modules/menus/calendar/weather/hourly/index.js

@@ -1,44 +0,0 @@
-import { HourlyIcon } from "./icon/index.js";
-import { HourlyTemp } from "./temperature/index.js";
-import { HourlyTime } from "./time/index.js";
-
-export const Hourly = (theWeather) => {
-  return Widget.Box({
-    vertical: false,
-    hexpand: true,
-    hpack: "fill",
-    class_name: "hourly-weather-container",
-    children: [1, 2, 3, 4].map((hoursFromNow) => {
-      const getNextEpoch = (wthr) => {
-        const currentEpoch = wthr.location.localtime_epoch;
-        const epochAtHourStart = currentEpoch - (currentEpoch % 3600);
-        let nextEpoch = 3600 * hoursFromNow + epochAtHourStart;
-
-        const curHour = new Date(currentEpoch * 1000).getHours();
-
-        /*
-         * NOTE: Since the API is only capable of showing the current day; if
-         * the hours left in the day are less than 4 (aka spilling into the next day),
-         * then rewind to contain the prediction within the current day.
-         */
-        if (curHour > 19) {
-          const hoursToRewind = curHour - 19;
-          nextEpoch =
-            3600 * hoursFromNow + epochAtHourStart - hoursToRewind * 3600;
-        }
-        return nextEpoch;
-      };
-
-      return Widget.Box({
-        class_name: "hourly-weather-item",
-        hexpand: true,
-        vertical: true,
-        children: [
-          HourlyTime(theWeather, getNextEpoch),
-          HourlyIcon(theWeather, getNextEpoch),
-          HourlyTemp(theWeather, getNextEpoch),
-        ],
-      });
-    }),
-  });
-};

modules/menus/calendar/weather/hourly/index.ts

@@ -0,0 +1,46 @@
+import { Weather } from "lib/types/weather";
+import { Variable } from "types/variable";
+import { HourlyIcon } from "./icon/index.js";
+import { HourlyTemp } from "./temperature/index.js";
+import { HourlyTime } from "./time/index.js";
+
+export const Hourly = (theWeather: Variable<Weather>) => {
+    return Widget.Box({
+        vertical: false,
+        hexpand: true,
+        hpack: "fill",
+        class_name: "hourly-weather-container",
+        children: [1, 2, 3, 4].map((hoursFromNow) => {
+            const getNextEpoch = (wthr: Weather) => {
+                const currentEpoch = wthr.location.localtime_epoch;
+                const epochAtHourStart = currentEpoch - (currentEpoch % 3600);
+                let nextEpoch = 3600 * hoursFromNow + epochAtHourStart;
+
+                const curHour = new Date(currentEpoch * 1000).getHours();
+
+                /*
+                 * NOTE: Since the API is only capable of showing the current day; if
+                 * the hours left in the day are less than 4 (aka spilling into the next day),
+                 * then rewind to contain the prediction within the current day.
+                 */
+                if (curHour > 19) {
+                    const hoursToRewind = curHour - 19;
+                    nextEpoch =
+                        3600 * hoursFromNow + epochAtHourStart - hoursToRewind * 3600;
+                }
+                return nextEpoch;
+            };
+
+            return Widget.Box({
+                class_name: "hourly-weather-item",
+                hexpand: true,
+                vertical: true,
+                children: [
+                    HourlyTime(theWeather, getNextEpoch),
+                    HourlyIcon(theWeather, getNextEpoch),
+                    HourlyTemp(theWeather, getNextEpoch),
+                ],
+            });
+        }),
+    });
+};

modules/menus/calendar/weather/hourly/temperature/index.js

@@ -1,27 +0,0 @@
-import options from "options";
-
-const { unit } = options.menus.clock.weather;
-
-export const HourlyTemp = (theWeather, getNextEpoch) => {
-  return Widget.Label({
-    class_name: "hourly-weather-temp",
-    label: Utils.merge(
-      [theWeather.bind("value"), unit.bind("value")],
-      (wthr, unt) => {
-        if (!Object.keys(wthr).length) {
-          return "-";
-        }
-
-        const nextEpoch = getNextEpoch(wthr);
-        const weatherAtEpoch = wthr.forecast.forecastday[0].hour.find(
-          (h) => h.time_epoch === nextEpoch,
-        );
-
-        if (unt === "imperial") {
-          return `${weatherAtEpoch ? Math.ceil(weatherAtEpoch.temp_f) : "-"}° F`;
-        }
-        return `${weatherAtEpoch ? Math.ceil(weatherAtEpoch.temp_c) : "-"}° C`;
-      },
-    ),
-  });
-};

modules/menus/calendar/weather/hourly/temperature/index.ts

@@ -0,0 +1,29 @@
+import { Weather } from "lib/types/weather";
+import { Variable } from "types/variable";
+import options from "options";
+
+const { unit } = options.menus.clock.weather;
+
+export const HourlyTemp = (theWeather: Variable<Weather>, getNextEpoch: any) => {
+    return Widget.Label({
+        class_name: "hourly-weather-temp",
+        label: Utils.merge(
+            [theWeather.bind("value"), unit.bind("value")],
+            (wthr, unt) => {
+                if (!Object.keys(wthr).length) {
+                    return "-";
+                }
+
+                const nextEpoch = getNextEpoch(wthr);
+                const weatherAtEpoch = wthr.forecast.forecastday[0].hour.find(
+                    (h) => h.time_epoch === nextEpoch,
+                );
+
+                if (unt === "imperial") {
+                    return `${weatherAtEpoch ? Math.ceil(weatherAtEpoch.temp_f) : "-"}° F`;
+                }
+                return `${weatherAtEpoch ? Math.ceil(weatherAtEpoch.temp_c) : "-"}° C`;
+            },
+        ),
+    });
+};

modules/menus/calendar/weather/hourly/time/index.js

@@ -1,18 +0,0 @@
-export const HourlyTime = (theWeather, getNextEpoch) => {
-  return Widget.Label({
-    class_name: "hourly-weather-time",
-    label: theWeather.bind("value").as((w) => {
-      if (!Object.keys(w).length) {
-        return "-";
-      }
-
-      const nextEpoch = getNextEpoch(w);
-      const dateAtEpoch = new Date(nextEpoch * 1000);
-      let hours = dateAtEpoch.getHours();
-      const ampm = hours >= 12 ? "PM" : "AM";
-      hours = hours % 12 || 12;
-
-      return `${hours}${ampm}`;
-    }),
-  });
-};

modules/menus/calendar/weather/hourly/time/index.ts

@@ -0,0 +1,21 @@
+import { Weather } from "lib/types/weather";
+import { Variable } from "types/variable";
+
+export const HourlyTime = (theWeather: Variable<Weather>, getNextEpoch: any) => {
+    return Widget.Label({
+        class_name: "hourly-weather-time",
+        label: theWeather.bind("value").as((w) => {
+            if (!Object.keys(w).length) {
+                return "-";
+            }
+
+            const nextEpoch = getNextEpoch(w);
+            const dateAtEpoch = new Date(nextEpoch * 1000);
+            let hours = dateAtEpoch.getHours();
+            const ampm = hours >= 12 ? "PM" : "AM";
+            hours = hours % 12 || 12;
+
+            return `${hours}${ampm}`;
+        }),
+    });
+};