63 lines
2.3 KiB
TypeScript
63 lines
2.3 KiB
TypeScript
import { ActionIcon, Badge, Table, Tooltip } from "@mantine/core";
|
|
import { useNavigate, useSearchParams } from "react-router";
|
|
import { IconEdit, IconX } from "@tabler/icons-react";
|
|
import { t } from "@/config/i18n";
|
|
import type { Form } from "@/services/resources/forms";
|
|
|
|
export type FormRowProps = {
|
|
form: Form;
|
|
};
|
|
|
|
export default function FormRow({ form }: FormRowProps) {
|
|
const [searchParams] = useSearchParams();
|
|
const navigate = useNavigate();
|
|
return (
|
|
<Table.Tr key={form.id}>
|
|
<Table.Td>
|
|
{form.visible ? (
|
|
<Badge color="green">{t("visible", { capfirst: true })}</Badge>
|
|
) : (
|
|
<Badge color="red">{t("hidden", { capfirst: true })}</Badge>
|
|
)}
|
|
</Table.Td>
|
|
<Table.Td>{form.name}</Table.Td>
|
|
<Table.Td>{form.season}</Table.Td>
|
|
<Table.Td>{form.start}</Table.Td>
|
|
<Table.Td>{form.end}</Table.Td>
|
|
<Table.Td>{form.productor.name}</Table.Td>
|
|
<Table.Td>{form.referer.name}</Table.Td>
|
|
<Table.Td>
|
|
<Tooltip label={t("edit form", { capfirst: true })}>
|
|
<ActionIcon
|
|
size="sm"
|
|
mr="5"
|
|
onClick={(e) => {
|
|
e.stopPropagation();
|
|
navigate(
|
|
`/dashboard/forms/${form.id}/edit${searchParams ? `?${searchParams.toString()}` : ""}`,
|
|
);
|
|
}}
|
|
>
|
|
<IconEdit />
|
|
</ActionIcon>
|
|
</Tooltip>
|
|
<Tooltip label={t("remove form", { capfirst: true })}>
|
|
<ActionIcon
|
|
color="red"
|
|
size="sm"
|
|
mr="5"
|
|
onClick={(e) => {
|
|
e.stopPropagation();
|
|
navigate(
|
|
`/dashboard/forms/${form.id}/delete${searchParams ? `?${searchParams.toString()}` : ""}`,
|
|
);
|
|
}}
|
|
>
|
|
<IconX />
|
|
</ActionIcon>
|
|
</Tooltip>
|
|
</Table.Td>
|
|
</Table.Tr>
|
|
);
|
|
}
|