Enhancement: Editor for data files in the Hugo 'data' folder. #193
Comments
|
Thinking about this one, what if you can define data types via the settings like: If there is data defined like this, the extension would render a new |
|
@zivbk1 been working on a new data dashboard. What do you think?
Settings The settings look as follows: {
"frontMatter.data.files": [
{
"id": "sponsors",
"title": "Sponsors",
"file": "[[workspace]]/data/sponsors.json",
"labelField": "name",
"schema": {
"title": "Sponsors",
"type": "object",
"required": [
"url",
"name",
"avatar"
],
"properties": {
"url": {
"type": "string",
"title": "URL"
},
"name": {
"type": "string",
"title": "Name"
},
"avatar": {
"type": "string",
"title": "Avatar"
}
}
}
},
{
"id": "projects",
"title": "Projects",
"file": "[[workspace]]/themes/eliostruyf-v2/data/projects.json",
"labelField": "title",
"schema": {
"title": "Projects",
"type": "object",
"required": [
"title",
"href"
],
"properties": {
"title": {
"type": "string",
"title": "Title"
},
"href": {
"type": "string",
"title": "Link"
}
}
}
}
]
} |
|
@estruyf can you use wildcards to match all .json files in a particular folder? Matches all of these files in the tables folder...
|
|
@estruyf how would I represent this data structure in |
For now, the data files would have to be defined in the settings. The definition is required to correctly render the form. |
More testing is required and for sure some styling is missing for lists. The schema for your data would looks as follows: {
"id": "test",
"file": "[[workspace]]/data/tests.json",
"labelField": "title",
"title": "Test",
"schema": {
"type": "object",
"properties": {
"name": {
"type": "string"
},
"columns": {
"type": "array",
"items": { "type": "string" }
},
"rows": {
"type": "array",
"items": {
"type": "object",
"properties": {
"cells": {
"type": "array",
"items": { "type": "string" }
}
}
}
}
}
}
} |
Is it possible to define a structure for a data file once, then for each file in the folder indicate that the same structure is used. Repeating the whole structure in the configuration file for every file doesn't seem practical. I'm thinking of a way to say "Everything in this folder has this data structure." |
|
That would mean files and types need to be split up. So you can have data types, to define the schema, and data files to specify the location and defined type ID. |
I like that idea. I could also see something like this working with a new Frontmatter field type that lets you define a set of defined data structures to pick from as a template, and add into an array. This concept would resolve the other issue I have for "blocks" (page_sections) stored in Front matter data. #176 |
|
Support for arrays has been added as well:
This allows you to at least use the configuration from above. I'll see what I can do for the |
|
@zivbk1 data type support has been added. You can specify the schema on file level or on the type level. On file level is easy when you'll use it a single time, when defining it on type level, you can reuse it. "frontMatter.data.files": [
{
"id": "test",
"file": "[[workspace]]/data/tests.json",
"labelField": "name",
"title": "Test",
"type": "genericContent"
}
],
"frontMatter.data.types": [
{
"id": "genericContent",
"schema": {
"type": "object",
"properties": {
"name": {
"type": "string"
},
"columns": {
"type": "array",
"items": { "type": "string" }
},
"rows": {
"type": "array",
"items": {
"type": "object",
"properties": {
"cells": {
"type": "array",
"items": { "type": "string" }
}
}
}
}
}
}
}
]Hope this will make it easier for you. |
|
As discussed, I will add another setting |
|
@estruyf realy nice project. i have tested the datafolder and can confrim it works. Can you give me a hint for a good yaml to json scheme editor from an example yaml file? i am thinking somtehing like a yaml file and to generate a schema from this example file? entries:
- title: sidebar
product: Jekyll Doc Theme
version: 6.0
folders:
- title:
output: pdf
type: frontmatter
folderitems:
- title:
url: /titlepage.html
output: pdf
type: frontmatter
- title:
url: /tocpage.html
output: pdf
type: frontmatter
- title: Overview
...or from a json example file {
"entries": [
{
"title": "sidebar",
"product": "Jekyll Doc Theme",
"version": 6,
"folders": [
{
"title": null,
"output": "pdf",
"type": "frontmatter",
"folderitems": [
{
"title": null,
"url": "/titlepage.html",
"output": "pdf",
"type": "frontmatter"
},
{
"title": null,
"url": "/tocpage.html",
"output": "pdf",
"type": "frontmatter"
}
]
},
{
"title": "Overview",
"output": "web, pdf",
...i have tried to generate a schema for this example file, and did not get it work. entries:
- title: other
folders:
- title: Other Links
folderitems:
- title: Automated links bookmark
url: /bookmark_one.html
- title: Bookmark links
url: /bookmarks.html
- title: Some link bookmark
url: /other.html "frontMatter.data.types": [
...
{
"id": "genericContent1",
"schema": {
"type": "object",
"additionalProperties": false,
"properties": {
"entries": {
"type": "array",
"items": {
"$ref": "#/definitions/Entry"
}
}
},
"required": [
"entries"
]
},
"Entry": {
"type": "object",
"additionalProperties": false,
"properties": {
"title": {
"type": "string"
},
"folders": {
"type": "array",
"items": {
"$ref": "#/definitions/Folder"
}
}
},
"required": [
"folders",
"title"
],
"title": "Entry"
},
"Folder": {
"type": "object",
"additionalProperties": false,
"properties": {
"title": {
"type": "string"
},
"folderitems": {
"type": "array",
"items": {
"$ref": "#/definitions/Folderitem"
}
}
},
"required": [
"folderitems",
"title"
],
"title": "Folder"
},
"Folderitem": {
"type": "object",
"additionalProperties": false,
"properties": {
"title": {
"type": "string"
},
"url": {
"type": "string"
}
},
"required": [
"title",
"url"
],
"title": "Folderitem"
}
}
] |
|
@wemasoe easiest is to use a JSON to YAML converter. I converted the JSON object, to the following schema: {
"type": "object",
"properties": {
"entries": {
"type": "array",
"items": {
"type": "object",
"properties": {
"title": {
"type": "string"
},
"output": {
"type": "string"
},
"type": {
"type": "string"
},
"folderitems": {
"type": "array",
"items": {
"type": "object",
"properties": {
"title": {
"type": "string"
},
"url": {
"type": "string"
},
"output": {
"type": "string"
},
"type": {
"type": "string"
}
}
}
}
}
}
}
},
"additionalProperties": false,
"required": [
"entries"
]
} |
sorry to say the schema did not work. i dont get any data entry in the data tab for this file. Your other.yaml data items
No other.yaml data entries found
Create or modify your other.yaml data
Add new data
Entriessource file: entries:
- title: other
folders:
- title: Other Links
folderitems:
- title: Automated links bookmark
url: /bookmark_one.html
- title: Bookmark links
url: /bookmarks.html
- title: Some link bookmark
url: /other.htmlwhen adding an entry old entries are gone. - entries:
- title: new title
output: output
type: type
folderitems:
- title: folderitem title
url: folder item url
output: folder item outpur
type: folderitem typei just want to reply to your help and give a feedback. |
|
Recreated it with the new sample you gave, and the following schema can create your data structure: {
"id": "data-entries",
"title": "Data Entries",
"file": "[[workspace]]/data/data-entries.yml",
"fileType": "yaml",
"schema": {
"type": "object",
"properties": {
"entries": {
"type": "object",
"properties": {
"title": {
"type": "string"
},
"folders": {
"type": "array",
"items": {
"type": "object",
"properties": {
"title": {
"type": "string"
},
"output": {
"type": "string"
},
"type": {
"type": "string"
},
"folderitems": {
"type": "array",
"items": {
"type": "object",
"properties": {
"title": {
"type": "string"
},
"url": {
"type": "string"
},
"output": {
"type": "string"
},
"type": {
"type": "string"
}
}
}
}
}
}
}
}
}
},
"additionalProperties": false,
"required": [
"entries"
]
}
}
|
|
@estruyf thx a lot :-) |
|
i have set it for a folder and can confirm it works. Although in "frontMatter.data.types": [
{
...
{
"id": "data-entries",
"title": "Data Entries",
"file": "[[workspace]]/data/data-entries.yml",
"fileType": "yaml",
"schema": {
"type": "object",
"properties": {
"entries": {
"type": "object",
"properties": {
"title": {
"type": "string"
},
"folders": {
... "frontMatter.data.folders": [
{
"id": "test1folder",
"path": "[[workspace]]/data/",
"labelField": "name",
"type": "data-entries"
}
], |
I understand, there are PROs and CONs on each schema/approach to use. I also validated Simple Schema, which seems "simple", but complicates objects IMO. That is why I picked JSON schema. |
Documentation for these new settings is on its way (still needs to be written before releasing v6).
In your case, you better define the type via the |
Is your feature request related to a problem? Please describe.
I have a site where there are data files (JSON) used to drive the content in tables.
https://gohugo.io/templates/data-templates/
Describe the solution you'd like
I would like to describe the data model in the files like I do now with content types, and then have a UI to edit the information in the files with a GUI.
Describe alternatives you've considered
I can edit the plain text files by hand, but what's the fun in that? Also, asking my editors to write JSON, YAML, TOML, etc. by hand is a bit much.
Additional context
Here is an example of a UI for the JSON content below.
The text was updated successfully, but these errors were encountered: