diff --git a/app/components/TaskPanel.tsx b/app/components/TaskPanel.tsx index e2622aa..e97b83b 100644 --- a/app/components/TaskPanel.tsx +++ b/app/components/TaskPanel.tsx @@ -20,6 +20,7 @@ import LoginForm from './LoginForm'; import AIAssistant from './AIAssistant'; import ShortcutsDialog from './ShortcutsDialog'; import { Task, TaskList } from '../types/task'; +import { StorageConfig } from '../types/storage'; import { Comment } from './CommentSection'; import { colors } from '../../tailwind.config'; import TaskStats from './TaskStats'; @@ -61,7 +62,32 @@ const TaskPanel: React.FC = () => { const [showCompletedRecurring, setShowCompletedRecurring] = React.useState(true); const [showIntegrations, setShowIntegrations] = React.useState(false); const [isEditorOpen, setIsEditorOpen] = React.useState(false); - const { tasks, addTask, updateTask, deleteTask, reorderTasks, importTasks, lists, addList, updateList, deleteList } = useTasks(); + const [storageConfig, setStorageConfig] = React.useState(() => { + const email = localStorage.getItem('email'); + const userId = email || 'anonymous'; + return { + remoteEnabled: localStorage.getItem('remoteStorageEnabled') === 'true', + apiKey: localStorage.getItem('remoteStorageApiKey') || undefined, + userId + }; + }); + + const { + tasks, + addTask, + updateTask, + deleteTask, + reorderTasks, + importTasks, + lists, + addList, + updateList, + deleteList, + sync, + isLoading + } = useTasks(storageConfig); + + const [isSyncing, setIsSyncing] = React.useState(false); const { searchTerm, setSearchTerm, @@ -436,6 +462,32 @@ const TaskPanel: React.FC = () => { > 🔌 + {storageConfig.remoteEnabled && ( +
+ + + {isSyncing ? 'Syncing...' : 'Sync Tasks'} + +
+ )}