diff --git a/src/components/APITable/APIStatusText/APIStatusText.tsx b/src/components/APITable/APIStatusText/APIStatusText.tsx index bf4f3fd..06a6681 100644 --- a/src/components/APITable/APIStatusText/APIStatusText.tsx +++ b/src/components/APITable/APIStatusText/APIStatusText.tsx @@ -16,6 +16,7 @@ type APIStatusTextProps = { defaultTooltipText?: string; children: React.ReactNode; size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl'; + color?: string; }; export default function APIStatusText(props: APIStatusTextProps) { @@ -26,6 +27,7 @@ export default function APIStatusText(props: APIStatusTextProps) { defaultTooltipText, children, size = 'sm', + color, } = props; const tooltipText = React.useMemo(() => { @@ -48,6 +50,7 @@ export default function APIStatusText(props: APIStatusTextProps) { span data-nodata={nodata} data-error={error} + c={!nodata && !error ? color : 'undefined'} > {children} diff --git a/src/components/APITables/WeatherTable/WeatherTable.tsx b/src/components/APITables/WeatherTable/WeatherTable.tsx index 74f657d..75eb205 100644 --- a/src/components/APITables/WeatherTable/WeatherTable.tsx +++ b/src/components/APITables/WeatherTable/WeatherTable.tsx @@ -26,6 +26,7 @@ type WeatherResponse = { wind_speed_avg: number; wind_speed_max: number; wind_speed_avg_5m: number; + wind_speed_avg_30m: number; wind_dir_avg_5m: number; wind_gust_5m: number; relative_humidity: number; @@ -34,6 +35,19 @@ type WeatherResponse = { station: string; }[]; +function colourWindSpeed(speed: number | undefined) { + if (speed === undefined) return null; + + let color: string | undefined = undefined; + if (speed >= 35) { + color = 'red.8'; + } else if (speed >= 30) { + color = 'yellow.8'; + } + + return {speed.toFixed(1)} mph; +} + export default function WeatherTable() { const [weather, , noData, refresh] = useAPICall( '/weather/report?delta_time=600&last=true', @@ -76,10 +90,15 @@ export default function WeatherTable() { value: weather?.[0]?.wind_speed_avg_5m.toFixed(1), unit: ' mph', }, + { + key: 'wind_speed_30m', + label: 'Wind Speed (30m avg.)', + value: colourWindSpeed(weather?.[0]?.wind_speed_avg_30m), + }, { key: 'wind_gust', - label: 'Wind Gust (5m max.)', - value: weather?.[0]?.wind_gust_5m.toFixed(1), + label: 'Wind Gust (1m max.)', + value: weather?.[0]?.wind_speed_max.toFixed(1), unit: ' mph', }, {