saltgui_preview_grains: Improvement

[erwindon]

Is your feature request related to a problem? Please describe.
Will be really nice to have better visualization of grains that contain list of values (strings), for example:

# salt salt-master grains.get roles
salt-master:
    - salt-master
    - salt-minion

salt-master-custom.conf:
...
saltgui_preview_grains:
  - Roles=roles    
  - Roles2=$.roles.[*]
  - Roles3=$.roles[*]

Describe the solution you'd like
Instead:

[
    "salt-master",
    "salt-minion"
]

will be nice to have a list separated by \n I guess (without brackets and quotes):

salt-master
salt-minion

[erwindon]

@sasha-simplyture
I see a few possible solutions:

1. see whether the jsonpath system allows list of strings to be joined somehow.
   I'll investigate this later and see what is possible; or
2. present all your data not as JSON, but as YAML or NESTED
   by updating the setting described in https://github.com/erwindon/SaltGUI?tab=readme-ov-file#output
   I'll test this later and see whether it is actually an improvement (and working at all); or
3. I can update the grains-preview code to allow operators that simplify the outcome

[sasha-simplyture]

Thank you @erwindon for your quick response, I've set saltgui_output_formats: doc,highstate,yaml and now it looks almost perfect for me (not enough width for words):

salt-master-custom.conf:
...
saltgui_preview_grains:
  - Roles=roles

[erwindon]

In your case, the Roles2+Roles3 columns also take space and to the right there is also the jobs-summary table.
So in tight situations, the outcome is always a bit uncertain.

When you rename your roles so that they have no "-" in their name, this may improve.
Suggestions are to replace it with "_" (underscore); or remove it completely.
But ultimately even the non-breaking-space between the "-" and the item will still line-break when there just is no room.

Alternatively, we can update the first css class in grains.css. Just add "word-break: keep-all;" there. please try that too.

[sasha-simplyture]

Switching from - to _ didn't help, but changing Grains.css worked fine:

saltgui/static/stylesheets/grains.css:
td.grain-value {
  word-break: keep-all;
}

#page-grains {
  width: 100%;
}

Should I create PR for these changes or you will or you think of doing something else? @erwindon

[sonarcloud]

Quality Gate passed

Issues
0 New issues
0 Accepted issues

Measures
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarCloud

[erwindon]

should I create PR for these changes or you will or you think of doing something else?

I just converted this github-issue to a github-pr which is connected to my own branch for this.
when you switch your branch to this one, you should see the same code.
(well almost, because I added a css clause and you replaced the existing one)
I don't want to break anything, so I have a few tests to perform.
that will take a couple of days...

[sasha-simplyture]

But wait, with white-space: pre-wrap; grains look bad:

td.grain-value {
  white-space: pre-wrap;
  word-break: keep-all; 
}

I guess you need to keep only word-break: keep-all; ...

[erwindon]

thx for that info!
I'll have to test the many combinations of:

• the locations that use this CSS; and
• the different variations of the possible data; and
• all 3 representations (nested/json/yaml).