Discuss the future of https://sonarwhal.com/docs/user-guide/rules/

[alrra]

Now that the rules are no longer included in sonarwhal, I think https://sonarwhal.com/docs/user-guide/rules/ should be automatically generated, instead of having it in packages/sonarwhal/docs/user-guide/rules/index.md (see also: webhintio/hint#822).

[molant]

Was thinking the same. We probably need to rethink the layout of the page.

[qzhou1607-zz]

Maybe we can use this https://hexo.io/api/generator.html#Archive-Page from Hexo. We will need to keep the category information somewhere, maybe in the frontmatter of each rule doc, or in _config.yml.

[molant]

We can try to get the category from rule.ts

[molant]

Adding @ststimac to the conversation. This is something we need to address sooner rather than later.
We are going to have probably a new category development (or similar) with all the typescript, webpack, etc. rules and there are going to be in @TheLarkInn's words "hundreds of them" 🙄

[ststimac]

Are you talking about updating the individual rule pages or the overview page with all the categories?

We should probably redo the side table of contents if there are going to be "hundreds" of new rules.

[ststimac]

I've got an idea for the layout. I'll do a quick mockup for this on Monday.

[ststimac]

Proposal for the rules landing page:

Show first 5 rules under each category and then any one that has more than that can be expanded to show the rest for a category.

[molant]

Can we have somewhere how many rules for each category we have?
For the navigation on the left, is it going to be blank, have a list with all the rules, list the categories?

I'm not convinced that not listing all the rules directly is the best idea. Maybe we could have a landing for categories and then a landing for each category?

In this page we will have the description of each category, how many rules we have for each one, and link to the category (don't think we need more space than the one you've allocated already), and in the category landing page something similar to what we have right now?

[molant]

And I just saw #403 re the navigation on the left side

[ststimac]

Two other options:

[molant]

I like the titles of the first option (the one with the icon inline with the name of the category) mixed with the second option that has the count of rules and view all in the same line.

[ststimac]

new mockup

[molant]

Ship it!

[ststimac]

I still need to design a landing page for the individual categories.

Are there really going to be hundreds of rules under the new category? I'm trying to design with that in mind.

[molant]

Maybe not hundreds, but there could be quite a few for a given category (a few tens).

[ststimac]

Well depending on how many rules we start accumulating, if the list gets long enough, it should probably overflow into a multi-column layout, but we're probably not there yet. I will set it up though so that if we reach so many lines of rules, it will overflow into the next column.

[molant]

👍

[ststimac]

So from a responsive standpoint, the two column layout works better. At smaller browser widths, the 3 column layout gets messy because the rule category titles are mostly pretty long, and end up being longer than the column and breaking onto a new line. It just doesn't flow well. I will be going with the following layout. Also the icons are missing because none of the images are loading when I run npm run steph

I will also make a note in the PR but the page title should be RULE Categories, not plural like we currently have: Rules Categories.