nickschot / ember-mobile-menu

A draggable sidebar menu for Ember
https://nickschot.github.io/ember-mobile-menu
MIT License
34 stars 9 forks source link

Menu returns after toggling off #111

Open knownasilya opened 3 years ago

knownasilya commented 3 years ago

mm

On opening the modal I toggle the right menu. The above happens when I cancel the modal. Looks like two menus render and they are both open. This only seems to happen when using (fn mmw.actions.toggle 'right')

Code

<MobileMenuWrapper @embed={{true}} as |mmw|>
  <mmw.MobileMenu @type='right'>
    <button
      type='button'
      role='menuitem'
      {{on
        'click'
        (pipe (fn this.send 'RENAME') (fn mmw.actions.toggle 'right'))
      }}
    >
      Update Title
    </button>
  </mmw.MobileMenu>

  <mmw.Content class='bg-gray-100 flex flex-col flex-1'>
    {{yield}}
    <mmw.Toggle @target='right'>
      <Button
        class='flex items-center py-2 px-4 group'
        id='post-menu'
        aria-label='Post Settings'
        aria-haspopup='true'
        @appearance='outlined'
      >
        <Icon
          @icon='ellipsis-v'
          class='text-gray-700 group-hover:text-white'
        />
      </Button>
    </mmw.Toggle>

    other content here
  </mmw.Content>
</MobileMenuWrapper>

<Modal
  @isOpen={{this.isRenameModalOpen}}
  @onClose={{fn this.send 'CANCEL'}} as |m|
>
 ....
</Modal>
nickschot commented 3 years ago

Sounds like this might be a bug related to this code: https://github.com/nickschot/ember-mobile-menu/blob/83a142c91d588c38a2a9f25768df703dbf8ae7c8/addon/components/mobile-menu-wrapper.js#L212-L217

Could you try & modify those lines into:

    if (targetMenu) {
      let activeIsTarget = this.activeMenu === targetMenu;
      this.close();
      if (!activeIsTarget) {
        this.open(targetMenu);
      }
    }

and see if that fixes it?