# Getting the hook Navigators to work in a cockpit application

**URL:** <https://community.cumulocity.com/t/getting-the-hook-navigators-to-work-in-a-cockpit-application/937>\
**Category:** Forum\
**Tags:** cumulocity\
**Created:** [January 17, 2024, 9:06pm UTC](https://community.cumulocity.com/t/getting-the-hook-navigators-to-work-in-a-cockpit-application/937 "2024-01-17T21:06:32Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![luclib](https://avatars.discourse-cdn.com/v4/letter/l/b5a626/32.png) [@luclib](https://community.cumulocity.com/u/luclib)\
**Post date:** [January 17, 2024, 9:06pm UTC](https://community.cumulocity.com/t/getting-the-hook-navigators-to-work-in-a-cockpit-application/937/1 "2024-01-17T21:06:32Z")

</div>

This is a follow-up to a previous [post](https://community.cumulocity.com/t/login-error-when-developing-cumulocity-cockpit-application/2315) I made regarding setting up a cockpit application.

I am now able to login with my credentials and want to add a hook node to navigate to the application. The [tutorial](https://cumulocity.com/guides/web/tutorials/#3-hooking-a-navigator-node) advises to add the following to the `properties` object in `app.module.ts`:

```auto
{
      provide: HOOK_NAVIGATOR_NODES,
      useValue: [{
        label: 'Hello',  
        path: 'hello',
        icon: 'rocket',
        priority: 1000
      }] as NavigatorNode[], // 1
      multi: true
}

```

When I tried this, however, I received a message via IntelliSense that this hook has been deprecated, so I used a `hookNavigator` instead:

```auto
{
    hookRoute({ // 1
      path: 'hello',
      component: HelloComponent,
    }),
    hookNavigator([
      {
         context: ViewContext.Device,
         path: '/hello',
         component: HelloComponent,
         label: 'hello',
         priority: 100,
         icon: 'rocket'
      }

```

The problem that I am getting now is that the name of the application appears in the navigation bar, but not as part of the list of navigator nodes, meaning that I cannot click on it and it does not display an icon in front of it like the other nodes.

 ![image](https://europe1.discourse-cdn.com/flex005/uploads/cumulocity/original/3X/c/0/c01a19251274dab513343b71b6ce38031fc495d3.png)

---

<div class="post-metadata">

**Author:** ![Christian\_Guether1](https://dub1.discourse-cdn.com/flex005/user_avatar/community.cumulocity.com/christian_guether1/32/14848_2.png) [@Christian\_Guether1](https://community.cumulocity.com/u/Christian_Guether1)\
**Post date:** [January 18, 2024, 6:11am UTC](https://community.cumulocity.com/t/getting-the-hook-navigators-to-work-in-a-cockpit-application/937/2 "2024-01-18T06:11:12Z")

</div>

Hi Lucas,

remove `context` and `component` from the NavigatorNode object. I think the property `context` doesn’t even exist for the NavigatorNode. Because you are setting the component, it uses the `HelloComponent` to render the navigation entry in the menu, instead of the default navigation entry component.

Best regards

  

* * *

Christian Guether

[Software AG Professional Services](https://www.softwareag.com/en_corporate/resources/services/professional-services.html)

[![](https://europe1.discourse-cdn.com/flex005/uploads/cumulocity/original/3X/c/3/c3a93a2618e4708f51be40fe2e142061f7c4edc7.jpeg)](https://www.softwareag.com/en_corporate/resources/services/fast-track-services.html)

---

<div class="post-metadata">

**Author:** ![system](https://dub1.discourse-cdn.com/flex005/user_avatar/community.cumulocity.com/system/32/31990_2.png) [@system](https://community.cumulocity.com/u/system)\
**Post date:** [July 16, 2024, 6:11am UTC](https://community.cumulocity.com/t/getting-the-hook-navigators-to-work-in-a-cockpit-application/937/3 "2024-07-16T06:11:39Z")

</div>

Closed on July 16, 2024, 6:11am UTC

This topic was automatically closed 180 days after the last reply. New replies are no longer allowed.