diff --git a/packages/core/src/features/__snapshots__/extension-special-characters-in-page-registrations.test.tsx.snap b/packages/core/src/features/__snapshots__/extension-special-characters-in-page-registrations.test.tsx.snap
index da55b0687e..f6a4f60fee 100644
--- a/packages/core/src/features/__snapshots__/extension-special-characters-in-page-registrations.test.tsx.snap
+++ b/packages/core/src/features/__snapshots__/extension-special-characters-in-page-registrations.test.tsx.snap
@@ -185,7 +185,23 @@ exports[`extension special characters in page registrations renders 1`] = `
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="1"
-        />
+        >
+          <div
+            style="z-index: 11; position: absolute;"
+          >
+            <div
+              class="HotbarIcon contextMenuAvailable"
+            >
+              <div
+                class="Avatar rounded disabled avatar"
+                id="hotbarIcon-hotbar-icon-catalog-entity"
+                style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+              >
+                Ca
+              </div>
+            </div>
+          </div>
+        </div>
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="2"
@@ -389,7 +405,23 @@ exports[`extension special characters in page registrations when navigating to r
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="1"
-        />
+        >
+          <div
+            style="z-index: 11; position: absolute;"
+          >
+            <div
+              class="HotbarIcon contextMenuAvailable"
+            >
+              <div
+                class="Avatar rounded disabled avatar"
+                id="hotbarIcon-hotbar-icon-catalog-entity"
+                style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+              >
+                Ca
+              </div>
+            </div>
+          </div>
+        </div>
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="2"
diff --git a/packages/core/src/features/__snapshots__/navigate-to-extension-page.test.tsx.snap b/packages/core/src/features/__snapshots__/navigate-to-extension-page.test.tsx.snap
index fce6472938..be7e6a7662 100644
--- a/packages/core/src/features/__snapshots__/navigate-to-extension-page.test.tsx.snap
+++ b/packages/core/src/features/__snapshots__/navigate-to-extension-page.test.tsx.snap
@@ -185,7 +185,23 @@ exports[`navigate to extension page renders 1`] = `
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="1"
-        />
+        >
+          <div
+            style="z-index: 11; position: absolute;"
+          >
+            <div
+              class="HotbarIcon contextMenuAvailable"
+            >
+              <div
+                class="Avatar rounded disabled avatar"
+                id="hotbarIcon-hotbar-icon-catalog-entity"
+                style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+              >
+                Ca
+              </div>
+            </div>
+          </div>
+        </div>
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="2"
@@ -389,7 +405,23 @@ exports[`navigate to extension page when extension navigates to child route rend
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="1"
-        />
+        >
+          <div
+            style="z-index: 11; position: absolute;"
+          >
+            <div
+              class="HotbarIcon contextMenuAvailable"
+            >
+              <div
+                class="Avatar rounded disabled avatar"
+                id="hotbarIcon-hotbar-icon-catalog-entity"
+                style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+              >
+                Ca
+              </div>
+            </div>
+          </div>
+        </div>
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="2"
@@ -609,7 +641,23 @@ exports[`navigate to extension page when extension navigates to route with param
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="1"
-        />
+        >
+          <div
+            style="z-index: 11; position: absolute;"
+          >
+            <div
+              class="HotbarIcon contextMenuAvailable"
+            >
+              <div
+                class="Avatar rounded disabled avatar"
+                id="hotbarIcon-hotbar-icon-catalog-entity"
+                style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+              >
+                Ca
+              </div>
+            </div>
+          </div>
+        </div>
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="2"
@@ -829,7 +877,23 @@ exports[`navigate to extension page when extension navigates to route without pa
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="1"
-        />
+        >
+          <div
+            style="z-index: 11; position: absolute;"
+          >
+            <div
+              class="HotbarIcon contextMenuAvailable"
+            >
+              <div
+                class="Avatar rounded disabled avatar"
+                id="hotbarIcon-hotbar-icon-catalog-entity"
+                style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+              >
+                Ca
+              </div>
+            </div>
+          </div>
+        </div>
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="2"
@@ -1049,7 +1113,23 @@ exports[`navigate to extension page when extension navigates to route without pa
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="1"
-        />
+        >
+          <div
+            style="z-index: 11; position: absolute;"
+          >
+            <div
+              class="HotbarIcon contextMenuAvailable"
+            >
+              <div
+                class="Avatar rounded disabled avatar"
+                id="hotbarIcon-hotbar-icon-catalog-entity"
+                style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+              >
+                Ca
+              </div>
+            </div>
+          </div>
+        </div>
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="2"
diff --git a/packages/core/src/features/__snapshots__/navigating-between-routes.test.tsx.snap b/packages/core/src/features/__snapshots__/navigating-between-routes.test.tsx.snap
index cc2d55bd54..306624bb30 100644
--- a/packages/core/src/features/__snapshots__/navigating-between-routes.test.tsx.snap
+++ b/packages/core/src/features/__snapshots__/navigating-between-routes.test.tsx.snap
@@ -108,7 +108,23 @@ exports[`navigating between routes given route with optional path parameters whe
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="1"
-        />
+        >
+          <div
+            style="z-index: 11; position: absolute;"
+          >
+            <div
+              class="HotbarIcon contextMenuAvailable"
+            >
+              <div
+                class="Avatar rounded disabled avatar"
+                id="hotbarIcon-hotbar-icon-catalog-entity"
+                style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+              >
+                Ca
+              </div>
+            </div>
+          </div>
+        </div>
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="2"
@@ -312,7 +328,23 @@ exports[`navigating between routes given route without path parameters when navi
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="1"
-        />
+        >
+          <div
+            style="z-index: 11; position: absolute;"
+          >
+            <div
+              class="HotbarIcon contextMenuAvailable"
+            >
+              <div
+                class="Avatar rounded disabled avatar"
+                id="hotbarIcon-hotbar-icon-catalog-entity"
+                style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+              >
+                Ca
+              </div>
+            </div>
+          </div>
+        </div>
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="2"
diff --git a/packages/core/src/features/add-cluster/__snapshots__/navigation-using-application-menu.test.tsx.snap b/packages/core/src/features/add-cluster/__snapshots__/navigation-using-application-menu.test.tsx.snap
index 45afcd5478..9e5ba75555 100644
--- a/packages/core/src/features/add-cluster/__snapshots__/navigation-using-application-menu.test.tsx.snap
+++ b/packages/core/src/features/add-cluster/__snapshots__/navigation-using-application-menu.test.tsx.snap
@@ -185,7 +185,23 @@ exports[`add-cluster - navigation using application menu renders 1`] = `
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="1"
-        />
+        >
+          <div
+            style="z-index: 11; position: absolute;"
+          >
+            <div
+              class="HotbarIcon contextMenuAvailable"
+            >
+              <div
+                class="Avatar rounded disabled avatar"
+                id="hotbarIcon-hotbar-icon-catalog-entity"
+                style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+              >
+                Ca
+              </div>
+            </div>
+          </div>
+        </div>
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="2"
@@ -473,7 +489,23 @@ exports[`add-cluster - navigation using application menu when navigating to add
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="1"
-        />
+        >
+          <div
+            style="z-index: 11; position: absolute;"
+          >
+            <div
+              class="HotbarIcon contextMenuAvailable"
+            >
+              <div
+                class="Avatar rounded disabled avatar"
+                id="hotbarIcon-hotbar-icon-catalog-entity"
+                style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+              >
+                Ca
+              </div>
+            </div>
+          </div>
+        </div>
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="2"
diff --git a/packages/core/src/features/application-update/__snapshots__/hiding-preference-when-disabled.test.ts.snap b/packages/core/src/features/application-update/__snapshots__/hiding-preference-when-disabled.test.ts.snap
index 275f5f4701..8f2aec7b7a 100644
--- a/packages/core/src/features/application-update/__snapshots__/hiding-preference-when-disabled.test.ts.snap
+++ b/packages/core/src/features/application-update/__snapshots__/hiding-preference-when-disabled.test.ts.snap
@@ -563,7 +563,23 @@ exports[`hiding Update Channel preference with updating is not enabled renders 1
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -1315,7 +1331,23 @@ exports[`showing Update Channel preference with updating is enabled renders 1`]
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
diff --git a/packages/core/src/features/application-update/__snapshots__/installing-update.test.ts.snap b/packages/core/src/features/application-update/__snapshots__/installing-update.test.ts.snap
index 846ed4236e..a7504a29f5 100644
--- a/packages/core/src/features/application-update/__snapshots__/installing-update.test.ts.snap
+++ b/packages/core/src/features/application-update/__snapshots__/installing-update.test.ts.snap
@@ -186,7 +186,23 @@ exports[`installing update when started renders 1`] = `
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -472,7 +488,23 @@ exports[`installing update when started when user checks for updates renders 1`]
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -758,7 +790,23 @@ exports[`installing update when started when user checks for updates when new up
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -1044,7 +1092,23 @@ exports[`installing update when started when user checks for updates when new up
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -1330,7 +1394,23 @@ exports[`installing update when started when user checks for updates when new up
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -1641,7 +1721,23 @@ exports[`installing update when started when user checks for updates when new up
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -1952,7 +2048,23 @@ exports[`installing update when started when user checks for updates when new up
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -2263,7 +2375,23 @@ exports[`installing update when started when user checks for updates when new up
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -2549,7 +2677,23 @@ exports[`installing update when started when user checks for updates when no new
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
diff --git a/packages/core/src/features/application-update/child-features/application-update-using-application-menu/__snapshots__/application-update-using-application-menu.test.ts.snap b/packages/core/src/features/application-update/child-features/application-update-using-application-menu/__snapshots__/application-update-using-application-menu.test.ts.snap
index 6cecc32578..2a52ec5506 100644
--- a/packages/core/src/features/application-update/child-features/application-update-using-application-menu/__snapshots__/application-update-using-application-menu.test.ts.snap
+++ b/packages/core/src/features/application-update/child-features/application-update-using-application-menu/__snapshots__/application-update-using-application-menu.test.ts.snap
@@ -186,7 +186,23 @@ exports[`installing update using application menu when started renders 1`] = `
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
diff --git a/packages/core/src/features/application-update/child-features/application-update-using-top-bar/__snapshots__/installing-update-using-topbar-button.test.tsx.snap b/packages/core/src/features/application-update/child-features/application-update-using-top-bar/__snapshots__/installing-update-using-topbar-button.test.tsx.snap
index ed561c11f6..2e1ec8dd21 100644
--- a/packages/core/src/features/application-update/child-features/application-update-using-top-bar/__snapshots__/installing-update-using-topbar-button.test.tsx.snap
+++ b/packages/core/src/features/application-update/child-features/application-update-using-top-bar/__snapshots__/installing-update-using-topbar-button.test.tsx.snap
@@ -211,7 +211,23 @@ exports[`encourage user to update when sufficient time passed since update was d
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -497,7 +513,23 @@ exports[`encourage user to update when sufficient time passed since update was d
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
diff --git a/packages/core/src/features/application-update/child-features/application-update-using-tray/__snapshots__/installing-update-using-tray.test.ts.snap b/packages/core/src/features/application-update/child-features/application-update-using-tray/__snapshots__/installing-update-using-tray.test.ts.snap
index d0091c4932..c72cbe8416 100644
--- a/packages/core/src/features/application-update/child-features/application-update-using-tray/__snapshots__/installing-update-using-tray.test.ts.snap
+++ b/packages/core/src/features/application-update/child-features/application-update-using-tray/__snapshots__/installing-update-using-tray.test.ts.snap
@@ -186,7 +186,23 @@ exports[`installing update using tray when started renders 1`] = `
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -472,7 +488,23 @@ exports[`installing update using tray when started when user checks for updates
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -758,7 +790,23 @@ exports[`installing update using tray when started when user checks for updates
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -1044,7 +1092,23 @@ exports[`installing update using tray when started when user checks for updates
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -1355,7 +1419,23 @@ exports[`installing update using tray when started when user checks for updates
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -1641,7 +1721,23 @@ exports[`installing update using tray when started when user checks for updates
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
diff --git a/packages/core/src/features/application-update/child-features/force-update/__snapshots__/force-update.test.ts.snap b/packages/core/src/features/application-update/child-features/force-update/__snapshots__/force-update.test.ts.snap
index 93a1bb75c6..08238f88fa 100644
--- a/packages/core/src/features/application-update/child-features/force-update/__snapshots__/force-update.test.ts.snap
+++ b/packages/core/src/features/application-update/child-features/force-update/__snapshots__/force-update.test.ts.snap
@@ -211,7 +211,23 @@ exports[`force user to update when too long since update was downloaded when app
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -522,7 +538,23 @@ exports[`force user to update when too long since update was downloaded when app
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -880,7 +912,23 @@ exports[`force user to update when too long since update was downloaded when app
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
diff --git a/packages/core/src/features/application-update/child-features/periodical-checking-of-updates/__snapshots__/periodical-checking-of-updates.test.ts.snap b/packages/core/src/features/application-update/child-features/periodical-checking-of-updates/__snapshots__/periodical-checking-of-updates.test.ts.snap
index 1f9ab1dfca..755f91ee52 100644
--- a/packages/core/src/features/application-update/child-features/periodical-checking-of-updates/__snapshots__/periodical-checking-of-updates.test.ts.snap
+++ b/packages/core/src/features/application-update/child-features/periodical-checking-of-updates/__snapshots__/periodical-checking-of-updates.test.ts.snap
@@ -186,7 +186,23 @@ exports[`periodical checking of updates given updater is enabled and configurati
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
diff --git a/packages/core/src/features/application-update/child-features/selection-of-update-stability/__snapshots__/selection-of-update-stability.test.ts.snap b/packages/core/src/features/application-update/child-features/selection-of-update-stability/__snapshots__/selection-of-update-stability.test.ts.snap
index 471f3da180..543b26aa14 100644
--- a/packages/core/src/features/application-update/child-features/selection-of-update-stability/__snapshots__/selection-of-update-stability.test.ts.snap
+++ b/packages/core/src/features/application-update/child-features/selection-of-update-stability/__snapshots__/selection-of-update-stability.test.ts.snap
@@ -186,7 +186,23 @@ exports[`selection of update stability when started renders 1`] = `
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
diff --git a/packages/core/src/features/catalog/__snapshots__/custom-columns.test.tsx.snap b/packages/core/src/features/catalog/__snapshots__/custom-columns.test.tsx.snap
index 8d9184c850..a0bc1651f0 100644
--- a/packages/core/src/features/catalog/__snapshots__/custom-columns.test.tsx.snap
+++ b/packages/core/src/features/catalog/__snapshots__/custom-columns.test.tsx.snap
@@ -469,7 +469,23 @@ exports[`custom category columns for catalog renders 1`] = `
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -1069,7 +1085,23 @@ exports[`custom category columns for catalog when category is added using defaul
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -1659,7 +1691,23 @@ exports[`custom category columns for catalog when category is added using defaul
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -2238,7 +2286,23 @@ exports[`custom category columns for catalog when category is added using defaul
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -2838,7 +2902,23 @@ exports[`custom category columns for catalog when category is added with custom
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -3375,7 +3455,23 @@ exports[`custom category columns for catalog when category is added with custom
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -3975,7 +4071,23 @@ exports[`custom category columns for catalog when category is added without defa
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -4501,7 +4613,23 @@ exports[`custom category columns for catalog when category is added without defa
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
diff --git a/packages/core/src/features/catalog/__snapshots__/entity-running.test.tsx.snap b/packages/core/src/features/catalog/__snapshots__/entity-running.test.tsx.snap
index 9223143735..38a9575515 100644
--- a/packages/core/src/features/catalog/__snapshots__/entity-running.test.tsx.snap
+++ b/packages/core/src/features/catalog/__snapshots__/entity-running.test.tsx.snap
@@ -584,7 +584,23 @@ exports[`entity running technical tests when navigated to catalog renders 1`] =
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -1268,7 +1284,23 @@ exports[`entity running technical tests when navigated to catalog when details p
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
diff --git a/packages/core/src/features/catalog/__snapshots__/opening-entity-details.test.tsx.snap b/packages/core/src/features/catalog/__snapshots__/opening-entity-details.test.tsx.snap
index a75da667ca..e0e33dc3a8 100644
--- a/packages/core/src/features/catalog/__snapshots__/opening-entity-details.test.tsx.snap
+++ b/packages/core/src/features/catalog/__snapshots__/opening-entity-details.test.tsx.snap
@@ -186,7 +186,23 @@ exports[`opening catalog entity details panel renders 1`] = `
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -980,7 +996,23 @@ exports[`opening catalog entity details panel when navigated to the catalog rend
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -1774,7 +1806,23 @@ exports[`opening catalog entity details panel when navigated to the catalog when
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -2600,7 +2648,23 @@ exports[`opening catalog entity details panel when navigated to the catalog when
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -3426,7 +3490,23 @@ exports[`opening catalog entity details panel when navigated to the catalog when
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -4503,7 +4583,23 @@ exports[`opening catalog entity details panel when navigated to the catalog when
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -5317,7 +5413,23 @@ exports[`opening catalog entity details panel when navigated to the catalog when
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -6131,7 +6243,23 @@ exports[`opening catalog entity details panel when navigated to the catalog when
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -6608,7 +6736,23 @@ exports[`opening catalog entity details panel when not navigated to the catalog
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
diff --git a/packages/core/src/features/cluster/delete-dialog/__snapshots__/delete-cluster-dialog.test.tsx.snap b/packages/core/src/features/cluster/delete-dialog/__snapshots__/delete-cluster-dialog.test.tsx.snap
index 84189a1b03..04c5d1a4b2 100644
--- a/packages/core/src/features/cluster/delete-dialog/__snapshots__/delete-cluster-dialog.test.tsx.snap
+++ b/packages/core/src/features/cluster/delete-dialog/__snapshots__/delete-cluster-dialog.test.tsx.snap
@@ -469,7 +469,23 @@ exports[`Deleting a cluster when an internal kubeconfig cluster is used when the
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -1094,7 +1110,23 @@ exports[`Deleting a cluster when the kubeconfig has multiple clusters when the d
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -1752,7 +1784,23 @@ exports[`Deleting a cluster when the kubeconfig has multiple clusters when the d
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -2489,7 +2537,23 @@ exports[`Deleting a cluster when the kubeconfig has multiple clusters when the d
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -3226,7 +3290,23 @@ exports[`Deleting a cluster when the kubeconfig has only one cluster when the di
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
diff --git a/packages/core/src/features/command-pallet/__snapshots__/keyboard-shortcuts.test.tsx.snap b/packages/core/src/features/command-pallet/__snapshots__/keyboard-shortcuts.test.tsx.snap
index c2ac109a2b..cd397ba0dd 100644
--- a/packages/core/src/features/command-pallet/__snapshots__/keyboard-shortcuts.test.tsx.snap
+++ b/packages/core/src/features/command-pallet/__snapshots__/keyboard-shortcuts.test.tsx.snap
@@ -277,7 +277,23 @@ exports[`Command Pallet: keyboard shortcut tests when on linux renders 1`] = `
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -654,7 +670,23 @@ exports[`Command Pallet: keyboard shortcut tests when on linux when pressing ESC
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -1031,7 +1063,23 @@ exports[`Command Pallet: keyboard shortcut tests when on linux when pressing SHI
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -1420,7 +1468,23 @@ exports[`Command Pallet: keyboard shortcut tests when on linux when pressing SHI
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -1706,7 +1770,23 @@ exports[`Command Pallet: keyboard shortcut tests when on macOS renders 1`] = `
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -1992,7 +2072,23 @@ exports[`Command Pallet: keyboard shortcut tests when on macOS when pressing ESC
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -2278,7 +2374,23 @@ exports[`Command Pallet: keyboard shortcut tests when on macOS when pressing SHI
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -2576,7 +2688,23 @@ exports[`Command Pallet: keyboard shortcut tests when on macOS when pressing SHI
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
diff --git a/packages/core/src/features/entity-settings/__snapshots__/showing-settings-for-correct-entity.test.tsx.snap b/packages/core/src/features/entity-settings/__snapshots__/showing-settings-for-correct-entity.test.tsx.snap
index 1b8d2c8061..c4383a2468 100644
--- a/packages/core/src/features/entity-settings/__snapshots__/showing-settings-for-correct-entity.test.tsx.snap
+++ b/packages/core/src/features/entity-settings/__snapshots__/showing-settings-for-correct-entity.test.tsx.snap
@@ -186,7 +186,23 @@ exports[`Showing correct entity settings renders 1`] = `
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -548,7 +564,23 @@ exports[`Showing correct entity settings when navigating to local cluster entity
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -931,7 +963,23 @@ exports[`Showing correct entity settings when navigating to non-local cluster en
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -1216,7 +1264,23 @@ exports[`Showing correct entity settings when navigating to weblink entity setti
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
diff --git a/packages/core/src/features/extensions/__snapshots__/navigation-using-application-menu.test.ts.snap b/packages/core/src/features/extensions/__snapshots__/navigation-using-application-menu.test.ts.snap
index b0da707eee..c14b837cd1 100644
--- a/packages/core/src/features/extensions/__snapshots__/navigation-using-application-menu.test.ts.snap
+++ b/packages/core/src/features/extensions/__snapshots__/navigation-using-application-menu.test.ts.snap
@@ -185,7 +185,23 @@ exports[`extensions - navigation using application menu renders 1`] = `
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="1"
-        />
+        >
+          <div
+            style="z-index: 11; position: absolute;"
+          >
+            <div
+              class="HotbarIcon contextMenuAvailable"
+            >
+              <div
+                class="Avatar rounded disabled avatar"
+                id="hotbarIcon-hotbar-icon-catalog-entity"
+                style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+              >
+                Ca
+              </div>
+            </div>
+          </div>
+        </div>
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="2"
@@ -498,7 +514,23 @@ exports[`extensions - navigation using application menu when navigating to exten
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="1"
-        />
+        >
+          <div
+            style="z-index: 11; position: absolute;"
+          >
+            <div
+              class="HotbarIcon contextMenuAvailable"
+            >
+              <div
+                class="Avatar rounded disabled avatar"
+                id="hotbarIcon-hotbar-icon-catalog-entity"
+                style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+              >
+                Ca
+              </div>
+            </div>
+          </div>
+        </div>
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="2"
diff --git a/packages/core/src/features/helm-charts/__snapshots__/add-custom-helm-repository-in-preferences.test.ts.snap b/packages/core/src/features/helm-charts/__snapshots__/add-custom-helm-repository-in-preferences.test.ts.snap
index 4f8c3fe01d..6ed69ed67f 100644
--- a/packages/core/src/features/helm-charts/__snapshots__/add-custom-helm-repository-in-preferences.test.ts.snap
+++ b/packages/core/src/features/helm-charts/__snapshots__/add-custom-helm-repository-in-preferences.test.ts.snap
@@ -603,7 +603,23 @@ exports[`add custom helm repository in preferences when navigating to preference
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -1345,7 +1361,23 @@ exports[`add custom helm repository in preferences when navigating to preference
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -2087,7 +2119,23 @@ exports[`add custom helm repository in preferences when navigating to preference
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -2940,7 +2988,23 @@ exports[`add custom helm repository in preferences when navigating to preference
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -3690,7 +3754,23 @@ exports[`add custom helm repository in preferences when navigating to preference
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -4543,7 +4623,23 @@ exports[`add custom helm repository in preferences when navigating to preference
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -5578,7 +5674,23 @@ exports[`add custom helm repository in preferences when navigating to preference
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -6431,7 +6543,23 @@ exports[`add custom helm repository in preferences when navigating to preference
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -7466,7 +7594,23 @@ exports[`add custom helm repository in preferences when navigating to preference
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -8320,7 +8464,23 @@ exports[`add custom helm repository in preferences when navigating to preference
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -9059,7 +9219,23 @@ exports[`add custom helm repository in preferences when navigating to preference
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -9798,7 +9974,23 @@ exports[`add custom helm repository in preferences when navigating to preference
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
diff --git a/packages/core/src/features/helm-charts/__snapshots__/add-helm-repository-from-list-in-preferences.test.ts.snap b/packages/core/src/features/helm-charts/__snapshots__/add-helm-repository-from-list-in-preferences.test.ts.snap
index 99c5ef0448..1250b9c369 100644
--- a/packages/core/src/features/helm-charts/__snapshots__/add-helm-repository-from-list-in-preferences.test.ts.snap
+++ b/packages/core/src/features/helm-charts/__snapshots__/add-helm-repository-from-list-in-preferences.test.ts.snap
@@ -603,7 +603,23 @@ exports[`add helm repository from list in preferences when navigating to prefere
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -1345,7 +1361,23 @@ exports[`add helm repository from list in preferences when navigating to prefere
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -2089,7 +2121,23 @@ exports[`add helm repository from list in preferences when navigating to prefere
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -2882,7 +2930,23 @@ exports[`add helm repository from list in preferences when navigating to prefere
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -3624,7 +3688,23 @@ exports[`add helm repository from list in preferences when navigating to prefere
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -4355,7 +4435,23 @@ exports[`add helm repository from list in preferences when navigating to prefere
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -5131,7 +5227,23 @@ exports[`add helm repository from list in preferences when navigating to prefere
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -5909,7 +6021,23 @@ exports[`add helm repository from list in preferences when navigating to prefere
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -6746,7 +6874,23 @@ exports[`add helm repository from list in preferences when navigating to prefere
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -7477,7 +7621,23 @@ exports[`add helm repository from list in preferences when navigating to prefere
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
diff --git a/packages/core/src/features/helm-charts/__snapshots__/listing-active-helm-repositories-in-preferences.test.ts.snap b/packages/core/src/features/helm-charts/__snapshots__/listing-active-helm-repositories-in-preferences.test.ts.snap
index d5dadffb8b..88143e818e 100644
--- a/packages/core/src/features/helm-charts/__snapshots__/listing-active-helm-repositories-in-preferences.test.ts.snap
+++ b/packages/core/src/features/helm-charts/__snapshots__/listing-active-helm-repositories-in-preferences.test.ts.snap
@@ -603,7 +603,23 @@ exports[`listing active helm repositories in preferences when navigating to pref
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -1334,7 +1350,23 @@ exports[`listing active helm repositories in preferences when navigating to pref
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -1957,7 +1989,23 @@ exports[`listing active helm repositories in preferences when navigating to pref
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -2688,7 +2736,23 @@ exports[`listing active helm repositories in preferences when navigating to pref
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -3311,7 +3375,23 @@ exports[`listing active helm repositories in preferences when navigating to pref
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -4042,7 +4122,23 @@ exports[`listing active helm repositories in preferences when navigating to pref
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -4818,7 +4914,23 @@ exports[`listing active helm repositories in preferences when navigating to pref
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -5441,7 +5553,23 @@ exports[`listing active helm repositories in preferences when navigating to pref
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -6064,7 +6192,23 @@ exports[`listing active helm repositories in preferences when navigating to pref
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -6687,7 +6831,23 @@ exports[`listing active helm repositories in preferences when navigating to pref
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
diff --git a/packages/core/src/features/helm-charts/__snapshots__/remove-helm-repository-from-list-of-active-repository-in-preferences.test.ts.snap b/packages/core/src/features/helm-charts/__snapshots__/remove-helm-repository-from-list-of-active-repository-in-preferences.test.ts.snap
index 540753053c..d6704e0de3 100644
--- a/packages/core/src/features/helm-charts/__snapshots__/remove-helm-repository-from-list-of-active-repository-in-preferences.test.ts.snap
+++ b/packages/core/src/features/helm-charts/__snapshots__/remove-helm-repository-from-list-of-active-repository-in-preferences.test.ts.snap
@@ -603,7 +603,23 @@ exports[`remove helm repository from list of active repositories in preferences
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -1317,7 +1333,23 @@ exports[`remove helm repository from list of active repositories in preferences
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -2031,7 +2063,23 @@ exports[`remove helm repository from list of active repositories in preferences
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -2762,7 +2810,23 @@ exports[`remove helm repository from list of active repositories in preferences
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
diff --git a/packages/core/src/features/preferences/__snapshots__/closing-preferences.test.tsx.snap b/packages/core/src/features/preferences/__snapshots__/closing-preferences.test.tsx.snap
index 6927b65fb1..36d8787bb7 100644
--- a/packages/core/src/features/preferences/__snapshots__/closing-preferences.test.tsx.snap
+++ b/packages/core/src/features/preferences/__snapshots__/closing-preferences.test.tsx.snap
@@ -574,7 +574,23 @@ exports[`preferences - closing-preferences given accessing preferences directly
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="1"
-        />
+        >
+          <div
+            style="z-index: 11; position: absolute;"
+          >
+            <div
+              class="HotbarIcon contextMenuAvailable"
+            >
+              <div
+                class="Avatar rounded disabled avatar"
+                id="hotbarIcon-hotbar-icon-catalog-entity"
+                style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+              >
+                Ca
+              </div>
+            </div>
+          </div>
+        </div>
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="2"
@@ -922,7 +938,23 @@ exports[`preferences - closing-preferences given accessing preferences directly
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="1"
-        />
+        >
+          <div
+            style="z-index: 11; position: absolute;"
+          >
+            <div
+              class="HotbarIcon contextMenuAvailable"
+            >
+              <div
+                class="Avatar rounded disabled avatar"
+                id="hotbarIcon-hotbar-icon-catalog-entity"
+                style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+              >
+                Ca
+              </div>
+            </div>
+          </div>
+        </div>
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="2"
@@ -1128,7 +1160,23 @@ exports[`preferences - closing-preferences given accessing preferences directly
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="1"
-        />
+        >
+          <div
+            style="z-index: 11; position: absolute;"
+          >
+            <div
+              class="HotbarIcon contextMenuAvailable"
+            >
+              <div
+                class="Avatar rounded disabled avatar"
+                id="hotbarIcon-hotbar-icon-catalog-entity"
+                style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+              >
+                Ca
+              </div>
+            </div>
+          </div>
+        </div>
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="2"
@@ -1334,7 +1382,23 @@ exports[`preferences - closing-preferences given accessing preferences directly
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="1"
-        />
+        >
+          <div
+            style="z-index: 11; position: absolute;"
+          >
+            <div
+              class="HotbarIcon contextMenuAvailable"
+            >
+              <div
+                class="Avatar rounded disabled avatar"
+                id="hotbarIcon-hotbar-icon-catalog-entity"
+                style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+              >
+                Ca
+              </div>
+            </div>
+          </div>
+        </div>
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="2"
@@ -2007,7 +2071,23 @@ exports[`preferences - closing-preferences given already in a page and then navi
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="1"
-        />
+        >
+          <div
+            style="z-index: 11; position: absolute;"
+          >
+            <div
+              class="HotbarIcon contextMenuAvailable"
+            >
+              <div
+                class="Avatar rounded disabled avatar"
+                id="hotbarIcon-hotbar-icon-catalog-entity"
+                style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+              >
+                Ca
+              </div>
+            </div>
+          </div>
+        </div>
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="2"
@@ -2355,7 +2435,23 @@ exports[`preferences - closing-preferences given already in a page and then navi
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="1"
-        />
+        >
+          <div
+            style="z-index: 11; position: absolute;"
+          >
+            <div
+              class="HotbarIcon contextMenuAvailable"
+            >
+              <div
+                class="Avatar rounded disabled avatar"
+                id="hotbarIcon-hotbar-icon-catalog-entity"
+                style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+              >
+                Ca
+              </div>
+            </div>
+          </div>
+        </div>
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="2"
@@ -2561,7 +2657,23 @@ exports[`preferences - closing-preferences given already in a page and then navi
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="1"
-        />
+        >
+          <div
+            style="z-index: 11; position: absolute;"
+          >
+            <div
+              class="HotbarIcon contextMenuAvailable"
+            >
+              <div
+                class="Avatar rounded disabled avatar"
+                id="hotbarIcon-hotbar-icon-catalog-entity"
+                style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+              >
+                Ca
+              </div>
+            </div>
+          </div>
+        </div>
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="2"
@@ -2767,7 +2879,23 @@ exports[`preferences - closing-preferences given already in a page and then navi
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="1"
-        />
+        >
+          <div
+            style="z-index: 11; position: absolute;"
+          >
+            <div
+              class="HotbarIcon contextMenuAvailable"
+            >
+              <div
+                class="Avatar rounded disabled avatar"
+                id="hotbarIcon-hotbar-icon-catalog-entity"
+                style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+              >
+                Ca
+              </div>
+            </div>
+          </div>
+        </div>
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="2"
diff --git a/packages/core/src/features/preferences/__snapshots__/extension-adding-preference-tabs.test.tsx.snap b/packages/core/src/features/preferences/__snapshots__/extension-adding-preference-tabs.test.tsx.snap
index 5bbd68d7b7..b5ffd54024 100644
--- a/packages/core/src/features/preferences/__snapshots__/extension-adding-preference-tabs.test.tsx.snap
+++ b/packages/core/src/features/preferences/__snapshots__/extension-adding-preference-tabs.test.tsx.snap
@@ -587,7 +587,23 @@ exports[`preferences: extension adding preference tabs given in preferences, whe
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
diff --git a/packages/core/src/features/preferences/__snapshots__/hiding-of-empty-branches.test.tsx.snap b/packages/core/src/features/preferences/__snapshots__/hiding-of-empty-branches.test.tsx.snap
index 1f5be1c839..6ec3676525 100644
--- a/packages/core/src/features/preferences/__snapshots__/hiding-of-empty-branches.test.tsx.snap
+++ b/packages/core/src/features/preferences/__snapshots__/hiding-of-empty-branches.test.tsx.snap
@@ -562,7 +562,23 @@ exports[`preferences - hiding-of-empty-branches, given in preferences page given
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="1"
-        />
+        >
+          <div
+            style="z-index: 11; position: absolute;"
+          >
+            <div
+              class="HotbarIcon contextMenuAvailable"
+            >
+              <div
+                class="Avatar rounded disabled avatar"
+                id="hotbarIcon-hotbar-icon-catalog-entity"
+                style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+              >
+                Ca
+              </div>
+            </div>
+          </div>
+        </div>
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="2"
@@ -1251,7 +1267,23 @@ exports[`preferences - hiding-of-empty-branches, given in preferences page given
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="1"
-        />
+        >
+          <div
+            style="z-index: 11; position: absolute;"
+          >
+            <div
+              class="HotbarIcon contextMenuAvailable"
+            >
+              <div
+                class="Avatar rounded disabled avatar"
+                id="hotbarIcon-hotbar-icon-catalog-entity"
+                style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+              >
+                Ca
+              </div>
+            </div>
+          </div>
+        </div>
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="2"
@@ -1952,7 +1984,23 @@ exports[`preferences - hiding-of-empty-branches, given in preferences page given
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="1"
-        />
+        >
+          <div
+            style="z-index: 11; position: absolute;"
+          >
+            <div
+              class="HotbarIcon contextMenuAvailable"
+            >
+              <div
+                class="Avatar rounded disabled avatar"
+                id="hotbarIcon-hotbar-icon-catalog-entity"
+                style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+              >
+                Ca
+              </div>
+            </div>
+          </div>
+        </div>
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="2"
diff --git a/packages/core/src/features/preferences/__snapshots__/navigation-to-application-preferences.test.tsx.snap b/packages/core/src/features/preferences/__snapshots__/navigation-to-application-preferences.test.tsx.snap
index 747d18efc9..8b08e83289 100644
--- a/packages/core/src/features/preferences/__snapshots__/navigation-to-application-preferences.test.tsx.snap
+++ b/packages/core/src/features/preferences/__snapshots__/navigation-to-application-preferences.test.tsx.snap
@@ -562,7 +562,23 @@ exports[`preferences - navigation to application preferences given in preference
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="1"
-        />
+        >
+          <div
+            style="z-index: 11; position: absolute;"
+          >
+            <div
+              class="HotbarIcon contextMenuAvailable"
+            >
+              <div
+                class="Avatar rounded disabled avatar"
+                id="hotbarIcon-hotbar-icon-catalog-entity"
+                style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+              >
+                Ca
+              </div>
+            </div>
+          </div>
+        </div>
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="2"
@@ -1254,7 +1270,23 @@ exports[`preferences - navigation to application preferences given in preference
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="1"
-        />
+        >
+          <div
+            style="z-index: 11; position: absolute;"
+          >
+            <div
+              class="HotbarIcon contextMenuAvailable"
+            >
+              <div
+                class="Avatar rounded disabled avatar"
+                id="hotbarIcon-hotbar-icon-catalog-entity"
+                style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+              >
+                Ca
+              </div>
+            </div>
+          </div>
+        </div>
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="2"
@@ -1660,7 +1692,23 @@ exports[`preferences - navigation to application preferences given in some child
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="1"
-        />
+        >
+          <div
+            style="z-index: 11; position: absolute;"
+          >
+            <div
+              class="HotbarIcon contextMenuAvailable"
+            >
+              <div
+                class="Avatar rounded disabled avatar"
+                id="hotbarIcon-hotbar-icon-catalog-entity"
+                style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+              >
+                Ca
+              </div>
+            </div>
+          </div>
+        </div>
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="2"
@@ -2321,7 +2369,23 @@ exports[`preferences - navigation to application preferences given in some child
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="1"
-        />
+        >
+          <div
+            style="z-index: 11; position: absolute;"
+          >
+            <div
+              class="HotbarIcon contextMenuAvailable"
+            >
+              <div
+                class="Avatar rounded disabled avatar"
+                id="hotbarIcon-hotbar-icon-catalog-entity"
+                style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+              >
+                Ca
+              </div>
+            </div>
+          </div>
+        </div>
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="2"
@@ -2983,7 +3047,23 @@ exports[`preferences - navigation to application preferences given in some child
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
diff --git a/packages/core/src/features/preferences/__snapshots__/navigation-to-editor-preferences.test.ts.snap b/packages/core/src/features/preferences/__snapshots__/navigation-to-editor-preferences.test.ts.snap
index c6f56050c8..5d88c1ad78 100644
--- a/packages/core/src/features/preferences/__snapshots__/navigation-to-editor-preferences.test.ts.snap
+++ b/packages/core/src/features/preferences/__snapshots__/navigation-to-editor-preferences.test.ts.snap
@@ -562,7 +562,23 @@ exports[`preferences - navigation to editor preferences given in preferences, wh
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="1"
-        />
+        >
+          <div
+            style="z-index: 11; position: absolute;"
+          >
+            <div
+              class="HotbarIcon contextMenuAvailable"
+            >
+              <div
+                class="Avatar rounded disabled avatar"
+                id="hotbarIcon-hotbar-icon-catalog-entity"
+                style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+              >
+                Ca
+              </div>
+            </div>
+          </div>
+        </div>
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="2"
@@ -1201,7 +1217,23 @@ exports[`preferences - navigation to editor preferences given in preferences, wh
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="1"
-        />
+        >
+          <div
+            style="z-index: 11; position: absolute;"
+          >
+            <div
+              class="HotbarIcon contextMenuAvailable"
+            >
+              <div
+                class="Avatar rounded disabled avatar"
+                id="hotbarIcon-hotbar-icon-catalog-entity"
+                style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+              >
+                Ca
+              </div>
+            </div>
+          </div>
+        </div>
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="2"
diff --git a/packages/core/src/features/preferences/__snapshots__/navigation-to-extension-specific-preferences.test.tsx.snap b/packages/core/src/features/preferences/__snapshots__/navigation-to-extension-specific-preferences.test.tsx.snap
index f178f5e0c7..269494743d 100644
--- a/packages/core/src/features/preferences/__snapshots__/navigation-to-extension-specific-preferences.test.tsx.snap
+++ b/packages/core/src/features/preferences/__snapshots__/navigation-to-extension-specific-preferences.test.tsx.snap
@@ -575,7 +575,23 @@ exports[`preferences - navigation to extension specific preferences given in pre
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -955,7 +971,23 @@ exports[`preferences - navigation to extension specific preferences given in pre
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="1"
-        />
+        >
+          <div
+            style="z-index: 11; position: absolute;"
+          >
+            <div
+              class="HotbarIcon contextMenuAvailable"
+            >
+              <div
+                class="Avatar rounded disabled avatar"
+                id="hotbarIcon-hotbar-icon-catalog-entity"
+                style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+              >
+                Ca
+              </div>
+            </div>
+          </div>
+        </div>
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="2"
@@ -1346,7 +1378,23 @@ exports[`preferences - navigation to extension specific preferences given in pre
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="1"
-        />
+        >
+          <div
+            style="z-index: 11; position: absolute;"
+          >
+            <div
+              class="HotbarIcon contextMenuAvailable"
+            >
+              <div
+                class="Avatar rounded disabled avatar"
+                id="hotbarIcon-hotbar-icon-catalog-entity"
+                style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+              >
+                Ca
+              </div>
+            </div>
+          </div>
+        </div>
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="2"
@@ -1737,7 +1785,23 @@ exports[`preferences - navigation to extension specific preferences given in pre
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="1"
-        />
+        >
+          <div
+            style="z-index: 11; position: absolute;"
+          >
+            <div
+              class="HotbarIcon contextMenuAvailable"
+            >
+              <div
+                class="Avatar rounded disabled avatar"
+                id="hotbarIcon-hotbar-icon-catalog-entity"
+                style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+              >
+                Ca
+              </div>
+            </div>
+          </div>
+        </div>
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="2"
@@ -2154,7 +2218,23 @@ exports[`preferences - navigation to extension specific preferences given in pre
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="1"
-        />
+        >
+          <div
+            style="z-index: 11; position: absolute;"
+          >
+            <div
+              class="HotbarIcon contextMenuAvailable"
+            >
+              <div
+                class="Avatar rounded disabled avatar"
+                id="hotbarIcon-hotbar-icon-catalog-entity"
+                style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+              >
+                Ca
+              </div>
+            </div>
+          </div>
+        </div>
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="2"
@@ -2815,7 +2895,23 @@ exports[`preferences - navigation to extension specific preferences given in pre
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="1"
-        />
+        >
+          <div
+            style="z-index: 11; position: absolute;"
+          >
+            <div
+              class="HotbarIcon contextMenuAvailable"
+            >
+              <div
+                class="Avatar rounded disabled avatar"
+                id="hotbarIcon-hotbar-icon-catalog-entity"
+                style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+              >
+                Ca
+              </div>
+            </div>
+          </div>
+        </div>
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="2"
@@ -3514,7 +3610,23 @@ exports[`preferences - navigation to extension specific preferences given in pre
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="1"
-        />
+        >
+          <div
+            style="z-index: 11; position: absolute;"
+          >
+            <div
+              class="HotbarIcon contextMenuAvailable"
+            >
+              <div
+                class="Avatar rounded disabled avatar"
+                id="hotbarIcon-hotbar-icon-catalog-entity"
+                style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+              >
+                Ca
+              </div>
+            </div>
+          </div>
+        </div>
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="2"
@@ -3919,7 +4031,23 @@ exports[`preferences - navigation to extension specific preferences given in pre
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="1"
-        />
+        >
+          <div
+            style="z-index: 11; position: absolute;"
+          >
+            <div
+              class="HotbarIcon contextMenuAvailable"
+            >
+              <div
+                class="Avatar rounded disabled avatar"
+                id="hotbarIcon-hotbar-icon-catalog-entity"
+                style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+              >
+                Ca
+              </div>
+            </div>
+          </div>
+        </div>
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="2"
@@ -4255,7 +4383,23 @@ exports[`preferences - navigation to extension specific preferences given in pre
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
diff --git a/packages/core/src/features/preferences/__snapshots__/navigation-to-kubernetes-preferences.test.ts.snap b/packages/core/src/features/preferences/__snapshots__/navigation-to-kubernetes-preferences.test.ts.snap
index ff3892be52..6611e63e25 100644
--- a/packages/core/src/features/preferences/__snapshots__/navigation-to-kubernetes-preferences.test.ts.snap
+++ b/packages/core/src/features/preferences/__snapshots__/navigation-to-kubernetes-preferences.test.ts.snap
@@ -562,7 +562,23 @@ exports[`preferences - navigation to kubernetes preferences given in preferences
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="1"
-        />
+        >
+          <div
+            style="z-index: 11; position: absolute;"
+          >
+            <div
+              class="HotbarIcon contextMenuAvailable"
+            >
+              <div
+                class="Avatar rounded disabled avatar"
+                id="hotbarIcon-hotbar-icon-catalog-entity"
+                style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+              >
+                Ca
+              </div>
+            </div>
+          </div>
+        </div>
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="2"
@@ -1239,7 +1255,23 @@ exports[`preferences - navigation to kubernetes preferences given in preferences
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="1"
-        />
+        >
+          <div
+            style="z-index: 11; position: absolute;"
+          >
+            <div
+              class="HotbarIcon contextMenuAvailable"
+            >
+              <div
+                class="Avatar rounded disabled avatar"
+                id="hotbarIcon-hotbar-icon-catalog-entity"
+                style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+              >
+                Ca
+              </div>
+            </div>
+          </div>
+        </div>
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="2"
diff --git a/packages/core/src/features/preferences/__snapshots__/navigation-to-proxy-preferences.test.ts.snap b/packages/core/src/features/preferences/__snapshots__/navigation-to-proxy-preferences.test.ts.snap
index 8e5d3714ac..45614bcae1 100644
--- a/packages/core/src/features/preferences/__snapshots__/navigation-to-proxy-preferences.test.ts.snap
+++ b/packages/core/src/features/preferences/__snapshots__/navigation-to-proxy-preferences.test.ts.snap
@@ -562,7 +562,23 @@ exports[`preferences - navigation to proxy preferences given in preferences, whe
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="1"
-        />
+        >
+          <div
+            style="z-index: 11; position: absolute;"
+          >
+            <div
+              class="HotbarIcon contextMenuAvailable"
+            >
+              <div
+                class="Avatar rounded disabled avatar"
+                id="hotbarIcon-hotbar-icon-catalog-entity"
+                style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+              >
+                Ca
+              </div>
+            </div>
+          </div>
+        </div>
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="2"
@@ -968,7 +984,23 @@ exports[`preferences - navigation to proxy preferences given in preferences, whe
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="1"
-        />
+        >
+          <div
+            style="z-index: 11; position: absolute;"
+          >
+            <div
+              class="HotbarIcon contextMenuAvailable"
+            >
+              <div
+                class="Avatar rounded disabled avatar"
+                id="hotbarIcon-hotbar-icon-catalog-entity"
+                style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+              >
+                Ca
+              </div>
+            </div>
+          </div>
+        </div>
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="2"
diff --git a/packages/core/src/features/preferences/__snapshots__/navigation-to-telemetry-preferences.test.tsx.snap b/packages/core/src/features/preferences/__snapshots__/navigation-to-telemetry-preferences.test.tsx.snap
index fd6e177c93..82ed0bab1e 100644
--- a/packages/core/src/features/preferences/__snapshots__/navigation-to-telemetry-preferences.test.tsx.snap
+++ b/packages/core/src/features/preferences/__snapshots__/navigation-to-telemetry-preferences.test.tsx.snap
@@ -291,7 +291,23 @@ exports[`preferences - navigation to telemetry preferences given URL for Sentry
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="1"
-        />
+        >
+          <div
+            style="z-index: 11; position: absolute;"
+          >
+            <div
+              class="HotbarIcon contextMenuAvailable"
+            >
+              <div
+                class="Avatar rounded disabled avatar"
+                id="hotbarIcon-hotbar-icon-catalog-entity"
+                style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+              >
+                Ca
+              </div>
+            </div>
+          </div>
+        </div>
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="2"
@@ -952,7 +968,23 @@ exports[`preferences - navigation to telemetry preferences given in preferences,
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="1"
-        />
+        >
+          <div
+            style="z-index: 11; position: absolute;"
+          >
+            <div
+              class="HotbarIcon contextMenuAvailable"
+            >
+              <div
+                class="Avatar rounded disabled avatar"
+                id="hotbarIcon-hotbar-icon-catalog-entity"
+                style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+              >
+                Ca
+              </div>
+            </div>
+          </div>
+        </div>
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="2"
@@ -1625,7 +1657,23 @@ exports[`preferences - navigation to telemetry preferences given in preferences,
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="1"
-        />
+        >
+          <div
+            style="z-index: 11; position: absolute;"
+          >
+            <div
+              class="HotbarIcon contextMenuAvailable"
+            >
+              <div
+                class="Avatar rounded disabled avatar"
+                id="hotbarIcon-hotbar-icon-catalog-entity"
+                style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+              >
+                Ca
+              </div>
+            </div>
+          </div>
+        </div>
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="2"
@@ -2004,7 +2052,23 @@ exports[`preferences - navigation to telemetry preferences given in preferences,
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="1"
-        />
+        >
+          <div
+            style="z-index: 11; position: absolute;"
+          >
+            <div
+              class="HotbarIcon contextMenuAvailable"
+            >
+              <div
+                class="Avatar rounded disabled avatar"
+                id="hotbarIcon-hotbar-icon-catalog-entity"
+                style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+              >
+                Ca
+              </div>
+            </div>
+          </div>
+        </div>
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="2"
@@ -2343,7 +2407,23 @@ exports[`preferences - navigation to telemetry preferences given no URL for Sent
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="1"
-        />
+        >
+          <div
+            style="z-index: 11; position: absolute;"
+          >
+            <div
+              class="HotbarIcon contextMenuAvailable"
+            >
+              <div
+                class="Avatar rounded disabled avatar"
+                id="hotbarIcon-hotbar-icon-catalog-entity"
+                style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+              >
+                Ca
+              </div>
+            </div>
+          </div>
+        </div>
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="2"
diff --git a/packages/core/src/features/preferences/__snapshots__/navigation-to-terminal-preferences.test.ts.snap b/packages/core/src/features/preferences/__snapshots__/navigation-to-terminal-preferences.test.ts.snap
index da432142b2..260f1a3844 100644
--- a/packages/core/src/features/preferences/__snapshots__/navigation-to-terminal-preferences.test.ts.snap
+++ b/packages/core/src/features/preferences/__snapshots__/navigation-to-terminal-preferences.test.ts.snap
@@ -562,7 +562,23 @@ exports[`preferences - navigation to terminal preferences given in preferences,
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="1"
-        />
+        >
+          <div
+            style="z-index: 11; position: absolute;"
+          >
+            <div
+              class="HotbarIcon contextMenuAvailable"
+            >
+              <div
+                class="Avatar rounded disabled avatar"
+                id="hotbarIcon-hotbar-icon-catalog-entity"
+                style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+              >
+                Ca
+              </div>
+            </div>
+          </div>
+        </div>
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="2"
@@ -1175,7 +1191,23 @@ exports[`preferences - navigation to terminal preferences given in preferences,
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="1"
-        />
+        >
+          <div
+            style="z-index: 11; position: absolute;"
+          >
+            <div
+              class="HotbarIcon contextMenuAvailable"
+            >
+              <div
+                class="Avatar rounded disabled avatar"
+                id="hotbarIcon-hotbar-icon-catalog-entity"
+                style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+              >
+                Ca
+              </div>
+            </div>
+          </div>
+        </div>
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="2"
diff --git a/packages/core/src/features/preferences/__snapshots__/navigation-using-application-menu.test.ts.snap b/packages/core/src/features/preferences/__snapshots__/navigation-using-application-menu.test.ts.snap
index 5a3c184892..d3b305659b 100644
--- a/packages/core/src/features/preferences/__snapshots__/navigation-using-application-menu.test.ts.snap
+++ b/packages/core/src/features/preferences/__snapshots__/navigation-using-application-menu.test.ts.snap
@@ -185,7 +185,23 @@ exports[`preferences - navigation using application menu renders 1`] = `
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="1"
-        />
+        >
+          <div
+            style="z-index: 11; position: absolute;"
+          >
+            <div
+              class="HotbarIcon contextMenuAvailable"
+            >
+              <div
+                class="Avatar rounded disabled avatar"
+                id="hotbarIcon-hotbar-icon-catalog-entity"
+                style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+              >
+                Ca
+              </div>
+            </div>
+          </div>
+        </div>
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="2"
@@ -846,7 +862,23 @@ exports[`preferences - navigation using application menu when navigating to pref
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="1"
-        />
+        >
+          <div
+            style="z-index: 11; position: absolute;"
+          >
+            <div
+              class="HotbarIcon contextMenuAvailable"
+            >
+              <div
+                class="Avatar rounded disabled avatar"
+                id="hotbarIcon-hotbar-icon-catalog-entity"
+                style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+              >
+                Ca
+              </div>
+            </div>
+          </div>
+        </div>
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="2"
diff --git a/packages/core/src/features/preferences/__snapshots__/navigation-using-tray.test.ts.snap b/packages/core/src/features/preferences/__snapshots__/navigation-using-tray.test.ts.snap
index 5e547dcf11..2002c3dc59 100644
--- a/packages/core/src/features/preferences/__snapshots__/navigation-using-tray.test.ts.snap
+++ b/packages/core/src/features/preferences/__snapshots__/navigation-using-tray.test.ts.snap
@@ -186,7 +186,23 @@ exports[`show-about-using-tray renders 1`] = `
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -849,7 +865,23 @@ exports[`show-about-using-tray when navigating using tray renders 1`] = `
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
diff --git a/packages/core/src/features/preferences/__snapshots__/urls-of-legacy-extensions.test.tsx.snap b/packages/core/src/features/preferences/__snapshots__/urls-of-legacy-extensions.test.tsx.snap
index 830e3dc790..4ab950205b 100644
--- a/packages/core/src/features/preferences/__snapshots__/urls-of-legacy-extensions.test.tsx.snap
+++ b/packages/core/src/features/preferences/__snapshots__/urls-of-legacy-extensions.test.tsx.snap
@@ -329,7 +329,23 @@ exports[`preferences: URLs of legacy extensions given extension with both custom
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -758,7 +774,23 @@ exports[`preferences: URLs of legacy extensions given extension with both custom
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -1149,7 +1181,23 @@ exports[`preferences: URLs of legacy extensions given extension with custom pref
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -1514,7 +1562,23 @@ exports[`preferences: URLs of legacy extensions given extension with custom pref
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -1919,7 +1983,23 @@ exports[`preferences: URLs of legacy extensions given extension with custom pref
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
diff --git a/packages/core/src/features/status-bar/__snapshots__/status-bar-items-originating-from-extensions.test.tsx.snap b/packages/core/src/features/status-bar/__snapshots__/status-bar-items-originating-from-extensions.test.tsx.snap
index d5ac8ea3be..02d8379ed6 100644
--- a/packages/core/src/features/status-bar/__snapshots__/status-bar-items-originating-from-extensions.test.tsx.snap
+++ b/packages/core/src/features/status-bar/__snapshots__/status-bar-items-originating-from-extensions.test.tsx.snap
@@ -186,7 +186,23 @@ exports[`status-bar-items-originating-from-extensions when application starts wh
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
diff --git a/packages/core/src/features/top-bar/extension-api/__snapshots__/extendability-using-extension-api.test.tsx.snap b/packages/core/src/features/top-bar/extension-api/__snapshots__/extendability-using-extension-api.test.tsx.snap
index 064f00992f..b2c622211d 100644
--- a/packages/core/src/features/top-bar/extension-api/__snapshots__/extendability-using-extension-api.test.tsx.snap
+++ b/packages/core/src/features/top-bar/extension-api/__snapshots__/extendability-using-extension-api.test.tsx.snap
@@ -186,7 +186,23 @@ exports[`extendability-using-extension-api given an extension with a weakly type
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -481,7 +497,23 @@ exports[`extendability-using-extension-api given an extension with top-bar items
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -767,7 +799,23 @@ exports[`extendability-using-extension-api given an extension with top-bar items
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -1053,7 +1101,23 @@ exports[`extendability-using-extension-api renders 1`] = `
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
diff --git a/packages/core/src/features/welcome/__snapshots__/navigation-using-application-menu.test.ts.snap b/packages/core/src/features/welcome/__snapshots__/navigation-using-application-menu.test.ts.snap
index 658368230a..14e0ca1101 100644
--- a/packages/core/src/features/welcome/__snapshots__/navigation-using-application-menu.test.ts.snap
+++ b/packages/core/src/features/welcome/__snapshots__/navigation-using-application-menu.test.ts.snap
@@ -185,7 +185,23 @@ exports[`welcome - navigation using application menu renders 1`] = `
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="1"
-        />
+        >
+          <div
+            style="z-index: 11; position: absolute;"
+          >
+            <div
+              class="HotbarIcon contextMenuAvailable"
+            >
+              <div
+                class="Avatar rounded disabled avatar"
+                id="hotbarIcon-hotbar-icon-catalog-entity"
+                style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+              >
+                Ca
+              </div>
+            </div>
+          </div>
+        </div>
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="2"
@@ -847,7 +863,23 @@ exports[`welcome - navigation using application menu when navigated somewhere el
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -1132,7 +1164,23 @@ exports[`welcome - navigation using application menu when navigated somewhere el
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="1"
-        />
+        >
+          <div
+            style="z-index: 11; position: absolute;"
+          >
+            <div
+              class="HotbarIcon contextMenuAvailable"
+            >
+              <div
+                class="Avatar rounded disabled avatar"
+                id="hotbarIcon-hotbar-icon-catalog-entity"
+                style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+              >
+                Ca
+              </div>
+            </div>
+          </div>
+        </div>
         <div
           class="HotbarCell isDraggingOwner animateDown"
           index="2"
diff --git a/packages/core/src/renderer/components/status-bar/__snapshots__/status-bar.test.tsx.snap b/packages/core/src/renderer/components/status-bar/__snapshots__/status-bar.test.tsx.snap
index 8e08530a3b..0a2f58597b 100644
--- a/packages/core/src/renderer/components/status-bar/__snapshots__/status-bar.test.tsx.snap
+++ b/packages/core/src/renderer/components/status-bar/__snapshots__/status-bar.test.tsx.snap
@@ -186,7 +186,23 @@ exports[`<StatusBar /> when StatusBar's status is set to "error" renders 1`] = `
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -472,7 +488,23 @@ exports[`<StatusBar /> when StatusBar's status is set to "warning" renders 1`] =
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -758,7 +790,23 @@ exports[`<StatusBar /> when an extension is enabled specifying the side the elem
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -1086,7 +1134,23 @@ exports[`<StatusBar /> when an extension is enabled with an invalid data type, (
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -1372,7 +1436,23 @@ exports[`<StatusBar /> when an extension is enabled with an invalid data type, (
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -1658,7 +1738,23 @@ exports[`<StatusBar /> when an extension is enabled with an invalid data type, (
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -1944,7 +2040,23 @@ exports[`<StatusBar /> when an extension is enabled with an invalid data type, (
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -2230,7 +2342,23 @@ exports[`<StatusBar /> when an extension is enabled with an invalid data type, (
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -2516,7 +2644,23 @@ exports[`<StatusBar /> when an extension is enabled with an invalid data type, (
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -2802,7 +2946,23 @@ exports[`<StatusBar /> when an extension is enabled with an invalid data type, (
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"
@@ -3088,7 +3248,23 @@ exports[`<StatusBar /> when an extension is enabled with no status items renders
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="1"
-          />
+          >
+            <div
+              style="z-index: 11; position: absolute;"
+            >
+              <div
+                class="HotbarIcon contextMenuAvailable"
+              >
+                <div
+                  class="Avatar rounded disabled avatar"
+                  id="hotbarIcon-hotbar-icon-catalog-entity"
+                  style="width: 40px; height: 40px; background: rgb(5, 1, 130);"
+                >
+                  Ca
+                </div>
+              </div>
+            </div>
+          </div>
           <div
             class="HotbarCell isDraggingOwner animateDown"
             index="2"