Oppdater amplitude (#256)

.github/workflows/deploy.yml

@@ -45,7 +45,7 @@ jobs:
     deploy-til-dev:
         name: Deploy til dev-gcp
         needs: bygg-og-push-docker-image
-        if: github.event_name == 'workflow_dispatch' || github.ref == 'refs/heads/master' || github.ref == 'refs/heads/fjern-janzz-fra-minne-dersom-onToggle-blir-kalt-uten-verdi'
+        if: github.event_name == 'workflow_dispatch' || github.ref == 'refs/heads/master' || github.ref == 'refs/heads/amplitude'
         runs-on: ubuntu-latest
         steps:
             - uses: actions/checkout@v3

package.json

@@ -19,6 +19,7 @@
         }
     },
     "dependencies": {
+        "@amplitude/analytics-browser": "^2.11.9",
         "@grafana/faro-web-sdk": "1.3.9",
         "@grafana/faro-web-tracing": "1.3.9",
         "@navikt/ds-css": "6.1.0",
@@ -42,7 +43,6 @@
         "@tiptap/extension-underline": "^2.5.5",
         "@tiptap/pm": "^2.5.5",
         "@tiptap/react": "^2.5.5",
-        "amplitude-js": "^8.21.9",
         "classnames": "2.5.1",
         "deep-equal": "2.2.3",
         "history": "^5.3.0",
@@ -68,7 +68,6 @@
         "@testing-library/jest-dom": "^6.1.0",
         "@testing-library/react": "^14.2.1",
         "@testing-library/user-event": "^14.5.2",
-        "@types/amplitude-js": "^8.16.2",
         "@types/loadjs": "^4.0.0",
         "@types/node": "^20.12.7",
         "@types/react": "^18.2.14",

src/felles/amplitude.ts

@@ -1,4 +1,5 @@
-import amplitudeJs, { AmplitudeClient } from 'amplitude-js';
+import * as amplitude from '@amplitude/analytics-browser';
+import { Types } from '@amplitude/analytics-browser';
 import { Miljø, getMiljø } from './miljø';
 
 export enum AmplitudeEvent {
@@ -14,47 +15,45 @@ const getApiKey = () => {
 
 export const setNavKontorForAmplitude = (navKontor: string) => {
     if (import.meta.env.PROD) {
-        client.setUserProperties({
-            navKontor,
-        });
+        const nyttIdentitentsObjekt = new amplitude.Identify();
+        nyttIdentitentsObjekt.set('navKontor', navKontor);
+        client()?.identify(nyttIdentitentsObjekt);
     }
 };
 
 export const sendEvent = (område: string, hendelse: string, data?: object) => {
     if (import.meta.env.PROD) {
-        client.logEvent(['#rekrutteringsbistand', område, hendelse].join('-'), data);
+        client()?.logEvent(['#rekrutteringsbistand', område, hendelse].join('-'), data);
     }
 };
 
 export const sendGenerellEvent = (
     event: AmplitudeEvent | string,
     properties: Record<string, any>
-): Promise<void> | undefined => {
+) => {
     if (import.meta.env.PROD) {
         const eventProperties = {
             app: 'rekrutteringsbistand',
             ...properties,
         };
 
-        return new Promise((resolve, reject) => {
-            client.logEvent(
-                event,
-                eventProperties,
-                () => resolve(),
-                () => reject()
-            );
-        });
+        client()?.logEvent(event, eventProperties);
     }
 };
 
-const client: AmplitudeClient = amplitudeJs.getInstance();
-
-if (import.meta.env.PROD) {
-    client.init(getApiKey(), '', {
-        apiEndpoint: 'amplitude.nav.no/collect',
-        saveEvents: false,
-        includeUtm: true,
-        batchEvents: false,
-        includeReferrer: false,
+export const client = (): Pick<Types.BrowserClient, 'logEvent' | 'identify'> | null => {
+    amplitude.init(getApiKey(), undefined, {
+        serverUrl: 'https://amplitude.nav.no/collect',
+        useBatch: false,
+        autocapture: {
+            attribution: true,
+            fileDownloads: false,
+            formInteractions: false,
+            pageViews: true,
+            sessions: true,
+            elementInteractions: false,
+        },
     });
-}
+
+    return amplitude;
+};