added enter to confirm filter and due today indicator
This commit is contained in:
@@ -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>
|
||||
|
||||
@@ -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>
|
||||
|
||||
Reference in New Issue
Block a user