From 6fe5654259e382ccbb1ca3aa0a22a2b5baf29680 Mon Sep 17 00:00:00 2001
From: Alec Jacobs <charles.jacobs@segment.com>
Date: Thu, 27 Aug 2026 08:47:19 -0700
Subject: [PATCH] feat(analytics-module-segment): adopt new frontend system

Signed-off-by: Alec Jacobs <charles.jacobs@segment.com>
---
 plugins/analytics-module-segment/README.md    | 20 +++++++++++++++-
 plugins/analytics-module-segment/package.json | 20 ++++++++++++++--
 plugins/analytics-module-segment/src/alpha.ts |  1 +
 .../src/module.test.ts                        | 12 ++++++++++
 .../analytics-module-segment/src/module.ts    | 24 +++++++++++++++++++
 5 files changed, 74 insertions(+), 3 deletions(-)
 create mode 100644 plugins/analytics-module-segment/src/alpha.ts
 create mode 100644 plugins/analytics-module-segment/src/module.test.ts
 create mode 100644 plugins/analytics-module-segment/src/module.ts

diff --git a/plugins/analytics-module-segment/README.md b/plugins/analytics-module-segment/README.md
index 122da7e..8780e1f 100644
--- a/plugins/analytics-module-segment/README.md
+++ b/plugins/analytics-module-segment/README.md
@@ -17,7 +17,25 @@ This plugin requires an active workspace with [Segment][segment]. Please referen
 yarn --cwd packages/app add @segment/backstage-plugin-analytics-module-segment
 ```
 
-### Wire up the API implementation to your App:
+### New frontend system
+
+Add the module to your app's frontend features:
+
+```ts
+// packages/app/src/App.tsx
+import segmentAnalyticsModule from '@segment/backstage-plugin-analytics-module-segment/alpha';
+
+const app = createApp({
+  features: [segmentAnalyticsModule],
+});
+```
+
+The module uses the configured Backstage identity when identifying users in
+Segment.
+
+### Legacy frontend system
+
+Wire up the API implementation to your app:
 
 ```ts
 // packages/app/src/apis.ts
diff --git a/plugins/analytics-module-segment/package.json b/plugins/analytics-module-segment/package.json
index f61d92f..13d3683 100644
--- a/plugins/analytics-module-segment/package.json
+++ b/plugins/analytics-module-segment/package.json
@@ -11,10 +11,25 @@
     "main": "dist/index.esm.js",
     "types": "dist/index.d.ts"
   },
+  "exports": {
+    ".": "./src/index.ts",
+    "./alpha": "./src/alpha.ts",
+    "./package.json": "./package.json"
+  },
+  "typesVersions": {
+    "*": {
+      "alpha": [
+        "src/alpha.ts"
+      ],
+      "package.json": [
+        "package.json"
+      ]
+    }
+  },
   "backstage": {
     "role": "frontend-plugin-module",
     "pluginId": "app",
-    "pluginPackage": "@backstage/plugin-app-backend"
+    "pluginPackage": "@backstage/plugin-app"
   },
   "repository": {
     "type": "git",
@@ -32,6 +47,8 @@
     "postpack": "backstage-cli package postpack"
   },
   "dependencies": {
+    "@backstage/frontend-plugin-api": "^0.17.3",
+    "@backstage/plugin-app-react": "^0.2.6",
     "@segment/analytics-next": "^1.72.1"
   },
   "peerDependencies": {
@@ -44,7 +61,6 @@
     "@backstage/core-components": "^0.18.12",
     "@backstage/core-plugin-api": "^1.12.8",
     "@backstage/dev-utils": "^1.1.25",
-    "@backstage/frontend-plugin-api": "^0.17.3",
     "react": "^16.13.1 || ^17.0.0 || ^18.0.0"
   },
   "files": [
diff --git a/plugins/analytics-module-segment/src/alpha.ts b/plugins/analytics-module-segment/src/alpha.ts
new file mode 100644
index 0000000..278ee5d
--- /dev/null
+++ b/plugins/analytics-module-segment/src/alpha.ts
@@ -0,0 +1 @@
+export { segmentAnalyticsModule as default } from './module';
diff --git a/plugins/analytics-module-segment/src/module.test.ts b/plugins/analytics-module-segment/src/module.test.ts
new file mode 100644
index 0000000..44c9d38
--- /dev/null
+++ b/plugins/analytics-module-segment/src/module.test.ts
@@ -0,0 +1,12 @@
+import segmentModule from './alpha';
+import { segmentAnalyticsModule } from './module';
+
+describe('segmentAnalyticsModule', () => {
+  it('provides an app frontend module through the alpha entry point', () => {
+    expect(segmentModule).toBe(segmentAnalyticsModule);
+    expect(segmentAnalyticsModule).toMatchObject({
+      $$type: '@backstage/FrontendModule',
+      pluginId: 'app',
+    });
+  });
+});
diff --git a/plugins/analytics-module-segment/src/module.ts b/plugins/analytics-module-segment/src/module.ts
new file mode 100644
index 0000000..7a9f0a4
--- /dev/null
+++ b/plugins/analytics-module-segment/src/module.ts
@@ -0,0 +1,24 @@
+import {
+  configApiRef,
+  createFrontendModule,
+  identityApiRef,
+} from '@backstage/frontend-plugin-api';
+import { AnalyticsImplementationBlueprint } from '@backstage/plugin-app-react';
+
+import { SegmentAnalytics } from './apis';
+
+const segmentAnalyticsImplementation = AnalyticsImplementationBlueprint.make({
+  name: 'segment',
+  params: defineParams =>
+    defineParams({
+      deps: { configApi: configApiRef, identityApi: identityApiRef },
+      factory: ({ configApi, identityApi }) =>
+        SegmentAnalytics.fromConfig(configApi, { identityApi }),
+    }),
+});
+
+/** @public */
+export const segmentAnalyticsModule = createFrontendModule({
+  pluginId: 'app',
+  extensions: [segmentAnalyticsImplementation],
+});