Hoppscotch: Add GraphQL syntax highlighting

[danilofuchs]

Is your feature request related to a problem? Please describe.

GraphQL view does not have any syntax highlighting on queries

Describe the solution you'd like

Something like GraphiQL or other editors have

Describe alternatives you've considered

Considering Postwoman already uses graphql-language-service-interface, maybe it's possible to extract tokens from there.

[AndrewBastin]

Ace Editor (which powers Postwoman's code editors) doesn't come with a graphql query highlighting mode, hence the query editor just used the json mode to get as much similar editor characteristics down as possible.

I am looking into implementing a editor mode for it myself. I am not really familiar with creating the highlight rules, so it will take a bit of time, along with the problem I can't find enough time to allocate to Postwoman these days, so if anyone wants to pursue this as well, feel free to.

Thanks for opening the issue ^_^

[danilofuchs]

Maybe these help:
https://github.com/ajaxorg/ace/blob/master/lib/ace/mode/graphqlschema.js
https://github.com/ajaxorg/ace/blob/master/lib/ace/mode/graphqlschema_highlight_rules.js

[levrik]

~@AndrewBastin @liyasthomas I just wonder if integrating https://github.com/microsoft/monaco-editor, the editor component that powers VS Code, would be also an idea. Basically replacing ACE everywhere in Postwoman. I think it has by far better support for stuff like GraphQL and in general is probably more modern and flexible. If this sounds interesting to you, I'm also willing to work on a PR and/or do some research on this.~

After reading a bit more details about Monaco it seems like it's probably a bit more complicated and heavy-weighted than I've thought. Probably out-of-scope for Postwoman.

[AndrewBastin]

@levrik Yes, I have indeed thought about Monaco. We could get it implemented, which is fine, but the problem is that Monaco doesn't work on mobile devices. Which I am not really sure about with going through with.