# Modules

The **Modules Manager** section is the steering panel allowing you to adjust and customize the Management Dashboard navigation menu. Here, you can find different options to organize the Management Dashboard in a way it triggers full efficiency for your team and add customizations that adhere to your solution and style of working. The modules navigation structure takes effect for all tenant users.

<figure><img src="https://3057647601-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FbTY7EwZtYYQYC6GOcdTj%2Fuploads%2Fgit-blob-f96727940b00c8085a7fd45c84fab05ed5a01ab5%2Fmodules.png?alt=media" alt=""><figcaption><p>Modules Manager section</p></figcaption></figure>

Check out the different tools offered in the **Modules** view to adapt the navigation menu to your needs.

{% embed url="<https://files.gitbook.com/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FYAak0Z7i2XjNSviBuJeI%2Fuploads%2FOLFWQe2C7wbl6Pa9pSCL%2Fnavigation_modules-1.mp4?alt=media&token=32de470c-27e3-45e6-b048-2d0053b4f955>" %}
Modules Manager options
{% endembed %}

## Reorder modules

You can rearrange the modules as required. Reordering is possible either at the same level or across levels when a module doesn't have child modules underneath. Note that one level nesting is supported, so the hierarchy can have two layers only. To move a module, hover over the selected module name and drag and drop the module to the chosen destination.

<figure><img src="https://3057647601-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FbTY7EwZtYYQYC6GOcdTj%2Fuploads%2Fgit-blob-a9228fe5f680e2b1f5abff9d1069747b938a320f%2Fnodes.gif?alt=media" alt="" width="500"><figcaption><p>Reorder module</p></figcaption></figure>

## Add custom modules

You can add existing or custom modules to the selected destination. When you hover over a module, the additional options menu appears. Choose **+** and decide where to add a new module - options depend on the selected level:

<figure><img src="https://3057647601-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FbTY7EwZtYYQYC6GOcdTj%2Fuploads%2Fgit-blob-684a389cd5649fac99b63e3ac9390b8e93abff23%2Fmodules_add_icon.png?alt=media" alt="" width="100"><figcaption><p>Add module</p></figcaption></figure>

<figure><img src="https://3057647601-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FbTY7EwZtYYQYC6GOcdTj%2Fuploads%2Fgit-blob-4bc2a5abf178e65e39480faffbcaa48c002097e8%2Fmodules_add_root.png?alt=media" alt="" width="230"><figcaption><p>Add module root options</p></figcaption></figure>

<figure><img src="https://3057647601-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FbTY7EwZtYYQYC6GOcdTj%2Fuploads%2Fgit-blob-1a4e4874c47748728adc18ce7963d8a51baf39a6%2Fmodules_add_menu.png?alt=media" alt="" width="230"><figcaption><p>Add module child options</p></figcaption></figure>

