[IMPLEMENTED] React-jsonschema-form as a custom editor

We can currently create a JSON field type and we can create a custom editor to go along with it. What I’d like to discuss is opening up the doors to support a field type that can be defined by json schema and use react-jsonschema-form as a custom editor.

Disclaimer: I’ve previously built a custom CMS that relies heavily on react-jsonschema-form for editing fields, and its flexibility is wonderful. I think it would make a perfect fit as a custom editor for the JSON field type that already exists.

What we’d need to add to Squidex: In order to gain the full flexibility of react-jsonschema-form, I think we’d need to be able to define a JSON block at the field declaration level when editing a field’s schema. This JSON block would be specific to that field, and it would be passed as-is to the custom editor.

For instance, in order to run a react-jsonschema-form, you need a json schema document and a “UI schema” document. We could put both these in a Editor JSON Input field for custom JSON editors (example).

So initially, I think what I’m asking for is the ability to pass in a field-specific JSON document to custom editors. This JSON doc would be great for JSON fields but it would also be useful for really any custom editors for any field types because you would gain more flexibility in what you can pass to the custom editor.

Given that request, I think it would then be possible to whip up a custom editor that uses react-jsonschema-form, and if it’s deemed appropriate, perhaps it could make its way into Squidex as a built-in editor type (like rich text, etc.).

One thing I haven’t mentioned is localization of the editor form, but I think that could still all be handled based on that new JSON block for custom editors (in that you could just handle localization by structuring that JSON in a certain way).

Would there be any interest in pursuing this type of functionality? I’d be more than happy to take a part in contributing towards this goal.

It is cool, but I think it would be easier and more efficient to put the json schema somewhere else. For now I would just use a simple url property to the json field setting.

I would start with a custom editor where you pass in the url to the schema as a query string and then extend it from there.

I hadn’t considered passing a url parameter for this. I’ll give that a try. Thanks for the recommendation.

1 Like

Hi, Have you made any progress with that?

No, sorry. I’ve been pulled elsewhere and integrating react-json-schema has been postponed for now. I hope to have some time in the near future to give it a go.

1 Like

I have built a small demo: