Open Tanish2002 opened 5 months ago
We already have dark & light syntax highlighting themes for API Dash which is used in codegens here -https://github.com/foss42/apidash/blob/f3a7865459e3f0b2b44b9012026fe71159d8897d/lib/consts.dart#L160
@animator I missed it 😅, I've pushed a fix to address this:
New screenshots:
You need to go through the relevant issue #22 which talks about the deliverables and the past work & the issues in the WIP PR that was merged.
@animator As per the issue, I believe syntax highlight is taken care of through this PR.
I should be able to add formatting relatively easily(using kEncoder.convert
), and validation should also be possible.
However, I would need some help with the UI.
I added a "format JSON" elevated button. It looks like this:
Do you think this is fine? or I should do something else.
And, where do I keep the validation error? I'm thinking of simply adding a check to the OnChanged hook that will check if JSON is valid or not. If not then it would show an error. But not sure where to place this widget in the UI
Also, do I create a new file inside utils folder (json_utils.dart
) for these json functions for validation, and formatting or just add methods to the JsonTextFieldEditor
class?
@animator This is what I've come up with. Haven't added any new packages, simply using the json function from dart:convert
for formatting as well as validation issues.
https://github.com/foss42/apidash/assets/55488165/ce121489-1035-497b-9a8f-859d6dff44cb
@animator pushed the new changes, made it look pretty as much as I could 😅. You can check the following video for a example. https://github.com/foss42/apidash/assets/55488165/22ebac0d-eb0c-4ab6-bf4f-b674f1fc43ab
The original text editor is perfectly fine. Why was it modified? Only JSON editor requires modification.
The original text editor is perfectly fine. Why was it modified? Only JSON editor requires modification.
Yeah,
CodeField
widget) offers flexibility. Subclasses for various editors(json, graphql, protobuf, etc) can then add features like formatting and validation as needed.@animator If you believe this isn't what we should do, then I can go ahead and revert the changes for that.
PR Description
This PR Introduces syntax highlighting for JSON type request body. We had a comment referencing the incomplete
JsonTextFieldEditor
implementation. Instead of hacking together our own, I've used a third-party package code_field.This package provides syntax highlighting as well as inserts tab characters at appropriate positions. We can also use this same package in the future for other request bodies such as Graphql, protobuf, etc. Once we support them.
I've also changed the default
TextFieldEditor
widget using theplaintext
theme, as the name suggests, it doesn't provide any syntax highlighting but does provide simple tab character insertion wherever needed.Here is a list of currently supported languages and themes that are supported: languages, themes
Lastly Here are some screenshots:
![image](https://github.com/foss42/apidash/assets/55488165/625722ea-1a41-4b29-ab1d-fea0b619e375)
I've decided to use
monokaiSublimeTheme
for dark mode anddefaultTheme
for light mode since they look the most natural for our colorscheme.If unsatisfied with the current choice please tell me any other theme from the list above, The developer has also created a nice site to figure out a theme: Here
Checklist
main
branch before making this PRflutter test
) and all tests are passingAdded/updated tests?