diff --git a/public/app/features/dashboard/components/PanelEditor/OptionsPaneOptions.tsx b/public/app/features/dashboard/components/PanelEditor/OptionsPaneOptions.tsx
index 7db9b36c2a7..f9964372880 100644
--- a/public/app/features/dashboard/components/PanelEditor/OptionsPaneOptions.tsx
+++ b/public/app/features/dashboard/components/PanelEditor/OptionsPaneOptions.tsx
@@ -109,6 +109,7 @@ export const OptionsPaneOptions = (props: OptionPaneRenderProps) => {
             pluginId={plugin.meta.id}
             pluginType={plugin.meta.type}
             angularSupportEnabled={config?.angularSupportEnabled}
+            interactionElementId="panel-options"
           />
         )}
         <div className={styles.formRow}>
diff --git a/public/app/features/plugins/admin/components/PluginDetailsPage.tsx b/public/app/features/plugins/admin/components/PluginDetailsPage.tsx
index afa73b9ac72..146e12365f5 100644
--- a/public/app/features/plugins/admin/components/PluginDetailsPage.tsx
+++ b/public/app/features/plugins/admin/components/PluginDetailsPage.tsx
@@ -82,6 +82,7 @@ export function PluginDetailsPage({
               pluginId={plugin.id}
               pluginType={plugin.type}
               showPluginDetailsLink={false}
+              interactionElementId="plugin-details-page"
             />
           )}
           <PluginDetailsSignature plugin={plugin} className={styles.alert} />
diff --git a/public/app/features/plugins/angularDeprecation/AngularDeprecationPluginNotice.test.tsx b/public/app/features/plugins/angularDeprecation/AngularDeprecationPluginNotice.test.tsx
index dde31332d20..92401cdd9be 100644
--- a/public/app/features/plugins/angularDeprecation/AngularDeprecationPluginNotice.test.tsx
+++ b/public/app/features/plugins/angularDeprecation/AngularDeprecationPluginNotice.test.tsx
@@ -89,12 +89,13 @@ describe('AngularDeprecationPluginNotice', () => {
   });
 
   it('reports interaction when clicking on the link', async () => {
-    render(<AngularDeprecationPluginNotice pluginId="test-id" />);
+    render(<AngularDeprecationPluginNotice pluginId="test-id" interactionElementId="some-identifier" />);
     const c = 'Read our deprecation notice and migration advice.';
     expect(screen.getByText(c)).toBeInTheDocument();
     await userEvent.click(screen.getByText(c));
     expect(reportInteraction).toHaveBeenCalledWith('angular_deprecation_docs_clicked', {
       pluginId: 'test-id',
+      elementId: 'some-identifier',
     });
   });
 });
diff --git a/public/app/features/plugins/angularDeprecation/AngularDeprecationPluginNotice.tsx b/public/app/features/plugins/angularDeprecation/AngularDeprecationPluginNotice.tsx
index 7b178924591..9f8d5b59253 100644
--- a/public/app/features/plugins/angularDeprecation/AngularDeprecationPluginNotice.tsx
+++ b/public/app/features/plugins/angularDeprecation/AngularDeprecationPluginNotice.tsx
@@ -12,6 +12,8 @@ type Props = {
 
   angularSupportEnabled?: boolean;
   showPluginDetailsLink?: boolean;
+
+  interactionElementId?: string;
 };
 
 function deprecationMessage(pluginType?: string, angularSupportEnabled?: boolean): string {
@@ -42,8 +44,17 @@ function deprecationMessage(pluginType?: string, angularSupportEnabled?: boolean
 // An Alert showing information about Angular deprecation notice.
 // If the plugin does not use Angular (!plugin.angularDetected), it returns null.
 export function AngularDeprecationPluginNotice(props: Props): React.ReactElement | null {
-  const { className, angularSupportEnabled, pluginId, pluginType, showPluginDetailsLink } = props;
+  const { className, angularSupportEnabled, pluginId, pluginType, showPluginDetailsLink, interactionElementId } = props;
   const [dismissed, setDismissed] = useState(false);
+
+  const interactionAttributes: Record<string, string> = {};
+  if (pluginId) {
+    interactionAttributes.pluginId = pluginId;
+  }
+  if (interactionElementId) {
+    interactionAttributes.elementId = interactionElementId;
+  }
+
   return dismissed ? null : (
     <Alert severity="warning" title="Angular plugin" className={className} onRemove={() => setDismissed(true)}>
       <p>{deprecationMessage(pluginType, angularSupportEnabled)}</p>
@@ -56,9 +67,7 @@ export function AngularDeprecationPluginNotice(props: Props): React.ReactElement
               target="_blank"
               rel="noreferrer"
               onClick={() => {
-                reportInteraction('angular_deprecation_docs_clicked', {
-                  pluginId,
-                });
+                reportInteraction('angular_deprecation_docs_clicked', interactionAttributes);
               }}
             >
               Read our deprecation notice and migration advice.
diff --git a/public/app/features/query/components/QueryGroup.tsx b/public/app/features/query/components/QueryGroup.tsx
index 09cd047c3a2..f2edc8761a2 100644
--- a/public/app/features/query/components/QueryGroup.tsx
+++ b/public/app/features/query/components/QueryGroup.tsx
@@ -261,6 +261,7 @@ export class QueryGroup extends PureComponent<Props, State> {
             pluginType={PluginType.datasource}
             angularSupportEnabled={config?.angularSupportEnabled}
             showPluginDetailsLink={true}
+            interactionElementId="datasource-query"
           />
         )}
       </div>