feat: Notes tab (notes + shopping lists), fix 7-day forecast layout, fix screensaver dismiss
All checks were successful
Deploy / deploy (push) Successful in 2m54s

This commit is contained in:
Cosmo
2026-04-22 20:29:33 +00:00
parent a7611b46c4
commit bc01443f03
4 changed files with 445 additions and 11 deletions

View File

@@ -8,9 +8,10 @@ import TopBar from '@/components/TopBar'
import RoomTabs from '@/components/RoomTabs'
import DeviceCard from '@/components/DeviceCard'
import CalendarTab from '@/components/CalendarTab'
import NotesTab from '@/components/NotesTab'
import WeatherAnimation from '@/components/WeatherAnimation'
type Tab = 'home' | 'devices' | 'calendar' | 'settings'
type Tab = 'home' | 'devices' | 'calendar' | 'notes' | 'settings'
interface WeatherData {
temp: string
@@ -333,15 +334,23 @@ function HomeTab({ weather, sensors }: { weather: WeatherData | null; sensors: S
</div>
</div>
{weather.forecast && weather.forecast.length > 0 && (
<div style={{ display: 'flex', gap: 8 }}>
{weather.forecast.map(day => {
<div style={{ display: 'flex', gap: 6, overflowX: 'auto', WebkitOverflowScrolling: 'touch' as any, scrollbarWidth: 'none' as any, msOverflowStyle: 'none' as any, paddingBottom: 2 }}>
{weather.forecast.map((day, idx) => {
const d = new Date(day.date)
const isToday = idx === 0
return (
<div key={day.date} style={{ flex: 1, background: 'rgba(255,255,255,0.04)', borderRadius: 14, padding: '10px 8px', textAlign: 'center', border: '1px solid rgba(255,255,255,0.04)' }}>
<div style={{ fontSize: 10, color: 'var(--text-secondary)', textTransform: 'capitalize', marginBottom: 4, fontWeight: 500 }}>{d.toLocaleDateString('ru-RU', { weekday: 'short' })}</div>
<div style={{ fontSize: 20, marginBottom: 4 }}>{getWeatherIcon(day.desc)}</div>
<div style={{ fontSize: 13, fontWeight: 700, color: 'var(--text-primary)' }}>{day.maxTemp}°</div>
<div style={{ fontSize: 11, color: 'var(--text-secondary)' }}>{day.minTemp}°</div>
<div key={day.date} style={{
minWidth: 58, background: isToday ? 'rgba(99,102,241,0.1)' : 'rgba(255,255,255,0.04)',
borderRadius: 12, padding: '8px 6px', textAlign: 'center',
border: isToday ? '1px solid rgba(129,140,248,0.2)' : '1px solid rgba(255,255,255,0.04)',
flexShrink: 0,
}}>
<div style={{ fontSize: 9, color: isToday ? '#a5b4fc' : 'var(--text-secondary)', textTransform: 'capitalize', marginBottom: 3, fontWeight: 600 }}>
{isToday ? 'Сегодня' : d.toLocaleDateString('ru-RU', { weekday: 'short' })}
</div>
<div style={{ fontSize: 16, marginBottom: 3 }}>{getWeatherIcon(day.desc)}</div>
<div style={{ fontSize: 12, fontWeight: 700, color: 'var(--text-primary)' }}>{day.maxTemp}°</div>
<div style={{ fontSize: 10, color: 'var(--text-secondary)' }}>{day.minTemp}°</div>
</div>
)
})}
@@ -672,7 +681,7 @@ function HomePageInner() {
// Screensaver idle detection
const resetIdle = useCallback(() => {
if (screensaverActive) { setScreensaverActive(false); return }
if (screensaverActive) return // don't reset timer while screensaver is active
if (idleTimer.current) clearTimeout(idleTimer.current)
idleTimer.current = setTimeout(() => setScreensaverActive(true), 2 * 60 * 1000) // 2 min
}, [screensaverActive])
@@ -758,6 +767,12 @@ function HomePageInner() {
</motion.div>
)}
{tab === 'notes' && (
<motion.div key="notes" variants={tabVariants} initial="enter" animate="center" exit="exit" transition={{ duration: 0.2 }} style={{ flex: 1, display: 'flex', flexDirection: 'column', overflow: 'hidden' }}>
<NotesTab />
</motion.div>
)}
{tab === 'settings' && (
<motion.div key="settings" variants={tabVariants} initial="enter" animate="center" exit="exit" transition={{ duration: 0.2 }} style={{ flex: 1, display: 'flex', flexDirection: 'column', overflow: 'hidden' }}>
<SettingsTab city={city} onCityChange={handleCityChange} onLogout={handleLogout} theme={theme} onThemeChange={setTheme} />