fix(ci): adding changelog, semver release, and formatting

.github/workflows/main.yml

@@ -10,14 +10,14 @@ jobs:
     runs-on: ubuntu-latest
     strategy:
       matrix:
-        node-version: [18]
+        node-version: ["lts/*"]
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
         with:
           fetch-depth: '0'
 
       - name: Use Node.js ${{ matrix.node-version }}
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v4
         with:
           node-version: ${{ matrix.node-version }}
 

.github/workflows/release.yml

@@ -0,0 +1,33 @@
+name: Release
+on:
+  push:
+    branches:
+      - main
+
+permissions:
+  contents: read # for checkout
+
+jobs:
+  release:
+    name: Release
+    runs-on: ubuntu-latest
+    permissions:
+      contents: write # to be able to publish a GitHub release
+      issues: write # to be able to comment on released issues
+      pull-requests: write # to be able to comment on released pull requests
+      id-token: write # to enable use of OIDC for npm provenance
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+        with:
+          fetch-depth: 0
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: "lts/*"
+      - name: Install dependencies
+        run: yarn install
+      - name: Release
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+        run: npx semantic-release

.github/workflows/semantic.yml

@@ -8,7 +8,7 @@ jobs:
   check:
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
       - name: semantic-pull-request
         uses: amannn/action-semantic-pull-request@v4
         env:

.prettierignore

@@ -0,0 +1,13 @@
+.github
+.yarn
+dist
+dist-types
+node_modules
+.gitignore
+.prettierignore
+*.yaml
+*.json
+*.yaml
+*.md
+LICENSE
+yarn.lock

.prettierrc.yaml

@@ -0,0 +1,11 @@
+arrowParens: always
+bracketSpacing: true
+endOfLine: lf
+bracketSameLine: false
+printWidth: 80
+quoteProps: as-needed
+semi: true
+singleQuote: true
+tabWidth: 2
+trailingComma: all
+useTabs: false

.releaserc.json

@@ -0,0 +1,20 @@
+{
+  "branches": ["main"],
+  "plugins": [
+    "@semantic-release/commit-analyzer",
+    "@semantic-release/release-notes-generator",
+    [
+      "@semantic-release/changelog",
+      {
+        "changelogFile": "./CHANGELOG.md"
+      }
+    ],
+    "@semantic-release/github",
+    [
+      "@semantic-release/git",
+      {
+        "assets": ["./CHANGELOG.md"]
+      }
+    ]
+  ]
+}

config.d.ts

@@ -53,4 +53,3 @@ export interface Config {
     };
   };
 }
-

package.json

@@ -21,7 +21,9 @@
     "test": "backstage-cli package test",
     "clean": "backstage-cli package clean",
     "prepack": "backstage-cli package prepack",
