Context Menu Directive Crashes When Empty Array Of Items Is Used

[ak99372]

Issue type

**I'm submitting a bug

• [x] bug report
• [ ] feature request

Issue description

Current behavior:

When list of items passed to context menu directive is used with button and items = []; (i.e. empty array) it will error out with

Error: List of menu items expected, but given:

This makes the button with this directive non functional unless it always has menu which isn't desirable for reusability.

Expected behavior:

Directive should enhance the original component not eliminate it. If there are no items the menu should just not render/show but the button should remain functional and without errors.

Steps to reproduce:

items = [];
<button outline nbButton [nbContextMenu]="items">

Related code:

This is the code where the error comes from

/*
   * NbMenuComponent will crash if don't pass menu items to it.
   * So, we just validating them and throw custom obvious error.
   * */
  private validateItems(items: NbMenuItem[]) {
    if (!items || !items.length) {
      throw Error(`List of menu items expected, but given: ${items}`)
    }
  }

Other information:

npm, node, OS, Browser

<!--
Node, npm: v16.13.2 and `npm 8.1.2`
OS: Windows 11
Browser: Chrome
-->

Angular, Nebular

Nebular: 9.0.0