Some checks failed
Build Frontend / build (push) Failing after 7s
Replaces imports from 'components/ui' with 'components/common' across the app and dashboard pages, and updates model and API imports to use new paths under 'lib'. Removes redundant authentication checks from several dashboard pages. Adds new dashboard components and utility files, and reorganizes hooks and services into the 'lib' directory for improved structure.
104 lines
4.3 KiB
TypeScript
104 lines
4.3 KiB
TypeScript
"use client"
|
|
|
|
import { Button } from "@/components/common/button"
|
|
import {
|
|
DropdownMenu,
|
|
DropdownMenuContent,
|
|
DropdownMenuItem,
|
|
DropdownMenuLabel,
|
|
DropdownMenuSeparator,
|
|
DropdownMenuTrigger,
|
|
DropdownMenuCheckboxItem,
|
|
} from "@/components/common/dropdown-menu"
|
|
import { Settings2, ChevronUp, ChevronDown, RotateCcw, Eye, EyeOff, Cog } from "lucide-react"
|
|
import { WidgetConfig } from "@/lib/types/dashboard"
|
|
|
|
interface WidgetSettingsProps {
|
|
widgets: WidgetConfig[]
|
|
onToggle: (id: string) => void
|
|
onMove: (id: string, direction: "up" | "down") => void
|
|
onReset: () => void
|
|
onConfigure?: (widget: WidgetConfig) => void
|
|
}
|
|
|
|
export function WidgetSettings({ widgets, onToggle, onMove, onReset, onConfigure }: WidgetSettingsProps) {
|
|
return (
|
|
<DropdownMenu>
|
|
<DropdownMenuTrigger asChild>
|
|
<Button variant="outline" size="sm" className="h-8 gap-2">
|
|
<Settings2 className="h-4 w-4" />
|
|
<span className="hidden sm:inline">Customize</span>
|
|
</Button>
|
|
</DropdownMenuTrigger>
|
|
<DropdownMenuContent align="end" className="w-64">
|
|
<DropdownMenuLabel className="flex items-center justify-between">
|
|
Dashboard Widgets
|
|
<Button
|
|
variant="ghost"
|
|
size="sm"
|
|
className="h-6 px-2 text-xs"
|
|
onClick={onReset}
|
|
>
|
|
<RotateCcw className="h-3 w-3 mr-1" />
|
|
Reset
|
|
</Button>
|
|
</DropdownMenuLabel>
|
|
<DropdownMenuSeparator />
|
|
{widgets.map((widget, index) => (
|
|
<div key={widget.id} className="flex items-center gap-1 px-2 py-1.5 hover:bg-muted/50 rounded-sm">
|
|
<button
|
|
onClick={() => onToggle(widget.id)}
|
|
className="flex-1 flex items-center gap-2 text-sm hover:text-foreground transition-colors"
|
|
>
|
|
{widget.visible ? (
|
|
<Eye className="h-4 w-4 text-primary" />
|
|
) : (
|
|
<EyeOff className="h-4 w-4 text-muted-foreground" />
|
|
)}
|
|
<span className={widget.visible ? "" : "text-muted-foreground line-through"}>
|
|
{widget.title}
|
|
</span>
|
|
</button>
|
|
<div className="flex items-center gap-0.5">
|
|
{widget.settings && onConfigure && (
|
|
<Button
|
|
variant="ghost"
|
|
size="icon"
|
|
className="h-6 w-6"
|
|
onClick={(e) => {
|
|
e.stopPropagation()
|
|
onConfigure(widget)
|
|
}}
|
|
title="Configure widget"
|
|
>
|
|
<Cog className="h-3 w-3" />
|
|
</Button>
|
|
)}
|
|
<Button
|
|
variant="ghost"
|
|
size="icon"
|
|
className="h-6 w-6"
|
|
onClick={() => onMove(widget.id, "up")}
|
|
disabled={index === 0}
|
|
>
|
|
<ChevronUp className="h-3 w-3" />
|
|
</Button>
|
|
<Button
|
|
variant="ghost"
|
|
size="icon"
|
|
className="h-6 w-6"
|
|
onClick={() => onMove(widget.id, "down")}
|
|
disabled={index === widgets.length - 1}
|
|
>
|
|
<ChevronDown className="h-3 w-3" />
|
|
</Button>
|
|
</div>
|
|
</div>
|
|
))}
|
|
</DropdownMenuContent>
|
|
</DropdownMenu>
|
|
)
|
|
}
|
|
|
|
|