How does Docusaurus determine the order of headings in the sidebar?

Question

In my Docusaurus project, I have created a new sidebar in sidebars.json and added some files and it shows up nicely, except it is not ordering the way I have ordered it in the json file.

My new sidebar is a list of dates and the files associated with those dates. So I thought maybe it was due to the categories being numbers. So I tried renaming them to something with letters like "Current Year", but that didn't work. I also tried rearranging them in the Json file, but that also did not work.

"WhatsNew": {
    "2019": ["Current Month", "January 2019"], 
    "2018": ["December 2018", "November 2018", "October 2018", "September 
             2018", "August 2018", "July 2018", "June 2018", "May 2018", 
             "April 2018", "March 2018", "February 2018", "January 2018"],
    "2017": ["December 2017"]
  }, 

I would expect the side nav to be ordered as I have it in the json file, but instead it is ordered the opposite to how it is ordered in the json file. Instead of starting with 2019, it starts with 2017.

Answer 1

I'm afraid there's no good way to fix this now. This is because keys in JavaScript have no fixed ordering and this is something Docusaurus has to address in v2.

One very ugly hack I can suggest to you is to add a space in front of your keys as such:

"WhatsNew": {
  " 2019": ["Current Month", "January 2019"], 
  " 2018": ["December 2018", "November 2018", "October 2018", "September 
         2018", "August 2018", "July 2018", "June 2018", "May 2018", 
         "April 2018", "March 2018", "February 2018", "January 2018"],
  " 2017": ["December 2017"]
},

and they will appear in the order you defined it. Hopefully the space isn't noticeable.