diff --git a/addon/components/layout/header.hbs b/addon/components/layout/header.hbs
index bc22f8ed..0642102c 100644
--- a/addon/components/layout/header.hbs
+++ b/addon/components/layout/header.hbs
@@ -17,7 +17,7 @@
                     >
                         <div class="w-6">
                             {{#if menuItem.iconComponent}}
-                                {{component menuItem.iconComponent options=menuItem.iconComponentOptions}}
+                                {{component (lazy-engine-component menuItem.iconComponent) options=menuItem.iconComponentOptions}}
                             {{else}}
                                 <FaIcon @icon={{menuItem.icon}} @prefix={{menuItem.iconPrefix}} @size="sm" />
                             {{/if}}
diff --git a/addon/components/layout/header/dropdown/item.hbs b/addon/components/layout/header/dropdown/item.hbs
index 43208dca..a6f0b35c 100644
--- a/addon/components/layout/header/dropdown/item.hbs
+++ b/addon/components/layout/header/dropdown/item.hbs
@@ -19,7 +19,7 @@
                             <div class="{{@item.class}}">
                                 {{#if line.component}}
                                     {{component
-                                        line.component
+                                        (lazy-engine-component line.component)
                                         item=line
                                         text=line.text
                                         label=(or line.label line.text)
@@ -108,5 +108,5 @@
 {{/if}}
 
 {{#if this.isComponent}}
-    {{component @item.component @item}}
+    {{component (lazy-engine-component @item.component) @item}}
 {{/if}}
\ No newline at end of file
diff --git a/addon/components/layout/header/dropdown/item.js b/addon/components/layout/header/dropdown/item.js
index b6990e71..75fa0977 100644
--- a/addon/components/layout/header/dropdown/item.js
+++ b/addon/components/layout/header/dropdown/item.js
@@ -3,6 +3,7 @@ import { inject as service } from '@ember/service';
 import { computed, action } from '@ember/object';
 import { isBlank } from '@ember/utils';
 import { bool } from '@ember/object/computed';
+import { ExtensionComponent } from '@fleetbase/ember-core/contracts';
 import isMenuItemActive from '../../../../utils/is-menu-item-active';
 import isEmptyObject from '../../../../utils/is-empty-object';
 
@@ -20,6 +21,8 @@ export default class LayoutHeaderDropdownItemComponent extends Component {
     }
 
     @computed('args.item.{component,onClick}') get isComponent() {
+        if (this.args.item.component instanceof ExtensionComponent) return true;
+
         return this.args.item && typeof this.args.item.component === 'string' && typeof this.args.item.onClick !== 'function';
     }
 
diff --git a/package.json b/package.json
index 5d9b5a22..bd2236ce 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@fleetbase/ember-ui",
-    "version": "0.3.15",
+    "version": "0.3.16",
     "description": "Fleetbase UI provides all the interface components, helpers, services and utilities for building a Fleetbase extension into the Console.",
     "keywords": [
         "fleetbase-ui",