Error

{message}

\n);\n\n// Loading component\nconst Loading = () => (\n

\n Loading schema...\n

\n);\n\n// Main App component\nconst App = () => {\n const [schema, setSchema] = useState(null);\n const [references, setReferences] = useState([]);\n const [loading, setLoading] = useState(false);\n const [error, setError] = useState(null);\n \n useEffect(() => {\n const fetchSchema = async () => {\n if (!initialData.schemaUrl) {\n setError('No schema URL provided. Use ?url=https://example.com/schema.json');\n return;\n }\n \n setLoading(true);\n try {\n const response = await fetch(`/api/schema?url=${encodeURIComponent(initialData.schemaUrl)}`);\n const data = await response.json();\n \n if (data.error) {\n throw new Error(data.error);\n }\n \n setSchema(data.schema);\n // If the schema has an $id, add it to references\n if (data.schema.$id) {\n setReferences([data.schema]);\n }\n } catch (err) {\n setError(err.message || 'Failed to load schema');\n } finally {\n setLoading(false);\n }\n };\n \n fetchSchema();\n }, []);\n \n if (error) {\n return ;\n }\n \n if (loading) {\n return ;\n }\n \n if (!schema) {\n return ;\n }\n \n return (\n \n \n

\n 0 ? references : undefined} \n />\n

\n \n );\n};\n\n// Render the app\nconst root = createRoot(document.getElementById('root'));\nroot.render();","deleted","label",[168,149],"frontend","permalink","https://www.val.town/x/wolf/JsonSchemaViewer/code/frontend/app.jsx","extension","actionData","errors"]