Files
roleplay-contract/gui/rpk-gui/src/lib/crud/components/base-form.tsx
2025-05-14 18:26:24 +02:00

60 lines
1.9 KiB
TypeScript

import validator from "@rjsf/validator-ajv8";
import Form from "@rjsf/mui";
import { RegistryFieldsType, RegistryWidgetsType, RJSFSchema, UiSchema } from "@rjsf/utils";
import CrudTextWidget from "./widgets/crud-text-widget";
import UnionEnumField from "./fields/union-enum";
import ArrayFieldTemplate from "./templates/ArrayFieldTemplate"
import ArrayFieldItemTemplate from "./templates/ArrayFieldItemTemplate";
import { ResourceContext } from "../contexts/ResourceContext";
import { ReactNode } from "react";
import { ParametersContextProvider } from "../contexts/parameters-context";
import CrudArrayField from "./fields/crud-array-field";
type BaseFormProps = {
schema: RJSFSchema,
resourceBasePath: string,
onSubmit?: (data: any) => void,
onChange?: (data: any) => void,
uiSchema?: UiSchema,
formData?: any,
children?: ReactNode
}
export const customWidgets: RegistryWidgetsType = {
TextWidget: CrudTextWidget,
};
export const customFields: RegistryFieldsType = {
AnyOfField: UnionEnumField,
ArrayField: CrudArrayField
}
const customTemplates = {
ArrayFieldTemplate,
ArrayFieldItemTemplate
}
export const BaseForm: React.FC<BaseFormProps> = (props) => {
const { schema, uiSchema, resourceBasePath, formData, children, onSubmit, onChange } = props;
return (
<ResourceContext.Provider value={{basePath: resourceBasePath}} >
<ParametersContextProvider>
<Form
schema={schema}
uiSchema={uiSchema === undefined ? {} : uiSchema}
formData={formData}
onSubmit={(e, id) => onSubmit != undefined && onSubmit(e.formData)}
validator={validator}
omitExtraData={true}
widgets={customWidgets}
fields={customFields}
templates={customTemplates}
onChange={(e, id) => onChange != undefined && onChange(e.formData)}
children={children}
/>
</ParametersContextProvider>
</ResourceContext.Provider>
)
}