feat(ui): add analytics event tracking to BUI navigation components (#33150)

* feat(ui): add analytics types Signed-off-by: Johan Persson <johanopersson@gmail.com> * feat(ui): add useAnalytics hook with dev-mode swap guard Signed-off-by: Johan Persson <johanopersson@gmail.com> * feat(ui): add AnalyticsProvider, getNodeText, and analytics barrel exports Signed-off-by: Johan Persson <johanopersson@gmail.com> * feat(ui): integrate analytics into defineComponent and useDefinition Signed-off-by: Johan Persson <johanopersson@gmail.com> * feat(ui): add analytics tracking to Link component Signed-off-by: Johan Persson <johanopersson@gmail.com> * feat(ui): add analytics tracking to ButtonLink component Signed-off-by: Johan Persson <johanopersson@gmail.com> * feat(ui): add analytics tracking to Tab component Signed-off-by: Johan Persson <johanopersson@gmail.com> * feat(ui): add analytics tracking to MenuItem component Signed-off-by: Johan Persson <johanopersson@gmail.com> * feat(ui): add analytics tracking to Tag component Signed-off-by: Johan Persson <johanopersson@gmail.com> * feat(ui): add analytics tracking to Table Row component Signed-off-by: Johan Persson <johanopersson@gmail.com> * feat(ui): widen getNodeText to accept render functions Signed-off-by: Johan Persson <johanopersson@gmail.com> * chore(ui): update API reports Signed-off-by: Johan Persson <johanopersson@gmail.com> * chore: add changeset for BUI analytics Signed-off-by: Johan Persson <johanopersson@gmail.com> * fix(ui): chain MenuItem onAction with user-provided handler instead of overwriting Signed-off-by: Johan Persson <johanopersson@gmail.com> * chore(ui): address review feedback — changeset wording and types docs Signed-off-by: Johan Persson <johanopersson@gmail.com> * feat(core-app-api): wire AnalyticsProvider from @backstage/ui into app shell Signed-off-by: Johan Persson <johanopersson@gmail.com> * feat(plugin-app): add AnalyticsProvider wrapper extension for BUI components Signed-off-by: Johan Persson <johanopersson@gmail.com> * chore: update API reports Signed-off-by: Johan Persson <johanopersson@gmail.com> * chore: update API reports for core-components and scaffolder Signed-off-by: Johan Persson <johanopersson@gmail.com> * docs(ui): add analytics documentation and noTrack prop to component docs Signed-off-by: Johan Persson <johanopersson@gmail.com> * chore: update yarn.lock Signed-off-by: Johan Persson <johanopersson@gmail.com> * feat(plugin-app): move AnalyticsProvider into AppRoot directly Signed-off-by: Johan Persson <johanopersson@gmail.com> * chore: format installation docs Signed-off-by: Johan Persson <johanopersson@gmail.com> * fix(ui): call user onPress before analytics in Tag component Signed-off-by: Johan Persson <johanopersson@gmail.com> * refactor(ui): replace AnalyticsProvider with generic BUIProvider Signed-off-by: Johan Persson <johanopersson@gmail.com> * chore: replace remaining AnalyticsProvider references with BUIProvider Signed-off-by: Johan Persson <johanopersson@gmail.com> * fix(plugin-app): import useAnalytics from frontend-plugin-api Signed-off-by: Johan Persson <johanopersson@gmail.com> * docs(ui): improve noTrack prop description Signed-off-by: Johan Persson <johanopersson@gmail.com> --------- Signed-off-by: Johan Persson <johanopersson@gmail.com>
2026-03-06 14:45:57 +01:00
parent 3e68fcae92
commit 12d8afe82d
46 changed files with 606 additions and 50 deletions
@@ -29,12 +29,14 @@ import {
  createExtension,
  createExtensionInput,
  routeResolutionApiRef,
+  useAnalytics,
 } from '@backstage/frontend-plugin-api';
 import {
  AppRootWrapperBlueprint,
  RouterBlueprint,
  SignInPageBlueprint,
 } from '@backstage/plugin-app-react';
+import { BUIProvider } from '@backstage/ui';
 import {
  DiscoveryApi,
  ErrorApi,
@@ -115,19 +117,21 @@ export const AppRoot = createExtension({

    return [
      coreExtensionData.reactElement(
-        <AppRouter
-          SignInPageComponent={inputs.signInPage?.get(
-            SignInPageBlueprint.dataRefs.component,
-          )}
-          RouterComponent={inputs.router?.get(
-            RouterBlueprint.dataRefs.component,
-          )}
-          extraElements={inputs.elements?.map(el =>
-            el.get(coreExtensionData.reactElement),
-          )}
-        >
-          {content}
-        </AppRouter>,
+        <BUIProvider useAnalytics={useAnalytics}>
+          <AppRouter
+            SignInPageComponent={inputs.signInPage?.get(
+              SignInPageBlueprint.dataRefs.component,
+            )}
+            RouterComponent={inputs.router?.get(
+              RouterBlueprint.dataRefs.component,
+            )}
+            extraElements={inputs.elements?.map(el =>
+              el.get(coreExtensionData.reactElement),
+            )}
+          >
+            {content}
+          </AppRouter>
+        </BUIProvider>,
      ),
    ];
  },