added enter to confirm filter and due today indicator

This commit is contained in:
2026-02-20 16:04:52 -06:00
parent 98ff4d0a4f
commit 6356a7f653
2 changed files with 23 additions and 2 deletions
+6
View File
@@ -113,6 +113,12 @@ export const FilterBar: Component = () => {
placeholder="Search tasks, descriptions, tags..."
value={store.filter.query}
onInput={(e) => setFilter({ query: e.currentTarget.value })}
onKeyDown={(e) => {
if (e.key === 'Enter') {
e.preventDefault();
setIsOpen(false);
}
}}
class="w-full bg-muted/30 border border-border/50 rounded-xl pl-10 pr-4 py-2.5 text-sm outline-none focus:ring-2 focus:ring-primary/20 focus:border-primary/40 transition-all placeholder:text-muted-foreground/30"
/>
</div>
+17 -2
View File
@@ -1,4 +1,4 @@
import { type Component, createMemo, For } from "solid-js";
import { type Component, createMemo, For, Show } from "solid-js";
import { type Task, calculateUrgencyFromDate, setActiveTaskId, store, copyTask, updateTask, currentTaskContext } from "@/store";
import { cn } from "@/lib/utils";
import { Clock, ArrowUpCircle, Copy, Users2 } from "lucide-solid";
@@ -40,14 +40,29 @@ export const TaskCard: Component<{ task: Task }> = (props) => {
return tags;
});
const isDueToday = createMemo(() => {
if (!props.task.dueDate) return false;
try {
const todayStr = new Date().toLocaleDateString('en-CA');
const dueStr = new Date(props.task.dueDate).toLocaleDateString('en-CA');
return todayStr === dueStr;
} catch {
return false;
}
});
return (
<div
class={cn(
"group flex items-center p-3 sm:p-4 bg-card border border-border rounded-2xl transition-all duration-500 hover:duration-100 hover:shadow-xl hover:shadow-primary/5 hover:-translate-y-0.5 cursor-pointer w-full min-w-0 overflow-hidden",
"group relative flex items-center p-3 sm:p-4 bg-card border border-border rounded-2xl transition-all duration-500 hover:duration-100 hover:shadow-xl hover:shadow-primary/5 hover:-translate-y-0.5 cursor-pointer w-full min-w-0 overflow-hidden",
props.task.completed && "opacity-60"
)}
onClick={() => setActiveTaskId(props.task.id)}
>
{/* Today indicator */}
<Show when={isDueToday() && !props.task.completed}>
<div class="absolute left-0 top-3 bottom-3 w-1 bg-primary rounded-r-md" />
</Show>
{/* Status Dropdown */}
<div class="mr-2 sm:mr-3 shrink-0" onClick={(e) => e.stopPropagation()}>
<Select<any>