Remove SyncIndicator to fix hydration errors

- Removed SyncIndicator component causing hydration issues
- Background polling still works for real-time updates
- Updates appear within 1 second without visual indicator

app/list/[id]/page.tsx

@@ -7,7 +7,6 @@ import Link from 'next/link'
 import { ArrowLeft } from 'lucide-react'
 import InlineItemCreate from '@/components/InlineItemCreate'
 import ListDetailView from '@/components/ListDetailView'
-import SyncIndicator from '@/components/SyncIndicator'
 
 export const dynamic = 'force-dynamic'
 export const revalidate = 0
@@ -36,7 +35,6 @@ export default async function ListDetailPage({ params }: { params: { id: string
 
   return (
     <main className="container mx-auto px-4 sm:px-6 py-6 sm:py-8 max-w-6xl">
-      <SyncIndicator />
       {/* Header */}
       <div className="mb-6 sm:mb-8">
         <Link 

components/SyncIndicator.tsx

@@ -1,65 +0,0 @@
-'use client'
-
-import { useEffect, useState } from 'react'
-import { RefreshCw } from 'lucide-react'
-
-/**
- * Visual indicator that shows when the page is syncing
- */
-export default function SyncIndicator() {
-  const [mounted, setMounted] = useState(false)
-  const [isSyncing, setIsSyncing] = useState(false)
-  const [lastSync, setLastSync] = useState<Date>(new Date())
-
-  useEffect(() => {
-    setMounted(true)
-  }, [])
-
-  useEffect(() => {
-    if (!mounted) return
-
-    // Listen for router refresh events
-    const handleSync = () => {
-      setIsSyncing(true)
-      setLastSync(new Date())
-      setTimeout(() => setIsSyncing(false), 500)
-    }
-
-    // Trigger on visibility change
-    const handleVisibilityChange = () => {
-      if (document.visibilityState === 'visible') {
-        handleSync()
-      }
-    }
-
-    document.addEventListener('visibilitychange', handleVisibilityChange)
-
-    // Simulate sync indicator every second
-    const interval = setInterval(handleSync, 1000)
-
-    return () => {
-      document.removeEventListener('visibilitychange', handleVisibilityChange)
-      clearInterval(interval)
-    }
-  }, [mounted])
-
-  // Don't render on server to avoid hydration mismatch
-  if (!mounted) {
-    return null
-  }
-
-  return (
-    <div 
-      className="fixed top-4 right-4 z-50 flex items-center gap-2 px-3 py-2 bg-white border border-gray-200 rounded-lg shadow-sm text-xs text-gray-600"
-      suppressHydrationWarning
-    >
-      <RefreshCw 
-        size={14} 
-        className={`${isSyncing ? 'animate-spin text-blue-500' : 'text-gray-400'}`} 
-      />
-      <span suppressHydrationWarning>
-        {isSyncing ? 'Syncing...' : `Last sync: ${lastSync.toLocaleTimeString()}`}
-      </span>
-    </div>
-  )
-}