mirror of
https://github.com/hanzoai/shadcn.git
synced 2026-10-30 18:22:59 +00:00
zeekay
16c4453cc1
Squash merge of shadcn-ui/ui main branch into hanzo/ui, bringing in: - [email protected] through [email protected] releases - New apps/v4 directory structure - Registry system improvements and MCP server - Framework support (Vue, Svelte, React Native) - New templates (vite-app, monorepo-next, laravel) - Zod 4 compatibility (scoped override for zod@>4) - Test fixture corrections for alias resolution All 867 merge conflicts resolved preserving Hanzo customizations. 1020/1020 shadcn tests pass.
65 lines
1.9 KiB
TypeScript
65 lines
1.9 KiB
TypeScript
"use client"
|
|
|
|
import { type Table } from "@tanstack/react-table"
|
|
import { X } from "lucide-react"
|
|
|
|
import { Button } from "@/registry/new-york-v4/ui/button"
|
|
import { Input } from "@/registry/new-york-v4/ui/input"
|
|
import { DataTableViewOptions } from "@/app/(app)/examples/tasks/components/data-table-view-options"
|
|
|
|
import { priorities, statuses } from "../data/data"
|
|
import { DataTableFacetedFilter } from "./data-table-faceted-filter"
|
|
|
|
interface DataTableToolbarProps<TData> {
|
|
table: Table<TData>
|
|
}
|
|
|
|
export function DataTableToolbar<TData>({
|
|
table,
|
|
}: DataTableToolbarProps<TData>) {
|
|
const isFiltered = table.getState().columnFilters.length > 0
|
|
|
|
return (
|
|
<div className="flex items-center justify-between">
|
|
<div className="flex flex-1 items-center gap-2">
|
|
<Input
|
|
placeholder="Filter tasks..."
|
|
value={(table.getColumn("title")?.getFilterValue() as string) ?? ""}
|
|
onChange={(event) =>
|
|
table.getColumn("title")?.setFilterValue(event.target.value)
|
|
}
|
|
className="h-8 w-[150px] lg:w-[250px]"
|
|
/>
|
|
{table.getColumn("status") && (
|
|
<DataTableFacetedFilter
|
|
column={table.getColumn("status")}
|
|
title="Status"
|
|
options={statuses}
|
|
/>
|
|
)}
|
|
{table.getColumn("priority") && (
|
|
<DataTableFacetedFilter
|
|
column={table.getColumn("priority")}
|
|
title="Priority"
|
|
options={priorities}
|
|
/>
|
|
)}
|
|
{isFiltered && (
|
|
<Button
|
|
variant="ghost"
|
|
size="sm"
|
|
onClick={() => table.resetColumnFilters()}
|
|
>
|
|
Reset
|
|
<X />
|
|
</Button>
|
|
)}
|
|
</div>
|
|
<div className="flex items-center gap-2">
|
|
<DataTableViewOptions table={table} />
|
|
<Button size="sm">Add Task</Button>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|