How to do multiple values properly in decorate widget javascript?

Support
1

I feel silly even asking this, but I’ve tried every variation I know of and my javascript is not strong… Anyhow, I’m trying to add multiple menu items to the hamburger menu via the api.decorateWidget function.

I’ve tried this:

 <script type="text/discourse-plugin" version="0.4">
      api.decorateWidget('hamburger-menu:generalLinks', () => {
        return [{ href: 'https://yinyanghouse.com/', rawLabel: 'Our Blog' }, { href: 'https://store.yinyanghouse.com', rawLabel: 'Our Store'}];
      });
    </script>

But that doesn’t show up – doing it like this does work:

<script type="text/discourse-plugin" version="0.4">
  api.decorateWidget('hamburger-menu:generalLinks', () => {
    return { href: 'https://yinyanghouse.com/', rawLabel: 'Our Blog' };
  });
  api.decorateWidget('hamburger-menu:generalLinks', () => {
    return { href: 'https://store.yinyanghouse.com/', rawLabel: 'Our Store' };
  });
  
</script>

But it seems like there should be a way to put those into an array and return that?

2

You’re right, this is actually somewhat confusing. I’ve fixed it in this commit:

https://github.com/discourse/discourse/commit/bc2c6b0918c10467d40aa690919917d9090c7b84

So if you are running the latest version of Discourse you can now use an array. If not, your solution if calling decorateWidget twice will work.

3

Awesome! Thanks for the quick fix!