From c38b8543720b350844c89c93c3225704bf0315a9 Mon Sep 17 00:00:00 2001 From: Birdup <34012548+birdup000@users.noreply.github.com> Date: Fri, 27 Dec 2024 14:14:09 -0600 Subject: [PATCH] Modified app/components/ModernTaskPanel.tsx --- app/components/ModernTaskPanel.tsx | 187 ++++++++++++++++++++++++++++- 1 file changed, 182 insertions(+), 5 deletions(-) diff --git a/app/components/ModernTaskPanel.tsx b/app/components/ModernTaskPanel.tsx index 7245d03..29de9c4 100644 --- a/app/components/ModernTaskPanel.tsx +++ b/app/components/ModernTaskPanel.tsx @@ -68,7 +68,24 @@ const ModernTaskPanel: React.FC = ({ const [groupingSettings, setGroupingSettings] = useState<GroupingSettings>({ groupBy: 'none', }); - const [currentView, setCurrentView] = useState<'board' | 'matrix'>('board'); + const [isLayoutSettingsOpen, setIsLayoutSettingsOpen] = useState(false); + const [isGroupingSettingsOpen, setIsGroupingSettingsOpen] = useState(false); + const [layoutSettings, setLayoutSettings] = useState<LayoutSettings>({ + selectedLayout: 'board', + columnVisibility: { + title: true, + description: true, + dueDate: true, + priority: true, + tags: true, + assignees: true, + subtasks: true, + status: true, + }, + }); + const [groupingSettings, setGroupingSettings] = useState<GroupingSettings>({ + groupBy: 'none', + }); // Search and filter functionality const { @@ -141,9 +158,25 @@ const ModernTaskPanel: React.FC = ({
- @@ -262,11 +295,112 @@ const ModernTaskPanel: React.FC = ({
) : ( - + /> + )} + </div> + + {/* Right Sidebar */} + <div className="w-80 space-y-6"> + {agixtConfig.backendUrl && agixtConfig.authToken && ( + <AIAssistantPanel + backendUrl={agixtConfig.backendUrl} + authToken={agixtConfig.authToken} + onTaskSuggestion={(suggestion) => { + const newTask: Task = { + id: Date.now().toString(), + title: suggestion.title || '', + description: suggestion.description || '', + priority: suggestion.priority || 'medium', + status: 'todo', + progress: 0, + createdAt: new Date(), + updatedAt: new Date(), + owner: 'current-user', + collaborators: [], + activityLog: [], + comments: [], + version: 1, + listId: lists[0]?.id || 'default', + }; + onAddTask(newTask); + }} + onTaskOptimization={(taskIds) => { + const optimizedTasks = taskIds + .map(id => tasks.find(t => t.id === id)) + .filter(Boolean) as Task[]; + onReorderTasks(optimizedTasks); + }} + tasks={tasks} + selectedTask={selectedTask} + /> + )} + </div> + </div> + + {/* Modals */} + {isLayoutSettingsOpen && ( + <div className="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center"> + <LayoutSettingsPanel + layoutSettings={layoutSettings} + onSave={(newSettings) => { + setLayoutSettings(newSettings); + setIsLayoutSettingsOpen(false); + }} + onClose={() => setIsLayoutSettingsOpen(false)} + /> + </div> + )} + + {isGroupingSettingsOpen && ( + <div className="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center"> + <GroupingSettingsPanel + groupingSettings={groupingSettings} + onSave={(newSettings) => { + setGroupingSettings(newSettings); + setIsGroupingSettingsOpen(false); + }} + onClose={() => setIsGroupingSettingsOpen(false)} + /> + </div> + )} + + {isAGiXTConfigOpen && ( + <div className="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center"> + <AGiXTConfig + onClose={() => setIsAGiXTConfigOpen(false)} + onSave={(config) => { + setAgixtConfig(config); + setIsAGiXTConfigOpen(false); + }} + /> + </div> + )} + + {isEditorOpen && ( + <div className="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center"> + <TaskForm + onSubmit={(task) => { + onAddTask(task); + setIsEditorOpen(false); + }} + onCancel={() => setIsEditorOpen(false)} + lists={lists} + /> + </div> + )} + + {selectedTask && ( + <TaskDetailsPanel + task={selectedTask} + onClose={() => setSelectedTask(null)} + onUpdateTask={onUpdateTask} + allTasks={tasks} + className="fixed inset-y-0 right-0 w-[32rem] shadow-xl" + /> )} @@ -563,3 +697,46 @@ interface ColumnVisibility { </div> <div className="flex items-center space-x-4"> <button + + interface ColumnVisibility { + [key: string]: boolean; + } + + interface LayoutSettings { + selectedLayout: 'board' | 'matrix' | 'list' | 'calendar'; + columnVisibility: ColumnVisibility; + } + + interface GroupingSettings { + groupBy: 'list' | 'tag' | 'project' | 'none'; + } + + const getGroupedTasks = (status: 'todo' | 'in-progress' | 'done') => { + const filteredTasks = filteredAndSortedTasks().filter(task => task.status === status); + + if (groupingSettings.groupBy === 'none') { + return filteredTasks; + } + + const grouped: { [key: string]: Task[] } = {}; + filteredTasks.forEach(task => { + const groupKey = task[groupingSettings.groupBy] || 'Other'; + if (!grouped[groupKey]) { + grouped[groupKey] = []; + } + grouped[groupKey].push(task); + }); + + if (groupingSettings.groupBy === 'list') { + // Sort groups by list order + return Object.entries(grouped) + .sort(([keyA], [keyB]) => { + const indexA = lists.findIndex(list => list.id === keyA); + const indexB = lists.findIndex(list => list.id === keyB); + return indexA - indexB; + }) + .flatMap(([, tasks]) => tasks); + } + + return Object.values(grouped).flat(); + };