41 lines
1007 B
TypeScript
41 lines
1007 B
TypeScript
import { useSortable } from "@dnd-kit/sortable";
|
|
import { Button } from "@repo/shadcn-ui/components";
|
|
import { cn } from "@repo/shadcn-ui/lib/utils";
|
|
import { t } from "i18next";
|
|
import { GripVerticalIcon } from "lucide-react";
|
|
|
|
export interface DataTableRowDragHandleCellProps {
|
|
rowId: string;
|
|
className?: string;
|
|
}
|
|
|
|
export const DataTableRowDragHandleCell = ({
|
|
rowId,
|
|
className,
|
|
}: DataTableRowDragHandleCellProps) => {
|
|
const { attributes, listeners, isDragging } = useSortable({
|
|
id: rowId,
|
|
});
|
|
|
|
return (
|
|
<Button
|
|
onClick={(event) => {
|
|
event.preventDefault();
|
|
return;
|
|
}}
|
|
size='icon'
|
|
variant='link'
|
|
className={cn(
|
|
isDragging ? "cursor-grabbing" : "cursor-grab",
|
|
"w-4 h-4 mt-2 text-ring hover:text-muted-foreground",
|
|
className
|
|
)}
|
|
{...attributes}
|
|
{...listeners}
|
|
>
|
|
<GripVerticalIcon className='w-4 h-4' />
|
|
<span className='sr-only'>{t("common.move_row")}</span>
|
|
</Button>
|
|
);
|
|
};
|