fix: hide completed tasks from priority view immediately

- Priority view is "what to do next" — completed tasks have no place there.
  Always filter them out; removed the "show completed" toggle button.
- Optimistic local hide: when you check a task off inside priority view it
  disappears immediately (no waiting for API round-trip + parent re-render).
  A `locallyDone` Set tracks tasks marked complete in the current session.

v1.88.1
This commit is contained in:
mARTin 2026-04-06 15:04:18 +02:00
parent 149f0cf021
commit a3b0849525
2 changed files with 14 additions and 12 deletions

View File

@ -1,6 +1,6 @@
{ {
"name": "my-weekly-todo-list", "name": "my-weekly-todo-list",
"version": "1.88.0", "version": "1.88.1",
"description": "A web-based weekly task management application that organizes to-dos and calendar events in a single, intuitive weekly view", "description": "A web-based weekly task management application that organizes to-dos and calendar events in a single, intuitive weekly view",
"main": "index.js", "main": "index.js",
"scripts": { "scripts": {

View File

@ -120,7 +120,9 @@ export default function PriorityView({
const [filterProject, setFilterProject] = useState(""); const [filterProject, setFilterProject] = useState("");
const [filterList, setFilterList] = useState(""); const [filterList, setFilterList] = useState("");
const [filterTimespan, setFilterTimespan] = useState("all"); const [filterTimespan, setFilterTimespan] = useState("all");
const [showCompleted, setShowCompleted] = useState(false); // Optimistic set: tasks marked complete inside this view disappear immediately,
// without waiting for the API round-trip + parent re-render.
const [locallyDone, setLocallyDone] = useState<Set<string>>(new Set());
const [delegateModal, setDelegateModal] = useState<PriorityTask | null>(null); const [delegateModal, setDelegateModal] = useState<PriorityTask | null>(null);
const [delegateTo, setDelegateTo] = useState(""); const [delegateTo, setDelegateTo] = useState("");
const [delegateNote, setDelegateNote] = useState(""); const [delegateNote, setDelegateNote] = useState("");
@ -133,7 +135,8 @@ export default function PriorityView({
// --- Filter tasks --- // --- Filter tasks ---
const filteredTasks = useMemo(() => { const filteredTasks = useMemo(() => {
let result = tasks.filter((t) => !t.id.startsWith("virtual-")); let result = tasks.filter((t) => !t.id.startsWith("virtual-"));
if (!showCompleted) result = result.filter((t) => !t.completed); // Priority view is "what to do next" — always hide completed tasks.
result = result.filter((t) => !t.completed && !locallyDone.has(t.id));
if (filterProject) result = result.filter((t) => t.projectId === filterProject); if (filterProject) result = result.filter((t) => t.projectId === filterProject);
if (filterList) { if (filterList) {
if (filterList === "__scheduled__") { if (filterList === "__scheduled__") {
@ -158,7 +161,7 @@ export default function PriorityView({
}); });
} }
return result; return result;
}, [tasks, showCompleted, filterProject, filterList, filterTimespan]); }, [tasks, locallyDone, filterProject, filterList, filterTimespan]);
// --- Eisenhower quadrants --- // --- Eisenhower quadrants ---
const eisenhowerQuadrants = useMemo(() => { const eisenhowerQuadrants = useMemo(() => {
@ -219,6 +222,13 @@ export default function PriorityView({
}, [delegateModal, delegateTo, delegateNote, delegateType, onUpdateTask]); }, [delegateModal, delegateTo, delegateNote, delegateType, onUpdateTask]);
const toggleComplete = useCallback(async (task: PriorityTask) => { const toggleComplete = useCallback(async (task: PriorityTask) => {
if (!task.completed) {
// Optimistically hide immediately so the task doesn't linger
// while the API call + parent re-render cycle completes.
setLocallyDone((prev) => new Set([...prev, task.id]));
} else {
setLocallyDone((prev) => { const n = new Set(prev); n.delete(task.id); return n; });
}
await onUpdateTask(task.id, { completed: !task.completed }); await onUpdateTask(task.id, { completed: !task.completed });
}, [onUpdateTask]); }, [onUpdateTask]);
@ -272,14 +282,6 @@ export default function PriorityView({
<SlidersHorizontal size={13} /> <SlidersHorizontal size={13} />
{de ? "Filter" : "Filter"} {de ? "Filter" : "Filter"}
</button> </button>
<button
onClick={() => setShowCompleted((v) => !v)}
style={{ display: "flex", alignItems: "center", gap: "4px", padding: "5px 10px", borderRadius: "7px", border: `1px solid ${border}`, background: showCompleted ? "#059669" : cardBg, color: showCompleted ? "#fff" : textSecondary, cursor: "pointer", fontSize: "0.8rem" }}
title={de ? "Erledigte anzeigen" : "Show completed"}
>
<Check size={13} />
{de ? "Erledigt" : "Done"}
</button>
</div> </div>
</div> </div>