feat(v2): allow nested sidebar category shorthand syntax

[slorber]

Motivation

The sidebar category shorthand syntax only works for the 1st level (for example Guides).

I think it makes sense to generalize this syntax and allow it for deeply nested categories as well

module.exports = {
  docs: {
    Guides: [
      'creating-pages',
      {
        type: 'category',
        label: 'Docs',
        items: ['markdown-features', 'sidebar', 'versioning'],
      },
    ],
  },
};

can be shortened as

module.exports = {
  docs: {
    Guides: [
      'creating-pages',
      {
        Docs: ['markdown-features', 'sidebar', 'versioning'],
      },
    ],
  },
};

Have you read the Contributing Guidelines on pull requests?

YES

Test Plan

Jest tests written

Related PRs

N/A

[docusaurus-bot]

Deploy preview for docusaurus-2 ready!

Built with commit 75ac6ee

https://deploy-preview-2444--docusaurus-2.netlify.com

[yangshun]

Thanks for this PR @slorber! I really appreciate your efforts especially when this PR is so well-written. Unfortunately using objects for the sidebar is really bad design on v1's part due to the implicit relying of object keys order. The only reason we kept it in v2 is to maintain compatibility with v1. I might even want to kill allowing the object syntax entirely in v2, so we don't want to further encourage such syntax.

Any thoughts?

[slorber]

Hi and thanks for the review.

I don't know if this should be added or not, so I let you decide.

To me the syntax looks convenient and safe, as long as it's documented that the object keys should be declared in correct order.

Afaik the order of keys is predictable in Node (didn't check Deno) and seems specified in ES6.
Didn't double check, but found this: https://www.stefanjudis.com/today-i-learned/property-order-is-predictable-in-javascript-objects-since-es2015/
It's worth checking but I guess all recent Node/Deno engines are likely to implement this ordering, unlike some older browsers.

[yangshun]

Much thanks!

[slorber]

will try to find a better text for this, as it seems specified in ES6