diff --git a/src/components/TaskList.jsx b/src/components/TaskList.jsx index b91bef2..1e89310 100644 --- a/src/components/TaskList.jsx +++ b/src/components/TaskList.jsx @@ -1,4 +1,4 @@ -import React, { useState, useMemo, useEffect } from 'react'; +import React, { useState, useMemo, useEffect, useRef } from 'react'; import { Search, Filter, ArrowUpDown, ArrowUp, ArrowDown, List, Grid, ChevronDown, Columns, Plus, Settings, Terminal, FileText, HelpCircle, X } from 'lucide-react'; import { cn } from '../lib/utils'; import TaskCard from './TaskCard'; @@ -32,6 +32,7 @@ const TaskList = ({ const [showHelpGuide, setShowHelpGuide] = useState(false); const [isTaskMasterComplete, setIsTaskMasterComplete] = useState(false); const [showPRDDropdown, setShowPRDDropdown] = useState(false); + const dropdownRef = useRef(null); const { projectTaskMaster, refreshProjects, refreshTasks, setCurrentProject } = useTaskMaster(); const { t } = useTranslation('tasks'); @@ -39,7 +40,11 @@ const TaskList = ({ // Close PRD dropdown when clicking outside useEffect(() => { const handleClickOutside = (event) => { - if (showPRDDropdown && !event.target.closest('.relative')) { + if ( + showPRDDropdown && + dropdownRef.current && + !dropdownRef.current.contains(event.target) + ) { setShowPRDDropdown(false); } }; @@ -48,6 +53,31 @@ const TaskList = ({ return () => document.removeEventListener('mousedown', handleClickOutside); }, [showPRDDropdown]); + const loadPRDOptions = async (prd, closeDropdown = false) => { + if (!currentProject) { + return; + } + + try { + const response = await api.get(`/taskmaster/prd/${encodeURIComponent(currentProject.name)}/${encodeURIComponent(prd.name)}`); + if (response.ok) { + const prdData = await response.json(); + onShowPRDEditor?.({ + name: prd.name, + content: prdData.content, + isExisting: true + }); + if (closeDropdown) { + setShowPRDDropdown(false); + } + } else { + console.error('Failed to load PRD:', response.statusText); + } + } catch (error) { + console.error('Error loading PRD:', error); + } + }; + // Get unique status values from tasks const statuses = useMemo(() => { const statusSet = new Set(tasks.map(task => task.status).filter(Boolean)); @@ -309,23 +339,8 @@ const TaskList = ({ {existingPRDs.map((prd) => ( {/* PRD Management */} -
+
{existingPRDs.length > 0 ? ( // Dropdown when PRDs exist
@@ -624,21 +639,8 @@ const TaskList = ({ {existingPRDs.map((prd) => (