feat: Notes tab (notes + shopping lists), fix 7-day forecast layout, fix screensaver dismiss

app/api/notes/route.ts

@@ -0,0 +1,76 @@
+export const dynamic = 'force-dynamic'
+import { NextResponse } from 'next/server'
+import * as fs from 'fs'
+
+const NOTES_PATH = '/tmp/tablet-notes.json'
+
+interface Note {
+  id: string
+  type: 'note' | 'shopping'
+  title: string
+  items?: { id: string; text: string; done: boolean }[]
+  text?: string
+  color: string
+  createdAt: string
+  updatedAt: string
+}
+
+function loadNotes(): Note[] {
+  try {
+    if (fs.existsSync(NOTES_PATH)) {
+      return JSON.parse(fs.readFileSync(NOTES_PATH, 'utf-8'))
+    }
+  } catch {}
+  return []
+}
+
+function saveNotes(notes: Note[]) {
+  fs.writeFileSync(NOTES_PATH, JSON.stringify(notes, null, 2))
+}
+
+export async function GET() {
+  return NextResponse.json({ notes: loadNotes() })
+}
+
+export async function POST(req: Request) {
+  const body = await req.json()
+  const notes = loadNotes()
+  const note: Note = {
+    id: Date.now().toString(36) + Math.random().toString(36).slice(2, 6),
+    type: body.type || 'note',
+    title: body.title || '',
+    items: body.type === 'shopping' ? [] : undefined,
+    text: body.type === 'note' ? '' : undefined,
+    color: body.color || '#6366f1',
+    createdAt: new Date().toISOString(),
+    updatedAt: new Date().toISOString(),
+  }
+  notes.unshift(note)
+  saveNotes(notes)
+  return NextResponse.json({ note })
+}
+
+export async function PUT(req: Request) {
+  const body = await req.json()
+  const { id, ...updates } = body
+  if (!id) return NextResponse.json({ error: 'id required' }, { status: 400 })
+
+  const notes = loadNotes()
+  const idx = notes.findIndex(n => n.id === id)
+  if (idx === -1) return NextResponse.json({ error: 'not found' }, { status: 404 })
+
+  notes[idx] = { ...notes[idx], ...updates, updatedAt: new Date().toISOString() }
+  saveNotes(notes)
+  return NextResponse.json({ note: notes[idx] })
+}
+
+export async function DELETE(req: Request) {
+  const { searchParams } = new URL(req.url)
+  const id = searchParams.get('id')
+  if (!id) return NextResponse.json({ error: 'id required' }, { status: 400 })
+
+  const notes = loadNotes()
+  const filtered = notes.filter(n => n.id !== id)
+  saveNotes(filtered)
+  return NextResponse.json({ success: true })
+}

app/page.tsx

@@ -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} />