{% hint style="success" %}
To add a custom-built extension as a new module, choose the **Custom Module** in the **Redirect To** field and provide details reqired to import the extension. See also [redirect nodes](#redirect-nodes).
{% endhint %}

The new node appears in the chosen location and you can modify it as suitable.

If you make a mistake, or no longer need the custom module, it can be permanently deleted.

## Hide module

The unused modules, not necessary for your setup, can be hidden from the view. Hover over the module you want to hide and choose the **Hide** option and the module is no longer displayed in the navigation tree. To uncover the module, use the **Show** option.

<figure><img src="https://3057647601-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FbTY7EwZtYYQYC6GOcdTj%2Fuploads%2Fgit-blob-fd5b012ad559bd1c4766a720bd0f52773d7de708%2Fmodules_hide.png?alt=media" alt="" width="100"><figcaption><p>Hide module</p></figcaption></figure>

## Edit nodes

Hover over an existing or a newly added node for additional options and choose **Edit**.

<figure><img src="https://3057647601-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FbTY7EwZtYYQYC6GOcdTj%2Fuploads%2Fgit-blob-bec1e92cc376f44baa46dd0649b77d4c1b6205d1%2Fmodules_edit.png?alt=media" alt="" width="100"><figcaption><p>Edit module</p></figcaption></figure>

Editing options depend on the location of the module.

|                         Root node                        |            Child node           |
| :------------------------------------------------------: | :-----------------------------: |
|                   Modify displayed name                  |      Modify displayed name      |
|              Modify localized displayed name             | Modify localized displayed name |
| Redirect the module (only for nodes without child nodes) |       Redirect the module       |
|                      Add custom icon                     |                                 |

## Redirect nodes

For greater customization, you can define where the module points to and where content is sourced from. The **Redirect to** allows the following options to point the edited module to:

* existing module - select the existing module from the list
* custom module - provide the external URL and package where your custom module is hosted
* custom instance - point to the created custom type
* extension - point to the created custom extension registered in the Management Dashboard

<figure><img src="https://3057647601-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FbTY7EwZtYYQYC6GOcdTj%2Fuploads%2Fgit-blob-53e98911706f8dfd570eabfa003b57d360f9ed10%2Fmodule_redirect.png?alt=media" alt="" width="400"><figcaption><p>Redirect module</p></figcaption></figure>

This way, you have full flexibility to display custom modules, entities, or extensions in the most convenient destination in the navigation menu.

{% hint style="info" %}
For more information on custom instances, see the [Custom Instances](https://developer.emporix.io/ce/management-dashboard/custom-instances) documentation.
{% endhint %}

{% hint style="warning" %}
When adjusting node redirection, exercise caution to avoid overwriting established modules. A recommended approach is to hide the existing standard module and implement a new module specifically for the redirection.
{% endhint %}

## Custom icon

The root nodes can display custom icons. In the Edit mode, choose the **Upload icon** option. Then, using the **+** or drag and drop option, add the icon file from your device, and **Upload** it to the MD. When the icon is imported, you an select it as the module icon.

<figure><img src="https://3057647601-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FbTY7EwZtYYQYC6GOcdTj%2Fuploads%2Fgit-blob-9e030e8ab6599ef29eda98a70c9353d60aac4f95%2Fmodule_icon1.png?alt=media" alt="" width="400"><figcaption><p>Add module icon</p></figcaption></figure>

<figure><img src="https://3057647601-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FbTY7EwZtYYQYC6GOcdTj%2Fuploads%2Fgit-blob-675d704b12b6a23bf7616f18b184f715bd3b8426%2Fmodule_icon2.png?alt=media" alt="" width="400"><figcaption><p>Attach module icon</p></figcaption></figure>

<figure><img src="https://3057647601-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FbTY7EwZtYYQYC6GOcdTj%2Fuploads%2Fgit-blob-64830264cfa0df39b8723534f2a745fd60796a89%2Fmodule_icon3.png?alt=media" alt="" width="400"><figcaption><p>Upload module icon</p></figcaption></figure>

<figure><img src="https://3057647601-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FbTY7EwZtYYQYC6GOcdTj%2Fuploads%2Fgit-blob-f9078833065e104f089ace292e0721114889c949%2Fmodule_icon4.png?alt=media" alt="" width="400"><figcaption><p>Select module icon</p></figcaption></figure>

## Import/Export

The **Import/Export** option is especially convenient when you have extended navigation menu with large number of nodes. With **Export** you can download a JSON file that defines the navigation structure. You can make the adjustments for the navigation directly in the JSON file. Similarly, you can modify names, change the order, add new nodes, add redirects or custom icons. When ready, upload the edited JSON using the **Import** option.

<figure><img src="https://3057647601-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FbTY7EwZtYYQYC6GOcdTj%2Fuploads%2Fgit-blob-71b796d7537bafc3c29b1aebbb20032320b555be%2Fmodule_import_export.png?alt=media" alt="" width="100"><figcaption><p>Modules import and export</p></figcaption></figure>

Upon import, there's validation mechanism that checks the correctness of the modules structure defined in the JSON, which secures the navigation from errors.

{% hint style="warning" %}
After any changes to the navigation menu you want to apply, remember to **Save** the modifications. The changes take instant effect in the structure for the whole tenant.
{% endhint %}

## Reset to default

Once you have your custom navigation saved but if for any reason you'd like to return to the default navigation structure, use the option **Reset to default** to go back to the original Management Dashboard state. Note this is an irreversible change.

<figure><img src="https://3057647601-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FbTY7EwZtYYQYC6GOcdTj%2Fuploads%2Fgit-blob-f559f60bc343899e38aca5405b17d07899d7cc02%2Fmodules_reset.png?alt=media" alt="" width="230"><figcaption><p>Reset to default state</p></figcaption></figure>
