diff --git a/pages/yaml-to-zod.tsx b/pages/yaml-to-zod.tsx new file mode 100644 index 0000000..78e373b --- /dev/null +++ b/pages/yaml-to-zod.tsx @@ -0,0 +1,64 @@ +import ConversionPanel from "@components/ConversionPanel"; +import { EditorPanelProps } from "@components/EditorPanel"; +import Form, { InputType } from "@components/Form"; +import { useSettings } from "@hooks/useSettings"; +import * as React from "react"; +import { useCallback } from "react"; +import yaml from "yaml"; + +interface Settings { + rootName: string; +} + +const formFields = [ + { + type: InputType.TEXT_INPUT, + key: "rootName", + label: "Root Schema Name" + } +]; + +export default function YamlToZod() { + const name = "YAML to Zod Schema"; + + const [settings, setSettings] = useSettings(name, { + rootName: "schema" + }); + + const transformer = useCallback( + async ({ value }) => { + const yamlToJSON = JSON.stringify(yaml.parse(value)); + const { jsonToZod } = await import("json-to-zod"); + return jsonToZod(JSON.parse(yamlToJSON), settings.rootName, true); + }, + [settings] + ); + + const getSettingsElement = useCallback( + ({ open, toggle }) => { + return ( + + title={name} + onSubmit={setSettings} + open={open} + toggle={toggle} + formsFields={formFields} + initialValues={settings} + /> + ); + }, + [] + ); + + return ( + + ); +} diff --git a/utils/routes.tsx b/utils/routes.tsx index cb19f16..d70a860 100644 --- a/utils/routes.tsx +++ b/utils/routes.tsx @@ -355,25 +355,35 @@ export const categorizedRoutes = [ ] }, { - category: "Others", + category: "YAML", iconName: "", content: [ { - label: "XML to JSON", - path: "/xml-to-json", - packageName: "xml-js", - packageUrl: "https://github.com/nashwaan/xml-js" - }, - { - label: "YAML to JSON", + label: "to JSON", path: "/yaml-to-json", packageName: "yaml", packageUrl: "https://github.com/tj/js-yaml" }, { - label: "YAML to TOML", + label: "to TOML", path: "/yaml-to-toml" }, + { + label: "to Zod Schema", + path: "/yaml-to-zod" + } + ] + }, + { + category: "Others", + iconName: "", + content: [ + { + label: "XML to JSON", + path: "/xml-to-json", + packageName: "xml-js", + packageUrl: "https://github.com/nashwaan/xml-js" + }, { label: "Markdown to HTML", path: "/markdown-to-html", @@ -386,10 +396,6 @@ export const categorizedRoutes = [ packageUrl: "https://www.npmjs.com/package/@iarna/toml", packageName: "@iarna/toml" }, - { - label: "TOML to YAML", - path: "/toml-to-yaml" - }, { label: "Cadence to Go", path: "/cadence-to-go"