d91ec8869e
feat: implement delete confirmation dialog component for better UX refactor: update supplier and role index pages to utilize new form dialog and delete confirm dialog components feat: add reusable form dialog component for creating and editing entities feat: introduce filter popover component for enhanced filtering options in data tables feat: create image preview button component for displaying images with modal preview feat: add page header component for consistent page layout feat: implement row actions component for handling actions on table rows feat: add status badge component for displaying entity statuses feat: create toggle status component for easily toggling entity states feat: implement draft save hook for auto-saving form data feat: add server table hook for managing server-side pagination and filtering feat: create utility functions for formatting dates and numbers feat: add constants for month names and measurement units
68 lines
2.3 KiB
TypeScript
68 lines
2.3 KiB
TypeScript
import { Link } from '@inertiajs/react';
|
|
import type { ReactNode } from 'react';
|
|
import { Button } from '@/components/ui/button';
|
|
import {
|
|
Tooltip,
|
|
TooltipContent,
|
|
TooltipProvider,
|
|
TooltipTrigger,
|
|
} from '@/components/ui/tooltip';
|
|
|
|
export type RowAction = {
|
|
label: string;
|
|
icon: ReactNode;
|
|
iconClassName?: string;
|
|
show?: boolean;
|
|
onClick?: () => void;
|
|
href?: string;
|
|
};
|
|
|
|
type RowActionsProps = {
|
|
actions: RowAction[];
|
|
wrapperClassName?: string;
|
|
};
|
|
|
|
export function RowActions({
|
|
actions,
|
|
wrapperClassName = 'flex items-center justify-center gap-1',
|
|
}: RowActionsProps) {
|
|
return (
|
|
<TooltipProvider>
|
|
<div className={wrapperClassName}>
|
|
{actions
|
|
.filter((action) => action.show !== false)
|
|
.map((action) => (
|
|
<Tooltip key={action.label}>
|
|
<TooltipTrigger asChild>
|
|
{action.href ? (
|
|
<Button
|
|
variant="ghost"
|
|
size="icon"
|
|
asChild
|
|
className={action.iconClassName}
|
|
>
|
|
<Link href={action.href}>
|
|
{action.icon}
|
|
</Link>
|
|
</Button>
|
|
) : (
|
|
<Button
|
|
variant="ghost"
|
|
size="icon"
|
|
onClick={action.onClick}
|
|
className={action.iconClassName}
|
|
>
|
|
{action.icon}
|
|
</Button>
|
|
)}
|
|
</TooltipTrigger>
|
|
<TooltipContent side="top">
|
|
{action.label}
|
|
</TooltipContent>
|
|
</Tooltip>
|
|
))}
|
|
</div>
|
|
</TooltipProvider>
|
|
);
|
|
}
|