77 lines
2.1 KiB
TypeScript
77 lines
2.1 KiB
TypeScript
import { Label } from "@repo/shadcn-ui/components/label";
|
|
import { SelectWithAction } from "@repo/shadcn-ui/components/select-with-action";
|
|
import type { UseFormReturn } from "react-hook-form";
|
|
import { useTranslation } from "react-i18next";
|
|
|
|
import {
|
|
TicketChannelSchema,
|
|
type TicketInput,
|
|
TicketPrioritySchema,
|
|
TicketStateSchema,
|
|
} from "../../common/tickets";
|
|
export function TicketClassificationFields({
|
|
form,
|
|
prefix,
|
|
}: {
|
|
form: UseFormReturn<TicketInput>;
|
|
prefix: string;
|
|
}) {
|
|
const { t } = useTranslation("companies");
|
|
const values = form.watch();
|
|
const fields = [
|
|
{
|
|
name: "channel",
|
|
category: "channels",
|
|
options: TicketChannelSchema.options,
|
|
onChange: (value: string) => {
|
|
const parsed = TicketChannelSchema.safeParse(value);
|
|
if (parsed.success) {
|
|
form.setValue("channel", parsed.data);
|
|
}
|
|
},
|
|
},
|
|
{
|
|
name: "state",
|
|
category: "states",
|
|
options: TicketStateSchema.options,
|
|
onChange: (value: string) => {
|
|
const parsed = TicketStateSchema.safeParse(value);
|
|
if (parsed.success) {
|
|
form.setValue("state", parsed.data);
|
|
}
|
|
},
|
|
},
|
|
{
|
|
name: "priority",
|
|
category: "priorities",
|
|
options: TicketPrioritySchema.options,
|
|
onChange: (value: string) => {
|
|
const parsed = TicketPrioritySchema.safeParse(value);
|
|
if (parsed.success) {
|
|
form.setValue("priority", parsed.data);
|
|
}
|
|
},
|
|
},
|
|
] as const;
|
|
return (
|
|
<>
|
|
{fields.map((field) => (
|
|
<div className="space-y-2" key={field.name}>
|
|
<Label htmlFor={`${prefix}-${field.name}`}>{t(`tickets.${field.name}`)}</Label>
|
|
<SelectWithAction
|
|
id={`${prefix}-${field.name}`}
|
|
label={t(`tickets.${field.name}`)}
|
|
onValueChange={field.onChange}
|
|
options={field.options.map((value) => ({
|
|
value,
|
|
label: t(`tickets.${field.category}.${value}`),
|
|
}))}
|
|
placeholder={t("tickets.choose")}
|
|
value={values[field.name]}
|
|
/>
|
|
</div>
|
|
))}
|
|
</>
|
|
);
|
|
}
|