Cardoza_Construction/TasGrid
3
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

added search/filter and fixed horizontal fit for mobile.

Browse Source
This commit is contained in:
Timothy Cardoza
2026-01-31 15:32:06 -06:00
parent ce58ee8fc5
commit 2c83b91e66
12 changed files with 376 additions and 60 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/views/CriticalView.tsx
+7 -5
View File
@@ -1,13 +1,15 @@
import { type Component, For, createMemo } from "solid-js";
import { store, getCombinedScore } from "@/store";
import { store, getCombinedScore, matchesFilter } from "@/store";
import { TaskCard } from "@/components/TaskCard";
export const CriticalView: Component = () => {
const sortedTasks = createMemo(() => {
return [...store.tasks].filter(t => !t.deletedAt).sort((a, b) => {
if (a.completed !== b.completed) return a.completed ? 1 : -1;
return getCombinedScore(b) - getCombinedScore(a);
});
return [...store.tasks]
.filter(t => !t.deletedAt && matchesFilter(t))
.sort((a, b) => {
if (a.completed !== b.completed) return a.completed ? 1 : -1;
return getCombinedScore(b) - getCombinedScore(a);
});
});
return (
src/views/MatrixView.tsx
+10 -10
View File
@@ -1,10 +1,10 @@
import { type Component, For, createMemo } from "solid-js";
import { store, calculateUrgencyScore, setActiveTaskId, setStore, getCombinedScore } from "@/store";
import { store, calculateUrgencyScore, setActiveTaskId, setStore, getCombinedScore, matchesFilter } from "@/store";
import { cn } from "@/lib/utils";
import { Select, SelectContent, SelectItem, SelectTrigger } from "@/components/ui/select";
export const MatrixView: Component = () => {
const activeTasks = createMemo(() => store.tasks.filter(t => !t.completed && !t.deletedAt));
const activeTasks = createMemo(() => store.tasks.filter(t => !t.completed && !t.deletedAt && matchesFilter(t)));
const scaleOptions = ["1", "7", "30", "60", "90"];
@@ -15,12 +15,12 @@ export const MatrixView: Component = () => {
<p class="text-muted-foreground mt-1 text-lg">Urgency vs Priority mapping.</p>
</header>
<div class="flex-1 relative border-2 border-dashed border-muted rounded-3xl overflow-hidden bg-muted/20">
<div class="flex-1 relative border-2 border-dashed border-muted rounded-2xl md:rounded-3xl overflow-hidden bg-muted/20">
{/* Axis Labels */}
<div class="absolute bottom-4 left-1/2 -translate-x-1/2 text-[10px] font-bold uppercase tracking-widest text-muted-foreground/50 flex items-center gap-2 z-30">
<span>← Soon</span>
<div class="flex items-center gap-1 bg-background/50 backdrop-blur-sm px-2 py-0.5 rounded-full border border-border/50 group hover:bg-background/80 transition-colors cursor-pointer">
<span class="text-[9px]">Time:</span>
<div class="absolute bottom-4 left-1/2 -translate-x-1/2 text-[9px] md:text-[10px] font-bold uppercase tracking-widest text-muted-foreground/50 flex items-center gap-1 md:gap-2 z-30 w-[calc(100%-2rem)] justify-center">
<span class="truncate">← Soon</span>
<div class="flex items-center gap-1 bg-background/50 backdrop-blur-sm px-1.5 md:px-2 py-0.5 rounded-full border border-border/50 group hover:bg-background/80 transition-colors cursor-pointer shrink-0">
<span class="text-[8px] md:text-[9px]">Time:</span>
<Select
value={store.matrixScaleDays.toString()}
onChange={(val) => val && setStore("matrixScaleDays", parseInt(val))}
@@ -32,15 +32,15 @@ export const MatrixView: Component = () => {
</SelectItem>
)}
>
<SelectTrigger class="h-auto p-0 min-w-[50px] bg-transparent border-none shadow-none focus:ring-0 text-[10px] font-black text-foreground">
<SelectTrigger class="h-auto p-0 min-w-[40px] md:min-w-[50px] bg-transparent border-none shadow-none focus:ring-0 text-[8px] md:text-[10px] font-black text-foreground">
<span>{store.matrixScaleDays} {store.matrixScaleDays === 1 ? 'day' : 'days'}</span>
</SelectTrigger>
<SelectContent class="z-[150]" />
</Select>
</div>
<span>Later →</span>
<span class="truncate">Later →</span>
</div>
<div class="absolute left-4 top-1/2 -translate-y-1/2 -rotate-90 text-[10px] font-bold uppercase tracking-widest text-muted-foreground/50 pointer-events-none">
<div class="absolute left-2 md:left-4 top-1/2 -translate-y-1/2 -rotate-90 text-[8px] md:text-[10px] font-bold uppercase tracking-widest text-muted-foreground/30 pointer-events-none">
← Low (Priority) High →
</div>
src/views/PriorityView.tsx
+8 -6
View File
@@ -1,14 +1,16 @@
import { type Component, For, createMemo } from "solid-js";
import { store, getCombinedScore } from "@/store";
import { store, getCombinedScore, matchesFilter } from "@/store";
import { TaskCard } from "@/components/TaskCard";
export const PriorityView: Component = () => {
const sortedTasks = createMemo(() => {
return [...store.tasks].filter(t => !t.deletedAt).sort((a, b) => {
if (a.completed !== b.completed) return a.completed ? 1 : -1;
// Use combined score to account for priority, urgency, and tags
return getCombinedScore(b) - getCombinedScore(a);
});
return [...store.tasks]
.filter(t => !t.deletedAt && matchesFilter(t))
.sort((a, b) => {
if (a.completed !== b.completed) return a.completed ? 1 : -1;
// Use combined score to account for priority, urgency, and tags
return getCombinedScore(b) - getCombinedScore(a);
});
});
return (
src/views/SettingsView.tsx
+1 -1
View File
@@ -12,7 +12,7 @@ import { createSignal } from "solid-js";
export const SettingsView: Component = () => {
return (
<div class="px-6 py-10 max-w-2xl mx-auto space-y-10 animate-in fade-in slide-in-from-bottom-2 duration-500">
<div class="py-10 max-w-2xl mx-auto space-y-10 animate-in fade-in slide-in-from-bottom-2 duration-500">
<header class="space-y-1 flex items-center justify-between">
<div>
<h1 class="text-3xl font-bold tracking-tight">Settings</h1>
src/views/UrgencyView.tsx
+11 -9
View File
@@ -1,17 +1,19 @@
import { type Component, For, createMemo } from "solid-js";
import { store, calculateUrgencyScore, getCombinedScore } from "@/store";
import { store, calculateUrgencyScore, getCombinedScore, matchesFilter } from "@/store";
import { TaskCard } from "@/components/TaskCard";
export const UrgencyView: Component = () => {
const sortedTasks = createMemo(() => {
return [...store.tasks].filter(t => !t.deletedAt).sort((a, b) => {
if (a.completed !== b.completed) return a.completed ? 1 : -1;
const uA = calculateUrgencyScore(a.dueDate);
const uB = calculateUrgencyScore(b.dueDate);
if (uA !== uB) return uB - uA;
// Tie-break with combined score (Priority + Tags)
return getCombinedScore(b) - getCombinedScore(a);
});
return [...store.tasks]
.filter(t => !t.deletedAt && matchesFilter(t))
.sort((a, b) => {
if (a.completed !== b.completed) return a.completed ? 1 : -1;
const uA = calculateUrgencyScore(a.dueDate);
const uB = calculateUrgencyScore(b.dueDate);
if (uA !== uB) return uB - uA;
// Tie-break with combined score (Priority + Tags)
return getCombinedScore(b) - getCombinedScore(a);
});
});
return (