Show online/offline status indicator in navbar 🔴🟢
File: client/src/pages/Dashboard.jsx
If internet drops the app silently fails 💀
Users don't know if they're offline fr!!
Fix:
const [isOnline, setIsOnline] = useState(navigator.onLine)
useEffect(() => {
const handleOnline = () => setIsOnline(true)
const handleOffline = () => setIsOnline(false)
window.addEventListener('online', handleOnline)
window.addEventListener('offline', handleOffline)
return () => {
window.removeEventListener('online', handleOnline)
window.removeEventListener('offline', handleOffline)
}
}, [])
{!isOnline && (
🔴 offline
)}
~12 lines! No backend needed 🎯
Uses native browser events ✅
Show online/offline status indicator in navbar 🔴🟢
File: client/src/pages/Dashboard.jsx
If internet drops the app silently fails 💀
Users don't know if they're offline fr!!
Fix:
const [isOnline, setIsOnline] = useState(navigator.onLine)
useEffect(() => {
const handleOnline = () => setIsOnline(true)
const handleOffline = () => setIsOnline(false)
window.addEventListener('online', handleOnline)
window.addEventListener('offline', handleOffline)
return () => {
window.removeEventListener('online', handleOnline)
window.removeEventListener('offline', handleOffline)
}
}, [])
{!isOnline && (
🔴 offline
)}
~12 lines! No backend needed 🎯
Uses native browser events ✅