import { useEffect, useState } from 'react'
import type { WeatherState } from '../../hooks/useWeather'
import { WeatherIcon } from './WeatherIcon'
// 按本地小时给出 早/中/晚/夜 问候（默认英文，改中文只需替换下面的文案）。
function greetingFor(hour: number): string {
if (hour >= 5 && hour < 12) return 'Good morning'
if (hour >= 12 && hour < 18) return 'Good afternoon'
if (hour >= 18 && hour < 23) return 'Good evening'
return 'Good night'
}
// 天气行：根据后端返回的业务态分别渲染。
function WeatherLine({ wx }: { wx: WeatherState }) {
let content = null
if (!wx.loading && wx.data) {
const d = wx.data
if (d.ok) {
content = (
<>
{d.city} · {d.text} · {d.temp}°
)
} else if (d.reason === 'quota_exceeded') {
// “表个态”：当日额度用完。
content = 天气请求次数已用完,明日 0 点恢复
}
// not_configured / failed：静默（不打扰页面）
}
// 固定最小高度，避免天气加载完成后页面跳动。
return (
{content}
)
}
export function Greeting({ wx }: { wx: WeatherState }) {
const [now, setNow] = useState(() => new Date())
useEffect(() => {
// 每 30s 刷新，足够让分钟与跨时段问候保持准确。
const id = setInterval(() => setNow(new Date()), 30_000)
return () => clearInterval(id)
}, [])
const greeting = greetingFor(now.getHours())
const time = now.toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' })
const date = now.toLocaleDateString([], {
weekday: 'long',
month: 'long',
day: 'numeric',
})
return (
{time} · {date}
{greeting}
.
)
}