32 lines
946 B
TypeScript
32 lines
946 B
TypeScript
import { LayoutGrid, LayoutList } from 'lucide-react';
|
|
import { ToggleGroup, ToggleGroupItem } from '@/components/ui/toggle-group';
|
|
|
|
export type ViewMode = 'table' | 'card';
|
|
|
|
type ViewToggleProps = {
|
|
value: ViewMode;
|
|
onChange: (value: ViewMode) => void;
|
|
};
|
|
|
|
export function ViewToggle({ value, onChange }: ViewToggleProps) {
|
|
return (
|
|
<ToggleGroup
|
|
type="single"
|
|
variant="outline"
|
|
value={value}
|
|
onValueChange={(next) => {
|
|
if (next) {
|
|
onChange(next as ViewMode);
|
|
}
|
|
}}
|
|
>
|
|
<ToggleGroupItem value="table" aria-label="Tampilan tabel">
|
|
<LayoutList className="h-4 w-4" />
|
|
</ToggleGroupItem>
|
|
<ToggleGroupItem value="card" aria-label="Tampilan kartu">
|
|
<LayoutGrid className="h-4 w-4" />
|
|
</ToggleGroupItem>
|
|
</ToggleGroup>
|
|
);
|
|
}
|