paul/task-manager
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add label functionality to tasks for better organization and tracking

Browse Source 
Update TaskCard and TaskCreationModal components to support task labels, including UI elements for selection and display. Refactor schema imports to use '@shared/schema'.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: ceced2fc-aa46-458d-ba87-ddd4b7bb1518
Replit-Commit-Checkpoint-Type: intermediate_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/659922a9-0087-461c-90dd-6d9a58b81d4d/ceced2fc-aa46-458d-ba87-ddd4b7bb1518/vtpluZY
This commit is contained in:
paul-nothaft
2025-09-11 12:36:38 +00:00
parent 5f866afbb1
commit 4ea8a7c6a1
5 changed files with 55 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files
client/src/components/TaskCard.tsx
+17 -4
View File
@@ -19,12 +19,21 @@ export default function TaskCard({ task, onPlay, onPause, onEdit, onStatusChange
const [isTimerRunning, setIsTimerRunning] = useState(task.isTracking);
// Fetch labels to get the label color
const { data: labels = [] } = useQuery<Label[]>({
const { data: labels = [], isLoading: labelsLoading, error: labelsError } = useQuery<Label[]>({
queryKey: ['/api/labels'],
staleTime: 5 * 60 * 1000, // 5 minutes cache
refetchOnWindowFocus: false,
});
// Find the label for this task
const taskLabel = task.labelId ? labels.find(label => label.id === task.labelId) : null;
const taskLabel = task.labelId && labels.length > 0 ? labels.find(label => label.id === task.labelId) : null;
// Debug logging - always log for tasks with labelId
if (task.labelId) {
console.log(`TaskCard Debug - Task: "${task.title}", LabelId: ${task.labelId}, Labels loading: ${labelsLoading}, Labels count: ${labels.length}, Labels error:`, labelsError);
console.log(`TaskCard Debug - Available labels:`, labels.map(l => ({ id: l.id, name: l.name, color: l.color })));
console.log(`TaskCard Debug - Found label:`, taskLabel);
}
const handleToggleTimer = () => {
if (isTimerRunning) {
@@ -68,8 +77,12 @@ export default function TaskCard({ task, onPlay, onPause, onEdit, onStatusChange
>
{taskLabel && (
<div
className="absolute left-0 top-2 bottom-2 w-1 rounded-r-sm"
style={{ backgroundColor: taskLabel.color }}
className="absolute left-0 top-2 bottom-2 w-1 rounded-r-sm z-10"
style={{
backgroundColor: taskLabel.color,
minWidth: '4px'
}}
data-testid={`accent-label-${task.id}`}
/>
)}
<div className="flex items-start justify-between gap-3">