@uniai-fe/uds-templates 0.5.12 → 0.5.14

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uniai-fe/uds-templates",
-  "version": "0.5.12",
+  "version": "0.5.14",
   "description": "UNIAI Design System; UI Templates Package",
   "type": "module",
   "private": false,

package/src/cctv/utils/video-state.ts

@@ -12,6 +12,13 @@ export const CCTV_MESSAGE = {
   offline: "CCTV 연결 오류",
 } as const;
 
+const RTC_PREPARING_STATES = new Set<RTCPeerConnectionState>([
+  "new",
+  "connecting",
+  "disconnected",
+  "closed",
+]);
+
 /**
  * CCTV; 스트리밍 상태에 따른 메시지 추출
  * @param {CctvVideoOverlayMessageParams} params 상태 파라미터
@@ -27,6 +34,7 @@ export const CCTV_MESSAGE = {
  */
 export function getOverlayMessage({
   cam,
+  connectionState,
   hasCamProp = false,
   isFetching = false,
   isTokenLoading,
@@ -44,6 +52,8 @@ export function getOverlayMessage({
   if (isTokenError) return CCTV_MESSAGE.tokenError;
   if (streamError) return streamError;
   if (isTokenLoading || isStreaming) return CCTV_MESSAGE.preparing;
+  if (connectionState === "failed") return CCTV_MESSAGE.offline;
+  if (RTC_PREPARING_STATES.has(connectionState)) return CCTV_MESSAGE.preparing;
   return null;
 }
 

package/src/weather/apis/korea/server.ts

@@ -82,6 +82,8 @@ export const routeWeatherKoreaNow = async ({
   const NOW_DATA: API_Res_WeatherKoreaToday = {
     ...API_RES_BASE,
     temperature: null,
+    max_temperature: null,
+    min_temperature: null,
     humidity: null,
   };
   const resDefault: API_Res_WeatherKoreaNow = {
@@ -146,7 +148,13 @@ export const routeWeatherKoreaForecast = async ({
   };
   const resDefault: API_Res_WeatherKoreaForecast = {
     raw: API_RES_RAW as KMA_Res_WeatherForecast,
-    today: { ...API_RES_BASE, temperature: null, humidity: null },
+    today: {
+      ...API_RES_BASE,
+      temperature: null,
+      max_temperature: null,
+      min_temperature: null,
+      humidity: null,
+    },
     day_1: { ...FORECAST_DATA },
     day_2: { ...FORECAST_DATA },
   };

package/src/weather/components/page-header/Today.tsx

@@ -10,6 +10,7 @@ import type { WeatherPageHeaderTodayProps } from "../../types";
 import { useOpenWeatherMap, useWeatherKorea } from "../../hooks";
 import {
   getOpenWeatherMapConditionCode,
+  getOpenWeatherMapTodayForecast,
   isKoreaWeatherLocale,
   resolveWeatherPageHeaderTexts,
 } from "../../utils";
@@ -27,17 +28,27 @@ export default function WeatherPageHeaderToday({
   const openWeatherMapWeatherFallback = useOpenWeatherMap({
     locale,
     enabledNow: !openWeatherMapWeather && !isKoreaProvider,
-    enabledForecast: false,
+    enabledForecast: !openWeatherMapWeather && !isKoreaProvider,
   });
   const korea = koreaWeather ?? koreaWeatherFallback;
   const openWeatherMap = openWeatherMapWeather ?? openWeatherMapWeatherFallback;
   const texts = resolveWeatherPageHeaderTexts(textOverrides);
+  const openWeatherMapToday = useMemo(
+    () => getOpenWeatherMapTodayForecast(openWeatherMap.forecast),
+    [openWeatherMap.forecast],
+  );
 
   const isFetchingAlternate = useMemo(() => {
-    if (!isKoreaProvider) return openWeatherMap.isFetchingNow;
+    if (!isKoreaProvider)
+      return openWeatherMap.isFetchingNow || openWeatherMap.isFetchingForecast;
     if (korea.isFetchingNow) return true;
     return false;
-  }, [isKoreaProvider, korea.isFetchingNow, openWeatherMap.isFetchingNow]);
+  }, [
+    isKoreaProvider,
+    korea.isFetchingNow,
+    openWeatherMap.isFetchingForecast,
+    openWeatherMap.isFetchingNow,
+  ]);
 
   const iconCode = useMemo(() => {
     if (isKoreaProvider) {
@@ -119,8 +130,57 @@ export default function WeatherPageHeaderToday({
     openWeatherMap.now?.main?.humidity,
   ]);
 
-  const maxTemperature = null;
-  const minTemperature = null;
+  const maxTemperature = useMemo(() => {
+    if (isKoreaProvider) {
+      const kma_forecast = korea.forecast?.today?.max_temperature;
+      if (
+        kma_forecast !== null &&
+        kma_forecast !== undefined &&
+        !Number.isNaN(Number(kma_forecast))
+      )
+        return Number(kma_forecast);
+    }
+
+    const alt_forecast = openWeatherMapToday?.max_temperature;
+    if (
+      alt_forecast !== null &&
+      alt_forecast !== undefined &&
+      !Number.isNaN(Number(alt_forecast))
+    )
+      return Number(alt_forecast);
+
+    return null;
+  }, [
+    isKoreaProvider,
+    korea.forecast?.today?.max_temperature,
+    openWeatherMapToday?.max_temperature,
+  ]);
+
+  const minTemperature = useMemo(() => {
+    if (isKoreaProvider) {
+      const kma_forecast = korea.forecast?.today?.min_temperature;
+      if (
+        kma_forecast !== null &&
+        kma_forecast !== undefined &&
+        !Number.isNaN(Number(kma_forecast))
+      )
+        return Number(kma_forecast);
+    }
+
+    const alt_forecast = openWeatherMapToday?.min_temperature;
+    if (
+      alt_forecast !== null &&
+      alt_forecast !== undefined &&
+      !Number.isNaN(Number(alt_forecast))
+    )
+      return Number(alt_forecast);
+
+    return null;
+  }, [
+    isKoreaProvider,
+    korea.forecast?.today?.min_temperature,
+    openWeatherMapToday?.min_temperature,
+  ]);
   const alert = (
     <WeatherPageHeaderAlert locale={locale} texts={textOverrides} />
   );

package/src/weather/types/api.ts

@@ -158,11 +158,17 @@ export type API_Res_WeatherKoreaBase = {
 /**
  * 기상청 API; 오늘 날씨
  * @property {number|string|null} temperature 기온(℃)
+ * @property {number|string|null} max_temperature 최고기온(℃)
+ * @property {number|string|null} min_temperature 최저기온(℃)
  * @property {number|string|null} humidity 습도(%)
  */
 export type API_Res_WeatherKoreaToday = API_Res_WeatherKoreaBase & {
   /** 기온(℃) */
   temperature: number | string | null;
+  /** 최고 기온(℃) */
+  max_temperature: number | string | null;
+  /** 최저 기온(℃) */
+  min_temperature: number | string | null;
   /** 습도(%) */
   humidity: number | string | null;
 };

package/src/weather/utils/weather.ts

@@ -267,7 +267,7 @@ const getLocalDateKey = (date: Date): string => {
 const getForecastItemDateKey = (item: OWM_Res_Weather_Forecast_Item): string =>
   item.dt_txt?.slice(0, 10) || getLocalDateKey(new Date(item.dt * 1000));
 
-const toOpenWeatherMapNextDay = (
+const toOpenWeatherMapDayForecast = (
   items: OWM_Res_Weather_Forecast_Item[],
 ): API_Res_WeatherKoreaNextDays | undefined => {
   if (items.length === 0) return undefined;
@@ -275,11 +275,11 @@ const toOpenWeatherMapNextDay = (
   const conditionItem =
     items.find(item => item.dt_txt?.includes("12:00")) ||
     items[Math.floor(items.length / 2)];
-  const temperatures = items.flatMap(item => [
-    item.main.temp_min,
-    item.main.temp_max,
-    item.main.temp,
-  ]);
+  const temperatures = items
+    .flatMap(item => [item.main.temp_min, item.main.temp_max, item.main.temp])
+    .filter((temperature): temperature is number =>
+      Number.isFinite(temperature),
+    );
 
   return {
     sky: null,
@@ -324,11 +324,29 @@ export const getOpenWeatherMapNextDays = (
   const [day1Key, day2Key] = Object.keys(grouped).sort();
 
   return {
-    day_1: day1Key ? toOpenWeatherMapNextDay(grouped[day1Key]) : undefined,
-    day_2: day2Key ? toOpenWeatherMapNextDay(grouped[day2Key]) : undefined,
+    day_1: day1Key ? toOpenWeatherMapDayForecast(grouped[day1Key]) : undefined,
+    day_2: day2Key ? toOpenWeatherMapDayForecast(grouped[day2Key]) : undefined,
   };
 };
 
+/**
+ * 날씨 도구; OpenWeatherMap 예보 응답을 오늘 최고/최저 형태로 변환
+ * @param {OWM_Res_Weather_Forecast} [forecast] OpenWeatherMap 예보 응답
+ * @return {API_Res_WeatherKoreaNextDays | undefined} 오늘 최고/최저 예보
+ */
+export const getOpenWeatherMapTodayForecast = (
+  forecast?: OWM_Res_Weather_Forecast,
+): API_Res_WeatherKoreaNextDays | undefined => {
+  if (!Array.isArray(forecast?.list)) return undefined;
+
+  const todayKey = getLocalDateKey(new Date());
+  const todayItems = forecast.list.filter(
+    item => getForecastItemDateKey(item) === todayKey,
+  );
+
+  return toOpenWeatherMapDayForecast(todayItems);
+};
+
 export function now(
   outputResponse: API_Res_WeatherKoreaNow,
   apiResponse: KMA_Res_WeatherNow,
@@ -396,6 +414,8 @@ export function forecast(
   };
 
   res.today.temperature = getValueForecast(items, today, "TMP");
+  res.today.max_temperature = getValueForecast(items, today, "TMX");
+  res.today.min_temperature = getValueForecast(items, today, "TMN");
   res.today.humidity = getValueForecast(items, today, "REH");
   Object.assign(res.today, getDailyState(today));