first public source commit

src/components/widgets/weather/icon.jsx

@@ -0,0 +1,9 @@
+import mapIcon from "utils/condition-map";
+
+export default function Icon({ condition, timeOfDay }) {
+  const Icon = mapIcon(condition, timeOfDay);
+
+  return (
+    <Icon className="mt-2 w-10 h-10 text-theme-800 dark:text-theme-200"></Icon>
+  );
+}

src/components/widgets/weather/weather.jsx

@@ -0,0 +1,41 @@
+import useSWR from "swr";
+import Icon from "./icon";
+
+export default function Weather({ options }) {
+  const { data, error } = useSWR(
+    `/api/widgets/weather?lat=${options.latitude}&lon=${options.longitude}&apiKey=${options.apiKey}&duration=${options.cache}`,
+    {
+      revalidateOnFocus: false,
+      revalidateOnReconnect: false,
+    }
+  );
+
+  if (error) {
+    return <div>failed to load</div>;
+  }
+
+  if (!data) {
+    return <div className="flex flex-col items-center justify-center"></div>;
+  }
+
+  if (data.error) {
+    return <div className="flex flex-col items-center justify-center"></div>;
+  }
+
+  return (
+    <div className="order-last grow flex-none flex flex-row items-center justify-end">
+      <Icon
+        condition={data.current.condition.code}
+        timeOfDay={data.current.is_day ? "day" : "night"}
+      />
+      <div className="flex flex-col ml-3 text-left">
+        <span className="text-theme-800 dark:text-theme-200 text-sm">
+          {Math.round(data.current.temp_f)}&deg;
+        </span>
+        <span className="text-theme-800 dark:text-theme-200 text-xs">
+          {data.current.condition.text}
+        </span>
+      </div>
+    </div>
+  );
+}