mohitkumartoshniwal / jsonlens

Visualize JSON using interactive Graphs
https://www.jsonlens.com/
MIT License
59 stars 11 forks source link

Add format button the editor #2

Open rafaeltab opened 5 months ago

rafaeltab commented 5 months ago

Since you're using the monaco editor, you can already do json auto formatting using Shift + Alt + F, add a button for the people that don't know the shortcut, and show a tooltip with the shortcut when you hover over it.

editor.getAction("editor.action.formatDocument").run();
mohitkumartoshniwal commented 5 months ago

Thanks for the suggestion and implementation details. I will add it if this issue gets some more upvotes. I am personally not sure whether to have a button just for formatting along with tooltip.

rafaeltab commented 5 months ago

I noticed that it wasn't there within the first minute of usage. I wanted to write some json in the editor, but the formatting was weird. I looked for the button, and realized that it was the monaco editor so I could probably just use the default shortcut. I think any json editor should really have a format button, and many popular platforms seem to agree. Firebase for example has a format button.

An alternative would be a button to create a popover with some shortcuts that can be used in the editor such as F1 for opening the command pallette, or Shift + Alt + F for formatting. It could contain controls for the graph view also.

mohitkumartoshniwal commented 5 months ago

Yeah, the popover also looks interesting. I will think some more on having just a button for formatting or introducing a popover since I was planning to add shortcuts some time later for the whole application anyways. I will keep this issue open in the meantime. Thanks for the suggestion. It's quite helpful.