89 lines
2.7 KiB
TypeScript
89 lines
2.7 KiB
TypeScript
"use client";
|
|
|
|
import { FC } from "react";
|
|
import { useFormState } from "react-dom";
|
|
import { Grid } from "@mui/material";
|
|
import { TextField, Select, MultiValueField } from "ui";
|
|
import { Create as InternalCreate } from "@/app/_components/Create";
|
|
import { generateCreateAction } from "@/app/_lib/actions";
|
|
import { serviceConfig } from "@/app/_config/config";
|
|
import { FieldDescription } from "@/app/_lib/service";
|
|
|
|
type CreateProps = {
|
|
service: string;
|
|
};
|
|
|
|
export const Create: FC<CreateProps> = ({ service }) => {
|
|
const {
|
|
[service]: { entity, table, displayName, createFields },
|
|
} = serviceConfig;
|
|
const fields = createFields.map((field: any) => {
|
|
const copy = { ...field };
|
|
Object.keys(copy).forEach((key: any) => {
|
|
if (typeof copy[key] === "function") {
|
|
delete copy[key];
|
|
}
|
|
});
|
|
return copy;
|
|
});
|
|
|
|
const createAction = generateCreateAction({ entity, table, fields });
|
|
const initialState = {
|
|
message: null,
|
|
errors: {},
|
|
values: fields.reduce(
|
|
(acc: Record<string, any>, field: FieldDescription) => {
|
|
acc[field.name] = field.defaultValue;
|
|
return acc;
|
|
},
|
|
{},
|
|
),
|
|
};
|
|
const [formState, formAction] = useFormState(createAction, initialState);
|
|
|
|
return (
|
|
<InternalCreate
|
|
title={`Create ${displayName}`}
|
|
entity={entity}
|
|
formAction={formAction}
|
|
formState={formState}
|
|
>
|
|
<Grid container direction="row" rowSpacing={3} columnSpacing={2}>
|
|
{createFields.map(
|
|
(field) =>
|
|
!field.hidden && (
|
|
<Grid key={field.name} item xs={field.size ?? 6}>
|
|
{field.kind === "select" && (
|
|
<Select
|
|
name={field.name}
|
|
label={field.label}
|
|
required={field.required ?? false}
|
|
formState={formState}
|
|
getOptions={field.getOptions}
|
|
/>
|
|
)}
|
|
{field.kind === "multi" && (
|
|
<MultiValueField
|
|
name={field.name}
|
|
label={field.label}
|
|
formState={formState}
|
|
helperText={field.helperText}
|
|
/>
|
|
)}
|
|
{(!field.kind || field.kind === "text") && (
|
|
<TextField
|
|
name={field.name}
|
|
label={field.label}
|
|
lines={field.lines ?? 1}
|
|
required={field.required ?? false}
|
|
formState={formState}
|
|
helperText={field.helperText}
|
|
/>
|
|
)}
|
|
</Grid>
|
|
),
|
|
)}
|
|
</Grid>
|
|
</InternalCreate>
|
|
);
|
|
};
|