studio feat: integrate new ParserJS with Spectral

Description

Integrate new v2 ParserJS with Spectral support

TODO: fix tests

Example:

Related issue(s) Part of https://github.com/asyncapi/parser-js/issues/481

Sep 27 '22 08:09 magicmatatjahu

Deploy Preview for modest-rosalind-098b67 ready!

Name	Link
Latest commit	73e62117140effcf576cb249514dce2123194520
Latest deploy log	https://app.netlify.com/sites/modest-rosalind-098b67/deploys/637b4f65a8de26000807e5bf
Deploy Preview	https://deploy-preview-434--modest-rosalind-098b67.netlify.app/
Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site settings.

Sep 27 '22 08:09 netlify[bot]

Netlify build fails because of https://github.com/asyncapi/parser-js/pull/650

Why our CI didn't fail? 🤔

cc @magicmatatjahu @derberg any idea?

Oct 10 '22 08:10 smoya

@magicmatatjahu can you please bump @asyncapi/parser to 2.0.0-next-major.6 so we fix Netlify build? (I have no permissions to push to your branch unfortunately).

Oct 10 '22 16:10 smoya

@jonaslagoni Thanks for quick review!

Hate the warning system though 😆 As you are entering the realm of governance rules, which highly vary from user to user. I would HATE to see warnings for an arbitrary rule that someone says I should support, for example, Info object must have "contact" object., as it's not a requirement from the AsyncAPI spec, but spectral.

Warnings inform you about some good practices and we should enable them by default - it's not treated as error and studio will render html documentation on the right, it's only a info to user that something is a good practice 😄 Of course description of such a warning should be defined as Info object should have "contact" object. not "must" but it's a "bug" on Spectral side not our. I don't wanna wait for fixing such a thing on Spectral side, because we will make integration next 1-2 months and it's not a big bug at all.

I suggest anything beyond requirements from the spec should be turned off, until (if it's being planned) it's possible to personally select linting rules.

Yeah, custom rules and overrides are in plan, but probably it will be enabled in next year.

And it makes the editor almost unusable with yellow markings all over 😄 Which almost forces you to take action on the warnings.

Yeah, I hate it either 😆 so I added suggestion (if you didn't see that) in slack:

The only problem I have with the current integration is that we underline even warnings/hints in the editor and not just errors (which should be underlined), making the document itself in the editor have too many "colors" and difficult to read, even document may be correct. Should we inform about warnings and hints in the left side of the editor (where the line numbers are) with warning and hint icons? What do you think about this.

So we should underline only errors (by red color) and warning and hints should be displayed in the left panel (where lines number are) as icon - example: https://microsoft.github.io/monaco-editor/playground.html#interacting-with-the-editor-rendering-glyphs-in-the-margin check this red square in editor.

Also, are warnings supposed to be defined as problems? 🤔

We use monaco-editor, this same which VSC uses, so "warnings", "hints" etc are also considering as "problems" - VSC treats every error/waring/hint as problem not "diagnostic" as we do and I don't think so that we can change description of such a warnings.

Oct 28 '22 12:10 magicmatatjahu

Warnings inform you about some good practices and we should enable them by default

I understand that it makes sense to have good practices highlighted, but the matter of the facts is that its only relevant for some users. And it comes down to their use-case and what they would like to see as good practice.

If you develop an internal application and use AsyncAPI to describe it and you are a small team, adding contact info makes no sense.

^just an example, sure in some cases it might be, but for small teams or solos, it does not and does nothing but create friction 🙂

If you really want it, I suggest it be added as part of the settings so it can be turned off at the will of the user.

Of course description of such a warning should be defined as Info object should have "contact" object. not "must" but it's a "bug" on Spectral side not our. I don't wanna wait for fixing such a thing on Spectral side, because we will make integration next 1-2 months and it's not a big bug at all.

That's understandable 🙂

So we should underline only errors (by red color) and warning and hints should be displayed in the left panel (where lines number are) as icon - example: https://microsoft.github.io/monaco-editor/playground.html#interacting-with-the-editor-rendering-glyphs-in-the-margin check this red square in editor.

Hard to say 😆 Cause if you then have to add one for each line where the yellow is currently highlighted, it's also quite a lot still 😄

Oct 28 '22 12:10 jonaslagoni

I understand that it makes sense to have good practices highlighted, but the matter of the facts is that its only relevant for some users. And it comes down to their use-case and what they would like to see as good practice.

If you really want it, I suggest it be added as part of the settings so it can be turned off at the will of the user.

I understand but I don't like such "filtering", because warning contact is indeed unnecessary but for operationId that should define is good imho 😄 I personally would leave it, for me it's no problem, but I can add options to enable/disable these warnings. I will make it, but probably not today 😄

Hard to say 😆 Cause if you then have to add one for each line where the yellow is currently highlighted, it's also quite a lot still 😄

That icon will be only visible in starting line, so if your object is defined in 20 lines you will only see that icon on first line.

Oct 28 '22 12:10 magicmatatjahu

I understand but I don't like such "filtering", because warning contact is indeed unnecessary but for operationId that should define is good imho 😄 I personally would leave it, for me it's no problem, but I can add options to enable/disable these warnings. I will make it, but probably not today 😄

Just a global one for all warnings I think should be enough, for example, disable good practice warnings or something like that.

That icon will be only visible in starting line, so if your object is defined in 20 lines you will only see that icon on first line.

That would probably make sense then 👍

Oct 28 '22 12:10 jonaslagoni

I added vertical lines in the left side of editor (where lines are):

Errors are still visible as markers:

cc @smoya @jonaslagoni what do you think?

Nov 02 '22 12:11 magicmatatjahu

I would never guess I can modify the diagnostic settings. Imho there should be some icon/link that I can click, and it will open up a setting for me, with a focus on the proper tab.

Nov 08 '22 12:11 derberg

@derberg Ok I will do that, thanks for suggestion!

Nov 08 '22 12:11 magicmatatjahu

@derberg Done :) We have gear icon in the diagnostics tab.

Nov 08 '22 14:11 magicmatatjahu

@fmvilas I applied all suggestions. Could you check again? Thanks! @derberg You added suggestion to have button in tab to open the Governance settings. Could you check and let me know if you like it. I'll be very grateful :)

Nov 09 '22 10:11 magicmatatjahu

works like a charm ❤️

Nov 09 '22 14:11 derberg

Kudos, SonarCloud Quality Gate passed!