Prefilled drafts

gui/rpk-gui/src/lib/crud/components/base-form.tsx

@@ -4,6 +4,7 @@ import { RegistryFieldsType, RegistryWidgetsType, RJSFSchema, UiSchema } from "@
 import CrudTextWidget from "./widgets/crud-text-widget";
 import UnionEnumField from "./fields/union-enum";
 import { ResourceContext } from "../contexts/ResourceContext";
+import { ReactNode } from "react";
 
 type BaseFormProps = {
   schema: RJSFSchema,
@@ -12,6 +13,7 @@ type BaseFormProps = {
   onChange?: (data: any) => void,
   uiSchema?: UiSchema,
   formData?: any,
+  children?: ReactNode
 }
 
 export const customWidgets: RegistryWidgetsType = {
@@ -23,7 +25,7 @@ export const customFields: RegistryFieldsType = {
 }
 
 export const BaseForm: React.FC<BaseFormProps> = (props) => {
-  const { schema, uiSchema, resourceBasePath, formData, onSubmit, onChange } = props;
+  const { schema, uiSchema, resourceBasePath, formData, children, onSubmit, onChange } = props;
 
   return (
     <ResourceContext.Provider value={{basePath: resourceBasePath}} >
@@ -37,6 +39,7 @@ export const BaseForm: React.FC<BaseFormProps> = (props) => {
         widgets={customWidgets}
         fields={customFields}
         onChange={(e, id) => onChange != undefined && onChange(e.formData)}
+        children={children}
       />
     </ResourceContext.Provider>
   )

gui/rpk-gui/src/lib/crud/components/crud-form.tsx

@@ -1,4 +1,4 @@
-import { useEffect, useState } from "react";
+import { ReactNode, useEffect, useState } from "react";
 import { CircularProgress } from "@mui/material";
 import { useForm } from "@refinedev/core";
 import { UiSchema } from "@rjsf/utils";
@@ -12,11 +12,12 @@ type CrudFormProps = {
   resource: string,
   id?: string,
   onSuccess?: (data: any) => void,
-  defaultValue?: any
+  defaultValue?: any,
+  children?: ReactNode
 }
 
 export const CrudForm: React.FC<CrudFormProps> = (props) => {
-  const { schemaName, uiSchema, resourceBasePath="" ,resource, id, onSuccess, defaultValue } = props;
+  const { schemaName, uiSchema, resourceBasePath="" ,resource, id, onSuccess, defaultValue, children } = props;
 
   const { onFinish, query, formLoading } = useForm({
     resource: resourceBasePath == "" ? resource : `${resourceBasePath}/${resource}`,
@@ -57,6 +58,7 @@ export const CrudForm: React.FC<CrudFormProps> = (props) => {
       onSubmit={
         (data: any) => onFinish(data)
       }
+      children={children}
     />
   )
 }