- Add IndexedDB storage layer for notes (src/db/localDB.ts) - Implement sync manager with queue and conflict resolution (src/services/syncManager.ts) - Add online/offline detection hook (src/hooks/useOnlineStatus.ts) - Load notes from local storage immediately on app startup - Add sync status UI indicators (offline badge, pending count) - Auto-sync every 5 minutes when online - Queue operations when offline, sync when connection restored - Fix note content update when synced from server while viewing - Retry failed sync operations up to 5 times - Temporary IDs for offline-created notes
21 lines
553 B
TypeScript
21 lines
553 B
TypeScript
import { useState, useEffect } from 'react';
|
|
|
|
export function useOnlineStatus() {
|
|
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);
|
|
};
|
|
}, []);
|
|
|
|
return isOnline;
|
|
}
|