I think it would be useful to have some discussion about the prettier functionality on runpkg. Some points to start with:
- Button press feedback
- Undo option
- Basic config options
1: button press feedback and state
Currently it can be hard to tell that any formatting has taken place. Although this function (prettier.format) isn't async, I think some state handling (including start & finish state) in the UI would be helpful. In my mind, possible states to alert the user to are:
- start format
- finish/successful format
- finished format with no change (
prettier.format(fileData.code, opts) === fileData.code)
- error
- format reverted (see point number 2)
These states could be signified with text, icons and/or toast messages. Preferences? I would lean towards (accessibly) icons possibly enhanced with toast messages.
2: undo format
I think it would be useful to be able to revert the code formatting without having to refresh the page. I'm happy to implement it in a PR. Any objections? Any opinions on how to represent this has successfully run in the context of point number 1 (above)?
3: basic config
This is a trickier and more subjective feature IMO: one one hand, prettier is supposed to be opinionated, but - on the other - it does provide certain config options (quotes, semi...) for a reason. Do we want to allow users to select basic config options? E.g. currently we use the default options which include singleQuote: false which means that something like lodash-es/add only changes on format due to single -> double quotes rather than any major formatting issues.
I think it would be useful to have some discussion about the prettier functionality on runpkg. Some points to start with:
1: button press feedback and state
Currently it can be hard to tell that any formatting has taken place. Although this function (
prettier.format) isn't async, I think some state handling (including start & finish state) in the UI would be helpful. In my mind, possible states to alert the user to are:prettier.format(fileData.code, opts) === fileData.code)These states could be signified with text, icons and/or toast messages. Preferences? I would lean towards (accessibly) icons possibly enhanced with toast messages.
2: undo format
I think it would be useful to be able to revert the code formatting without having to refresh the page. I'm happy to implement it in a PR. Any objections? Any opinions on how to represent this has successfully run in the context of point number 1 (above)?
3: basic config
This is a trickier and more subjective feature IMO: one one hand, prettier is supposed to be opinionated, but - on the other - it does provide certain config options (quotes, semi...) for a reason. Do we want to allow users to select basic config options? E.g. currently we use the default options which include
singleQuote: falsewhich means that something likelodash-es/addonly changes on format due to single -> double quotes rather than any major formatting issues.