-    "postpack": "backstage-cli package postpack"
+    "prettier:check": "prettier --check .",
+    "postpack": "backstage-cli package postpack",
+    "release": "semantic-release"
   },
   "dependencies": {
     "@backstage/config": "^1.1.1",
@@ -32,6 +34,7 @@
     "@material-ui/core": "^4.9.13",
     "@material-ui/icons": "^4.9.1",
     "@material-ui/lab": "^4.0.0-alpha.61",
+    "prettier": "^3.2.5",
     "react-use": "^17.2.4"
   },
   "peerDependencies": {
@@ -42,10 +45,14 @@
     "@backstage/core-app-api": "^1.9.1",
     "@backstage/dev-utils": "^1.0.19",
     "@backstage/test-utils": "^1.4.2",
+    "@semantic-release/changelog": "^6.0.3",
+    "@semantic-release/git": "^10.0.1",
+    "@semantic-release/github": "^9.2.6",
     "@testing-library/jest-dom": "^5.10.1",
     "@testing-library/react": "^12.1.3",
     "@testing-library/user-event": "^14.0.0",
-    "msw": "^1.0.0"
+    "msw": "^1.0.0",
+    "semantic-release": "^23.0.2"
   },
   "files": [
     "dist",

src/api/QuantumMetric.ts

@@ -1,18 +1,18 @@
 /* eslint-disable no-console */
 import { Config } from '@backstage/config';
 import {
-    AnalyticsApi,
-    AnalyticsEvent,
-    IdentityApi,
+  AnalyticsApi,
+  AnalyticsEvent,
+  IdentityApi,
 } from '@backstage/core-plugin-api';
 import {
-    AnalyticsApi as NewAnalyticsApi,
-    AnalyticsEvent as NewAnalyticsEvent,
+  AnalyticsApi as NewAnalyticsApi,
+  AnalyticsEvent as NewAnalyticsEvent,
 } from '@backstage/frontend-plugin-api';
 import {
-    Transformer,
-    defaultEventTransform,
-    defaultTransforms,
+  Transformer,
+  defaultEventTransform,
+  defaultTransforms,
 } from '../util/transforms';
 
 type eventsConfig = {
@@ -35,7 +35,7 @@ type QuantumMetricAPI = {
     eventId: number | string,
     conversion?: number | boolean,
     eventValue?: number | string,
-    attributes?: Record<string, string | boolean | number | undefined>
+    attributes?: Record<string, string | boolean | number | undefined>,
   ) => void;
 };
 
@@ -63,32 +63,32 @@ export class QuantumMetric implements AnalyticsApi, NewAnalyticsApi {
     const { enabled, test, debug, src, async, events } = options.qmConfig;
 
     if (!enabled) {
-      if (debug) console.debug("Quantum Metric Analytics plugin disabled.");
+      if (debug) console.debug('Quantum Metric Analytics plugin disabled.');
       return {} as QuantumMetric;
     }
 
     this.test = test;
     this.debug = debug;
 
-    if (window.hasOwnProperty("QuantumMetricAPI")) {
+    if (window.hasOwnProperty('QuantumMetricAPI')) {
       this.quantumInstalled = true;
     }
 
     if (src) {
       if (this.debug) console.debug(`Fetching Quantum Metric API from ${src}`);
       this.installQuantum(async, src);
-      if (this.debug) console.debug("Quantum Metric has been fetched");
+      if (this.debug) console.debug('Quantum Metric has been fetched');
     }
 
     this.capture = (window as any).QuantumMetricAPI as QuantumMetricAPI;
-    if (this.debug) console.debug("Set class capture member variable");
+    if (this.debug) console.debug('Set class capture member variable');
 
     if (options.identityApi) {
       if (this.debug)
-        console.debug("Identity API provided; Identifying user by email");
+        console.debug('Identity API provided; Identifying user by email');
 
       // TODO wait for quantum to load
-      console.debug("Quantum API loaded");
+      console.debug('Quantum API loaded');
       options.identityApi.getProfileInfo().then((profile) => {
         if (profile?.email) this.capture?.identifyUser(profile.email);
       });
@@ -98,7 +98,7 @@ export class QuantumMetric implements AnalyticsApi, NewAnalyticsApi {
       this.eventsMapping = events;
     } else if (!events && debug) {
       console.debug(
-        "Events mapping not passed in, OOTB events will not be sent to Quantum Metric"
+        'Events mapping not passed in, OOTB events will not be sent to Quantum Metric',
       );
     }
 
@@ -113,13 +113,13 @@ export class QuantumMetric implements AnalyticsApi, NewAnalyticsApi {
     }
 
     this.quantumInstalled = true;
-    const qtm = document.createElement("script");
-    qtm.type = "text/javascript";
+    const qtm = document.createElement('script');
+    qtm.type = 'text/javascript';
     qtm.async = async;
     qtm.src = src;
 
     // Install before any other script
-    const d = document.getElementsByTagName("script")[0];
+    const d = document.getElementsByTagName('script')[0];
     if (d.parentNode) {
       d.parentNode.insertBefore(qtm, d);
     }
@@ -129,20 +129,20 @@ export class QuantumMetric implements AnalyticsApi, NewAnalyticsApi {
    * validateConfig creates the guardrails for providing feedback to integrators on invalid configurations.
    */
   static validateConfig(config: QMConfig) {
-    if (config.debug) console.debug("Starting configuration validation");
+    if (config.debug) console.debug('Starting configuration validation');
 
-    if (!config.src.includes("https://cdn.quantummetric.com/"))
+    if (!config.src.includes('https://cdn.quantummetric.com/'))
       console.warn(
-        "Unexpected source provided; Expected source to start with https://cdn.quantummetric.com/"
+        'Unexpected source provided; Expected source to start with https://cdn.quantummetric.com/',
       );
 
     if (config.events) {
       const filteredEvents = config.events.filter(
-        (event) => event.name && event.id
+        (event) => event.name && event.id,
       );
       if (filteredEvents.length !== config.events.length) {
         console.warn(
-          "Event mapping passed in that did not specify a name or ID"
+          'Event mapping passed in that did not specify a name or ID',
         );
       }
     }
@@ -156,18 +156,18 @@ export class QuantumMetric implements AnalyticsApi, NewAnalyticsApi {
     options: {
       identityApi?: IdentityApi;
       eventTransforms?: Record<string, Transformer>;
-    } = {}
+    } = {},
   ) {
     // Get all necessary configuration.
-    const enabled = config.getBoolean("app.analytics.qm.enabled");
+    const enabled = config.getBoolean('app.analytics.qm.enabled');
 
     // Get all optional configuration. Defaults are set if values are not provided.
-    const src = config.getOptionalString("app.analytics.qm.src") ?? "";
-    const async = config.getOptionalBoolean("app.analytics.qm.async") ?? false;
-    const test = config.getOptionalBoolean("app.analytics.qm.test") ?? false;
-    const debug = config.getOptionalBoolean("app.analytics.qm.debug") ?? false;
+    const src = config.getOptionalString('app.analytics.qm.src') ?? '';
+    const async = config.getOptionalBoolean('app.analytics.qm.async') ?? false;
+    const test = config.getOptionalBoolean('app.analytics.qm.test') ?? false;
+    const debug = config.getOptionalBoolean('app.analytics.qm.debug') ?? false;
     const events = (config.getOptional(
-      "app.analytics.qm.events.mappings"
+      'app.analytics.qm.events.mappings',
     ) as eventsConfig[]) ?? [{} as eventsConfig];
 
     const qmConfig: QMConfig = {
@@ -197,10 +197,13 @@ export class QuantumMetric implements AnalyticsApi, NewAnalyticsApi {
       return;
     }
 
-    const eventMapping = this.eventsMapping.reduce((prev, curr) => {
-      prev[curr.name] = curr.id;
-      return prev;
-    }, {} as Record<string, number>);
+    const eventMapping = this.eventsMapping.reduce(
+      (prev, curr) => {
+        prev[curr.name] = curr.id;
+        return prev;
+      },
+      {} as Record<string, number>,
+    );
 
     if (this.debug) console.debug(`Event received: ${JSON.stringify(event)}`);
 
@@ -209,12 +212,12 @@ export class QuantumMetric implements AnalyticsApi, NewAnalyticsApi {
 
     const { eventId, eventValue, conversion, attributes } = transformFunc(
       event,
-      eventMapping
+      eventMapping,
     );
 
     if (this.debug)
       console.debug(
-        `Transform ran and received: eventId: ${eventId}, eventValue: ${eventId}, conversion: ${conversion}, attributes: ${attributes}`
+        `Transform ran and received: eventId: ${eventId}, eventValue: ${eventId}, conversion: ${conversion}, attributes: ${attributes}`,
       );
 
     this.capture.sendEvent(eventId, conversion, eventValue, attributes);

src/setupTests.ts

@@ -1,3 +1,3 @@
 import '@testing-library/jest-dom';
 
-// TODO
+// TODO

src/util/transforms.ts

@@ -1,16 +1,16 @@
-import { AnalyticsEvent } from "@backstage/core-plugin-api";
-import { AnalyticsEvent as NewAnalyticsEvent } from "@backstage/frontend-plugin-api";
+import { AnalyticsEvent } from '@backstage/core-plugin-api';
+import { AnalyticsEvent as NewAnalyticsEvent } from '@backstage/frontend-plugin-api';
 
 /*
  * Transformers take in Backstage analytics events and transform the data to fit what is expected by the Quantum Metric
  * API.
- */ 
+ */
 export type Transformer = (
   event: AnalyticsEvent | NewAnalyticsEvent,
   eventMapping: Record<
-    AnalyticsEvent["action"] | NewAnalyticsEvent["action"],
-    QuantumEvent["eventId"]
-  >
+    AnalyticsEvent['action'] | NewAnalyticsEvent['action'],
+    QuantumEvent['eventId']
+  >,
 ) => QuantumEvent;
 
 type QuantumEvent = {
@@ -51,7 +51,7 @@ const searchEventTransform: Transformer = (event, eventMapping) => {
   const quantumEvent = {
     eventId: eventMapping[action],
     eventValue: subject,
-    attributes: { ...attributes, "results-found": value },
+    attributes: { ...attributes, 'results-found': value },
     conversion: false,
   };
 
@@ -64,7 +64,7 @@ const discoverEventTransform: Transformer = (event, eventMapping) => {
   const quantumEvent = {
     eventId: eventMapping[action],
     eventValue: subject,
-    attributes: { ...attributes, "search-position": value },
+    attributes: { ...attributes, 'search-position': value },
     conversion: false,
   };
 
@@ -87,7 +87,7 @@ export const defaultTransforms: Record<string, Transformer> = {
   navigate: navigationEventTransform,
   search: searchEventTransform,
   discover: discoverEventTransform,
-  "not-found": defaultEventTransform,
+  'not-found': defaultEventTransform,
   click: defaultEventTransform,
   sendEvent: sendEventTransform,
 };