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

added buckets

Browse Source
This commit is contained in:
Timothy Cardoza
2026-02-13 19:29:46 -06:00
parent 9761c8c5fc
commit a967bbd177
4 changed files with 447 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/Navigation.tsx
+61 -28
View File
@@ -1,5 +1,5 @@
import { type Component, For, Show } from "solid-js";
import { LayoutDashboard, ListTodo, Settings, Clock, ArrowUpCircle, PanelLeftClose, Snowflake, Pickaxe, ChevronDown, Gauge, TrendingUp, Users } from "lucide-solid";
import { LayoutDashboard, ListTodo, Settings, Clock, ArrowUpCircle, PanelLeftClose, Snowflake, Pickaxe, ChevronDown, Gauge, TrendingUp, Users, Box } from "lucide-solid";
import { cn } from "@/lib/utils";
import { Button } from "./ui/button";
import { Popover, PopoverContent, PopoverTrigger } from "@/components/ui/popover";
@@ -162,11 +162,13 @@ export const ContextSwitcher: Component<{
return c === 'mine' ? "My Workspace" : c.name;
};
const handleSwitch = (userId: string, name: string) => {
if (userId === 'mine') {
const handleSwitch = (id: string, name: string, type: 'mine' | 'user' | 'bucket' = 'mine') => {
if (type === 'mine') {
setCurrentTaskContext('mine');
} else if (type === 'bucket') {
setCurrentTaskContext({ bucketId: id, name });
} else {
setCurrentTaskContext({ userId, name });
setCurrentTaskContext({ userId: id, name });
}
// Close popover
@@ -214,7 +216,7 @@ export const ContextSwitcher: Component<{
<PopoverContent class="w-[200px] p-1 bg-card border-border shadow-xl">
<div class="space-y-0.5">
<button
onClick={() => handleSwitch('mine', '')}
onClick={() => handleSwitch('mine', '', 'mine')}
class={cn(
"w-full flex items-center gap-2 p-2 rounded-md text-sm transition-colors",
ctx() === 'mine' ? "bg-primary/10 text-primary font-semibold" : "hover:bg-muted text-foreground"
@@ -225,29 +227,60 @@ export const ContextSwitcher: Component<{
</div>
My Workspace
</button>
<div class="py-1">
<div class="h-px bg-border/50" />
</div>
<div class="px-2 py-1 text-[10px] font-bold uppercase text-muted-foreground tracking-wider flex items-center gap-2">
<span>Oversight</span>
<span class="ml-auto bg-muted px-1.5 rounded text-[9px]">{oversightUsers()?.length}</span>
</div>
<For each={oversightUsers()}>
{(user) => (
<button
onClick={() => handleSwitch(user.id, user.name)}
class={cn(
"w-full flex items-center gap-2 p-2 rounded-md text-sm transition-colors",
(ctx() as any).userId === user.id ? "bg-orange-500/10 text-orange-600 font-semibold" : "hover:bg-muted text-foreground"
)}
>
<div class="w-4 h-4 rounded-full bg-orange-500/20 flex items-center justify-center">
<div class="w-2 h-2 rounded-full bg-orange-500" />
</div>
<span class="truncate">{user.name}</span>
</button>
)}
</For>
<Show when={store.subscribedBuckets.length > 0}>
<div class="py-1">
<div class="h-px bg-border/50" />
</div>
<div class="px-2 py-1 text-[10px] font-bold uppercase text-muted-foreground tracking-wider flex items-center gap-2">
<span>Buckets</span>
<span class="ml-auto bg-muted px-1.5 rounded text-[9px]">{store.subscribedBuckets.length}</span>
</div>
<For each={store.buckets.filter(b => store.subscribedBuckets.includes(b.id))}>
{(bucket) => (
<button
onClick={() => handleSwitch(bucket.id, bucket.name, 'bucket')}
class={cn(
"w-full flex items-center gap-2 p-2 rounded-md text-sm transition-colors",
(ctx() as any).bucketId === bucket.id ? "bg-muted text-foreground font-semibold ring-1 ring-border" : "hover:bg-muted text-foreground"
)}
>
<div
class="w-4 h-4 rounded-md flex items-center justify-center text-white"
style={{ "background-color": bucket.color }}
>
<Box size={10} />
</div>
<span class="truncate">{bucket.name}</span>
</button>
)}
</For>
</Show>
<Show when={oversightUsers() && oversightUsers()!.length > 0}>
<div class="py-1">
<div class="h-px bg-border/50" />
</div>
<div class="px-2 py-1 text-[10px] font-bold uppercase text-muted-foreground tracking-wider flex items-center gap-2">
<span>Oversight</span>
<span class="ml-auto bg-muted px-1.5 rounded text-[9px]">{oversightUsers()?.length}</span>
</div>
<For each={oversightUsers()}>
{(user) => (
<button
onClick={() => handleSwitch(user.id, user.name, 'user')}
class={cn(
"w-full flex items-center gap-2 p-2 rounded-md text-sm transition-colors",
(ctx() as any).userId === user.id ? "bg-orange-500/10 text-orange-600 font-semibold" : "hover:bg-muted text-foreground"
)}
>
<div class="w-4 h-4 rounded-full bg-orange-500/20 flex items-center justify-center">
<div class="w-2 h-2 rounded-full bg-orange-500" />
</div>
<span class="truncate">{user.name}</span>
</button>
)}
</For>
</Show>
</div>
</PopoverContent>
</Popover>