Menus

The menus displays a list of items(Search views or Edit views), allowing the user to navigate between different views.

How to use

In order to create (or edit) Menus, in the Develop app, click on main menu and select Menus. In the page that opens click the Add button or select and existing one and click the Edit button.

Designer

Fields in the sidebar:

  1. Name - The name of the menu in UI.
  2. Color - The color of the menu and all the views that will get opened in the menu.
  3. Icon - Adding a special icon.
  4. Node key - The node in the URL.
  5. Home app key - ?
  6. Home app hash - ?
  7. Letters - The letter/letters of the menu or the icon id from Font Awesome
  8. Hidden - If the menu is hidden or not.
  9. Font awesome - If Font Awesome is enabled for icons.
  10. Rank - The rank (order) of the menu.
  11. Module - Specify if the menu is contained in a module.
  12. UUID - Is the unique identifier of the row in the table (read-only).

The following diagram describes the entity used by this designer:

erDiagram
    menu_node {
        string name "Name"
        string color "Color"
        string icon "Icon"
        string node_key "Node key"
        string home_app_key "Home app key"
        string home_app_hash "Home app hash"
        string letters "Letters"
        string31 config "Configuration"
        string uuid "UUID"
        integer hidden "Hidden"
        integer font_awesome "Font awesome"
        integer rank "Rank"
        integer id_ui_module FK "Module"
    }
    menu_node many--one ui_module : ui_module_menu_node

Click the Add button to add menu items and the Delete button to remove menu items.

Fields for menu items:

  1. Name - The name of the item displayed in the menu.
  2. Icon - The icon of the item displayed in the menu. ?
  3. Node item key - The edit view for navigating.
  4. Rank - The rank (order) in the menu.

The following diagram describes the entities used by this tab:

erDiagram
    menu_node_item {
      string name "Name"
      string icon "Icon"
      string node_item_key "Node item key"
      string uuid "hidden"
      integer rank "Rank"
    }
    menu_node many--one menu_node_item : menu_node_menu_node_item

CONFIGURATION tab

The configuration tab is a JSON input in which you can enable or disable additional configuration options for the edit view. For more details about the configuration of a menu the Configuring the home view page in the User Interface chapter.

{
  "globalSearch.visible": true,
  "dashboard.workflowName": "HomeView",
  "dashboard.layout": []
  //Since 1.7.2
  "installApp.visible": false,
  "menu.workflowName": null,
}

The properties can be set individually, the properties not set will have their default values as above.

  1. globalSearch.visible
  • Type: Boolean
  • Description: Controls whether the global search feature is visible.
  • Default Value: true
  1. dashboard.workflowName
  • Type: String
  • Description: Specifies the workflow name associated with the dashboard.
  • Default Value: "HomeView"
  1. dashboard.layout
  • Type: Array
  • Description: Defines the layout configuration for the dashboard. This array can be used to specify widgets, sections, or custom components in the dashboard.
  • Default Value: [] (empty array)
  1. installApp.visible
  • Type: Boolean
  • Description: Determines whether the “Install App” option is visible in the edit view. This option allows users to install or manage additional applications.
  • Default Value: false
  1. menu.workflowName
  • Type: String (or null)
  • Description: Specifies the workflow name for the menu configuration. If set to null, no workflow is linked to the menu.
  • Default Value: null

Home View menu example

Configuration:

{
  "menu.workflowName": "HomeView",
}

Workflow:

workflow HomeView;

type menuitem {
  var title as string;
  var url as string;
  var rank as int;
}

function getMenuItems() as list of menuitem {
  var result as list of menuitem;

  var item1 as menuitem;
  item1.title = "Demo Search View";
  item1.url = "#search$demoList";
  item1.rank = 1;

  result[] = item1;

  var item2 as menuitem;
  item2.title = "Demo Edit View";
  item2.url = "#edit$demoEdit";
  item2.rank = 2;

  result[] = item2;

  return result;
}

Home View dashboard

If in the configuration of the menu there is a worflow for the dasboard, using the structure from The Home View you will be able to create charts, display text and actions.

← Event listeners
Rest API security →