add: dynamic schema form with pure/impure seperation

pkgs/ui/src/app/machines/add/page.tsx

@@ -1,64 +1,7 @@
 "use client";
 
-import { useForm } from "react-hook-form";
-
-import { JSONSchema7 } from "json-schema";
-import { useMemo, useState } from "react";
-import { schema } from "./schema";
-import Form from "@rjsf/mui";
-import validator from "@rjsf/validator-ajv8";
-import { Button } from "@mui/material";
-
-interface CreateMachineFormProps {
-  schema: JSONSchema7;
-  initialValues: any;
-}
-
-const defaultValues = Object.entries(schema.properties || {}).reduce(
-  (acc, [key, value]) => {
-    /*@ts-ignore*/
-    const init: any = value?.default;
-    if (init) {
-      return {
-        ...acc,
-        [key]: init,
-      };
-    }
-    return acc;
-  },
-  {},
-);
-
-function CreateMachineForm(props: CreateMachineFormProps) {
-  const { schema, initialValues } = props;
-
-  return (
-    <Form
-      acceptcharset="utf-8"
-      // @ts-ignore
-      extraErrors={{
-        __errors: ["Global error; Server said no"],
-        // @ts-ignore
-        name: {
-          __errors: ["Name is already in use"],
-        },
-      }}
-      schema={schema}
-      validator={validator}
-      liveValidate={true}
-      templates={{
-        ButtonTemplates: {
-          SubmitButton: (props) => (
-            <Button type="submit" variant="contained" color="secondary">
-              Create Machine
-            </Button>
-          ),
-        },
-      }}
-    />
-  );
-}
+import { CreateMachineForm } from "@/components/createMachineForm";
 
 export default function CreateMachine() {
-  return <CreateMachineForm schema={schema} initialValues={defaultValues} />;
+  return <CreateMachineForm />;
 }

pkgs/ui/src/app/machines/add/schema.ts

@@ -1,111 +0,0 @@
-import { RJSFSchema } from "@rjsf/utils";
-export const schema: RJSFSchema = {
-  type: "object",
-  properties: {
-    name: {
-      type: "string",
-      default: "John-nixi",
-      description: "The name of the machine",
-    },
-    age: {
-      type: "integer",
-      default: 42,
-      description: "The age of the user",
-      maximum: 40,
-    },
-    role: {
-      enum: ["New York", "Amsterdam", "Hong Kong"],
-      description: "Role of the user",
-    },
-    kernelModules: {
-      type: "array",
-      items: {
-        type: "string",
-      },
-      default: ["nvme", "xhci_pci", "ahci"],
-      description: "A list of enabled kernel modules",
-    },
-    userIds: {
-      type: "array",
-      items: {
-        type: "object",
-        properties: {
-          user: {
-            type: "string",
-          },
-          id: {
-            type: "integer",
-          },
-        },
-      },
-      default: [
-        {
-          user: "John",
-          id: 12,
-        },
-      ],
-      description: "Some attributes",
-    },
-    xdg: {
-      type: "object",
-      properties: {
-        portal: {
-          type: "object",
-          properties: {
-            xdgOpenUsePortal: {
-              type: "boolean",
-              default: false,
-            },
-            enable: {
-              type: "boolean",
-              default: false,
-            },
-            lxqt: {
-              type: "object",
-              properties: {
-                enable: {
-                  type: "boolean",
-                  default: false,
-                },
-                styles: {
-                  type: "array",
-                  items: {
-                    type: "string",
-                  },
-                },
-              },
-            },
-            extraPortals: {
-              type: "array",
-              items: {
-                type: "string",
-              },
-            },
-            wlr: {
-              type: "object",
-              properties: {
-                enable: {
-                  type: "boolean",
-                  default: false,
-                },
-                settings: {
-                  type: "object",
-                  default: {
-                    screencast: {
-                      output_name: "HDMI-A-1",
-                      max_fps: 30,
-                      exec_before: "disable_notifications.sh",
-                      exec_after: "enable_notifications.sh",
-                      chooser_type: "simple",
-                      chooser_cmd: "${pkgs.slurp}/bin/slurp -f %o -or",
-                    },
-                  },
-                },
-              },
-            },
-          },
-        },
-      },
-    },
-  },
-};