Right now, the editor application does only what it was developed to do: Edit content in the Yancy tables. But that's not the only thing one needs to do to administer a website, and it'd be easier for users to have one place to go to do all their work: The Yancy editor.
This ticket is a loose collection of ideas for how to make the Yancy editor into an app that's easy to extend with custom JavaScript / Vue components. These may change slightly as Yancy evolves.
Some work on this has already been completed:
Users can add custom Vue components to the editor using the yancy.editor.include helper.
Users can add menus to the sidebar of the editor using the yancy.editor.menu helper. These menus get routed to Vue components added via yancy.editor.include.
This work is a blocker for a v3.0 release, but not the v2.0 release.
Single-Page App with Vue Router
It will improve modularity if the Yancy editor is a single-page application that uses Yancy APIs and the Vue router to move between views.
The edit form / new item form should be its own destination, not a drawer that slides out from a table.
Data Caching with VueX
Different parts of the application are going to need to share data between themselves and the backend. The editor should use VueX to provide an API to get/set/create/delete items in the backend. The VueX state is the source of truth for all the components in the editor application.
Editor global
The editor Vue application should be available from the global Yancy variable. This allows for us to add an API to interact with the editor from custom JavaScript.
Smaller, atomic field components
Rather than having one "edit field" component, the editor should have a set of components for each type of data (input type, not JSON Schema type). There should be a method on the editor global (Yancy) that allows a user to register their own Vue component to handle a given type of input (if this can be done with Vue's "components" feature, more's the better).
Schema customizations
See #61. The new menus/buttons should allow routing to specific Vue components.
Documentation / Examples
There should be documentation on how to add custom panels to the editor, including multi-step workflows.
Right now, the editor application does only what it was developed to do: Edit content in the Yancy tables. But that's not the only thing one needs to do to administer a website, and it'd be easier for users to have one place to go to do all their work: The Yancy editor.
This ticket is a loose collection of ideas for how to make the Yancy editor into an app that's easy to extend with custom JavaScript / Vue components. These may change slightly as Yancy evolves.
Some work on this has already been completed:
yancy.editor.includehelper.yancy.editor.menuhelper. These menus get routed to Vue components added viayancy.editor.include.This work is a blocker for a v3.0 release, but not the v2.0 release.
Single-Page App with Vue Router
It will improve modularity if the Yancy editor is a single-page application that uses Yancy APIs and the Vue router to move between views.
The edit form / new item form should be its own destination, not a drawer that slides out from a table.
Data Caching with VueX
Different parts of the application are going to need to share data between themselves and the backend. The editor should use VueX to provide an API to get/set/create/delete items in the backend. The VueX state is the source of truth for all the components in the editor application.
Editor global
The editor Vue application should be available from the global
Yancyvariable. This allows for us to add an API to interact with the editor from custom JavaScript.Smaller, atomic field components
Rather than having one "edit field" component, the editor should have a set of components for each type of data (input type, not JSON Schema type). There should be a method on the editor global (
Yancy) that allows a user to register their own Vue component to handle a given type of input (if this can be done with Vue's "components" feature, more's the better).Schema customizations
See #61. The new menus/buttons should allow routing to specific Vue components.
Documentation / Examples
There should be documentation on how to add custom panels to the editor, including multi-step workflows.