InseeFrLab / InseeFrLab/onyxia

Offer a more compact presentation of the service launch configuration form

Open
#932 5 comments 2 reactions 0 assignees View on GitHub
low priority
Dominant language
TypeScript
Stars
872
Forks
109
Avg merge
6d 3h
Merged PRs (30d)
1

Description

As shown in the example below, a couple of small things slightly hinder the user experience when configuring a service before launch:
1) The `title` and `description` fields from the values schema files are meant for documentation and not user interface definition. As such, they are often defined in a more verbose or redundant way than is preferable in our context.
2) The configuration structure is naturally inherited from the `values.yaml` which is sometimes a bit too deeply hierarchical whereas forms are usually more linear. The `Custom` box, below, for example, doesn’t add much value to the interface.
3) The vertical margins: it's nice to have a well-spaced interface, but with the various top banners, it forces a lot of scrolling and prevents getting a quick overall view of the form.

![Image](https://github.com/user-attachments/assets/20c53fb2-e228-40e3-a9e6-8cef6bb7f2a5)

My suggestions (up for discussion):
1) The `title` and `description` fields may be defined in Onyxia catalogs to better fit the needs of a user interface. However the resulting `values.schema.json` file would then be hard to read or reuse in a different setting. Instead it could be useful to provide alternatives for these (rightfully) descriptive fields. For instance:
```json
{
"title": "A precise field title",
"description": "An exhaustive description",
"x-onyxia": {
"title": "Short title",
"description": "Extra info in subtitle or empty string to hide"
}
}
```
2) Move the longer description into a tooltip (a small icon that would display the text either on click or hover in a mini-popup) rather than a smaller font subtitle. Short description could be kept inline, as they are now. The display mode could also be controlled in `values.schema.json`:
```json
"x-onyxia": {
"descriptionStyle": "tooltip/inline"
}
```
3) Allow some hierarchical boxes to be hidden, with their content "overflowing" into the containing box. Again, this should probably also be controlled:
```json
{
"x-onyxia": {
"showBox": false
},
"render": "none or dissolved"
}
```
4) Reduce vertical margins.

Below a suggestion of a target interface that, in my opinion, would be more usable while remaining precise enough for new users.

![Image](https://github.com/user-attachments/assets/f3eb03ff-c440-4004-b483-07c17c54e125)

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.