diff --git a/public/app/core/components/AppChrome/ExtensionSidebar/ExtensionToolbarItem.tsx b/public/app/core/components/AppChrome/ExtensionSidebar/ExtensionToolbarItem.tsx
index 8b4a67d1c2b..3839ebcfcaa 100644
--- a/public/app/core/components/AppChrome/ExtensionSidebar/ExtensionToolbarItem.tsx
+++ b/public/app/core/components/AppChrome/ExtensionSidebar/ExtensionToolbarItem.tsx
@@ -1,7 +1,5 @@
 import { ExtensionInfo } from '@grafana/data';
-import { getAppEvents } from '@grafana/runtime';
 import { Dropdown, Menu } from '@grafana/ui';
-import { CloseExtensionSidebarEvent, OpenExtensionSidebarEvent } from 'app/types/events';
 
 import { NavToolbarSeparator } from '../NavToolbar/NavToolbarSeparator';
 
@@ -21,7 +19,7 @@ type Props = {
 const compactAllowedComponents = ['grafana-assistant-app'];
 
 export function ExtensionToolbarItem({ compact }: Props) {
-  const { availableComponents, dockedComponentId } = useExtensionSidebarContext();
+  const { availableComponents, dockedComponentId, setDockedComponentId } = useExtensionSidebarContext();
 
   if (availableComponents.size === 0) {
     return null;
@@ -46,14 +44,7 @@ export function ExtensionToolbarItem({ compact }: Props) {
           key={pluginId}
           isOpen={isActive}
           title={component.title}
-          onClick={() => {
-            const appEvents = getAppEvents();
-            if (isActive) {
-              appEvents.publish(new CloseExtensionSidebarEvent());
-            } else {
-              appEvents.publish(new OpenExtensionSidebarEvent({ pluginId, componentTitle: component.title }));
-            }
-          }}
+          onClick={() => setDockedComponentId(isActive ? undefined : componentId)}
           pluginId={pluginId}
         />
       );
@@ -69,14 +60,7 @@ export function ExtensionToolbarItem({ compact }: Props) {
               key={id}
               active={dockedComponentId === id}
               label={c.title}
-              onClick={() => {
-                const appEvents = getAppEvents();
-                if (dockedComponentId === id) {
-                  appEvents.publish(new CloseExtensionSidebarEvent());
-                } else {
-                  appEvents.publish(new OpenExtensionSidebarEvent({ pluginId, componentTitle: c.title }));
-                }
-              }}
+              onClick={() => setDockedComponentId(dockedComponentId === id ? undefined : id)}
             />
           );
         })}
@@ -88,9 +72,7 @@ export function ExtensionToolbarItem({ compact }: Props) {
         key={pluginId}
         isOpen
         title={dockedMeta?.componentTitle}
-        onClick={() => {
-          getAppEvents().publish(new CloseExtensionSidebarEvent());
-        }}
+        onClick={() => setDockedComponentId(undefined)}
         pluginId={pluginId}
       />
     ) : (