diff --git a/.github/workflows/deploy.yml b/.github/workflows/deploy.yml index c39d6ccd..5dfc1359 100644 --- a/.github/workflows/deploy.yml +++ b/.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/bytt-namespace-til-toi-for-foresporsel-om-deling-av-cv-api' + 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 diff --git a/package-lock.json b/package-lock.json index 12bdbfeb..561cc487 100644 --- a/package-lock.json +++ b/package-lock.json @@ -8,6 +8,7 @@ "name": "rekrutteringsbistand", "version": "0.1.0", "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", @@ -31,7 +32,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", @@ -57,7 +57,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", @@ -100,47 +99,87 @@ "integrity": "sha512-rE0Pygv0sEZ4vBWHlAgJLGDU7Pm8xoO6p3wsEceb7GYAjScrOHpEo8KK/eVkAcnSM+slAEtXjA2JpdjLp4fJQQ==", "dev": true }, + "node_modules/@amplitude/analytics-browser": { + "version": "2.11.9", + "resolved": "https://registry.npmjs.org/@amplitude/analytics-browser/-/analytics-browser-2.11.9.tgz", + "integrity": "sha512-FHejpsW3OypNKaIBvMwLm74UUSBcR+VwrBsj7V2VlPDNRdeaFi21kJgVYUW5AcjxTsadMzBQGBb4BarZ4k2+9Q==", + "license": "MIT", + "dependencies": { + "@amplitude/analytics-client-common": "^2.3.5", + "@amplitude/analytics-core": "^2.5.4", + "@amplitude/analytics-remote-config": "^0.4.0", + "@amplitude/analytics-types": "^2.8.4", + "@amplitude/plugin-autocapture-browser": "^1.0.2", + "@amplitude/plugin-page-view-tracking-browser": "^2.3.5", + "tslib": "^2.4.1" + } + }, + "node_modules/@amplitude/analytics-client-common": { + "version": "2.3.5", + "resolved": "https://registry.npmjs.org/@amplitude/analytics-client-common/-/analytics-client-common-2.3.5.tgz", + "integrity": "sha512-BCP+jorfLMAKK/g87fAk4IPP/NzQLMCep+Qe23tqOCWguwTEINYnyzD/GmhaIKXSM2o9pmMLlHbhkA1vXUtF8g==", + "license": "MIT", + "dependencies": { + "@amplitude/analytics-connector": "^1.4.8", + "@amplitude/analytics-core": "^2.5.4", + "@amplitude/analytics-types": "^2.8.4", + "tslib": "^2.4.1" + } + }, "node_modules/@amplitude/analytics-connector": { "version": "1.5.0", "resolved": "https://registry.npmjs.org/@amplitude/analytics-connector/-/analytics-connector-1.5.0.tgz", "integrity": "sha512-T8mOYzB9RRxckzhL0NTHwdge9xuFxXEOplC8B1Y3UX3NHa3BLh7DlBUZlCOwQgMc2nxDfnSweDL5S3bhC+W90g==" }, - "node_modules/@amplitude/types": { - "version": "1.10.2", - "resolved": "https://registry.npmjs.org/@amplitude/types/-/types-1.10.2.tgz", - "integrity": "sha512-I8qenRI7uU6wKNb9LiZrAosSHVoNHziXouKY81CrqxH9xhVTEIJFXeuCV0hbtBr0Al/8ejnGjQRx+S2SvU/pPg==", - "engines": { - "node": ">=10" + "node_modules/@amplitude/analytics-core": { + "version": "2.5.4", + "resolved": "https://registry.npmjs.org/@amplitude/analytics-core/-/analytics-core-2.5.4.tgz", + "integrity": "sha512-J5ZF8hQmxmxM+7bu25a2TfTnk/LQ/oH5FYdg79f1lJ85Aa6oUlCDxgvXwy1RVpwaFjWlZQgV4XVaAUrxtSPRFw==", + "license": "MIT", + "dependencies": { + "@amplitude/analytics-types": "^2.8.4", + "tslib": "^2.4.1" } }, - "node_modules/@amplitude/ua-parser-js": { - "version": "0.7.33", - "resolved": "https://registry.npmjs.org/@amplitude/ua-parser-js/-/ua-parser-js-0.7.33.tgz", - "integrity": "sha512-wKEtVR4vXuPT9cVEIJkYWnlF++Gx3BdLatPBM+SZ1ztVIvnhdGBZR/mn9x/PzyrMcRlZmyi6L56I2J3doVBnjA==", - "funding": [ - { - "type": "opencollective", - "url": "https://opencollective.com/ua-parser-js" - }, - { - "type": "paypal", - "url": "https://paypal.me/faisalman" - } - ], - "engines": { - "node": "*" + "node_modules/@amplitude/analytics-remote-config": { + "version": "0.4.1", + "resolved": "https://registry.npmjs.org/@amplitude/analytics-remote-config/-/analytics-remote-config-0.4.1.tgz", + "integrity": "sha512-BYl6kQ9qjztrCACsugpxO+foLaQIC0aSEzoXEAb/gwOzInmqkyyI+Ub+aWTBih4xgB/lhWlOcidWHAmNiTJTNw==", + "license": "MIT", + "dependencies": { + "@amplitude/analytics-client-common": ">=1 <3", + "@amplitude/analytics-core": ">=1 <3", + "@amplitude/analytics-types": ">=1 <3", + "tslib": "^2.4.1" } }, - "node_modules/@amplitude/utils": { - "version": "1.10.2", - "resolved": "https://registry.npmjs.org/@amplitude/utils/-/utils-1.10.2.tgz", - "integrity": "sha512-tVsHXu61jITEtRjB7NugQ5cVDd4QDzne8T3ifmZye7TiJeUfVRvqe44gDtf55A+7VqhDhyEIIXTA1iVcDGqlEw==", + "node_modules/@amplitude/analytics-types": { + "version": "2.8.4", + "resolved": "https://registry.npmjs.org/@amplitude/analytics-types/-/analytics-types-2.8.4.tgz", + "integrity": "sha512-jQ8WY1aPbpBshl0L/0YEeQn/wZlBr8Jlqc20qf8nbuDuimFy8RqAkE+BVaMI86FCkr3AJ7PjMXkGwCSbUx88CA==", + "license": "MIT" + }, + "node_modules/@amplitude/plugin-autocapture-browser": { + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/@amplitude/plugin-autocapture-browser/-/plugin-autocapture-browser-1.0.3.tgz", + "integrity": "sha512-XUQWUAw9VqtJPlmOyWjnhsEspyVakd9LuSjVNtLjhwlWv+f/yZM1AAQVUdq/Os1+b5OptSgJQ2pPfRJJHZDXTw==", + "license": "MIT", "dependencies": { - "@amplitude/types": "^1.10.2", - "tslib": "^2.0.0" - }, - "engines": { - "node": ">=10" + "@amplitude/analytics-client-common": ">=1 <3", + "@amplitude/analytics-types": "^2.8.2", + "rxjs": "^7.8.1", + "tslib": "^2.4.1" + } + }, + "node_modules/@amplitude/plugin-page-view-tracking-browser": { + "version": "2.3.5", + "resolved": "https://registry.npmjs.org/@amplitude/plugin-page-view-tracking-browser/-/plugin-page-view-tracking-browser-2.3.5.tgz", + "integrity": "sha512-qcV4DLxRAZRriYBNvjc2PGW1EDad6PSsIXmxVs6j8i9fxY2SfdvsFd/Qd23CHj1e6Dt5QpAVJZpUMCEdqqDZbA==", + "license": "MIT", + "dependencies": { + "@amplitude/analytics-client-common": "^2.3.5", + "@amplitude/analytics-types": "^2.8.4", + "tslib": "^2.4.1" } }, "node_modules/@ampproject/remapping": { @@ -5216,12 +5255,6 @@ "integrity": "sha512-vxhUy4J8lyeyinH7Azl1pdd43GJhZH/tP2weN8TntQblOY+A0XbT8DJk1/oCPuOOyg/Ja757rG0CgHcWC8OfMA==", "dev": true }, - "node_modules/@types/amplitude-js": { - "version": "8.16.5", - "resolved": "https://registry.npmjs.org/@types/amplitude-js/-/amplitude-js-8.16.5.tgz", - "integrity": "sha512-W73JfDpwDH4VijOGo+nVuQOqUCiqyEGGVdajU4ziWTLn27cn+QtFuFuBdlhCraIIrO52fDRO4NSOGkawtn77Jw==", - "dev": true - }, "node_modules/@types/aria-query": { "version": "5.0.4", "resolved": "https://registry.npmjs.org/@types/aria-query/-/aria-query-5.0.4.tgz", @@ -6040,19 +6073,6 @@ "url": "https://github.com/sponsors/epoberezkin" } }, - "node_modules/amplitude-js": { - "version": "8.21.9", - "resolved": "https://registry.npmjs.org/amplitude-js/-/amplitude-js-8.21.9.tgz", - "integrity": "sha512-d0jJH00wbXu7sxKtVwkdSXtVffjqdUrxuACKlnzP7jU5qt9wriXXMgHifdH5Oq+buKmyF8wKL9S02gAykysURA==", - "dependencies": { - "@amplitude/analytics-connector": "^1.4.6", - "@amplitude/ua-parser-js": "0.7.33", - "@amplitude/utils": "^1.10.2", - "@babel/runtime": "^7.21.0", - "blueimp-md5": "^2.19.0", - "query-string": "8.1.0" - } - }, "node_modules/ansi-escapes": { "version": "4.3.2", "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-4.3.2.tgz", @@ -6453,11 +6473,6 @@ "url": "https://github.com/sponsors/sindresorhus" } }, - "node_modules/blueimp-md5": { - "version": "2.19.0", - "resolved": "https://registry.npmjs.org/blueimp-md5/-/blueimp-md5-2.19.0.tgz", - "integrity": "sha512-DRQrD6gJyy8FbiE4s+bDoXS9hiW3Vbx5uCdwvcCf3zLHL+Iv7LtGHLpr+GZV8rHG8tK766FGYBwRbu8pELTt+w==" - }, "node_modules/brace-expansion": { "version": "1.1.11", "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz", @@ -7020,14 +7035,6 @@ "integrity": "sha512-VBBaLc1MgL5XpzgIP7ny5Z6Nx3UrRkIViUkPUdtl9aya5amy3De1gsUUSB1g3+3sExYNjCAsAznmukyxCb1GRA==", "dev": true }, - "node_modules/decode-uri-component": { - "version": "0.4.1", - "resolved": "https://registry.npmjs.org/decode-uri-component/-/decode-uri-component-0.4.1.tgz", - "integrity": "sha512-+8VxcR21HhTy8nOt6jf20w0c9CADrw1O8d+VZ/YzzCt4bJ3uBjw+D1q2osAB8RnpwwaeYBxy0HyKQxD5JBMuuQ==", - "engines": { - "node": ">=14.16" - } - }, "node_modules/deep-eql": { "version": "4.1.3", "resolved": "https://registry.npmjs.org/deep-eql/-/deep-eql-4.1.3.tgz", @@ -8226,17 +8233,6 @@ "node": ">=8" } }, - "node_modules/filter-obj": { - "version": "5.1.0", - "resolved": "https://registry.npmjs.org/filter-obj/-/filter-obj-5.1.0.tgz", - "integrity": "sha512-qWeTREPoT7I0bifpPUXtxkZJ1XJzxWtfoWWkdVGqa+eCr3SHW/Ocp89o8vLvbUuQnadybJpjOKu4V+RwO6sGng==", - "engines": { - "node": ">=14.16" - }, - "funding": { - "url": "https://github.com/sponsors/sindresorhus" - } - }, "node_modules/find-up": { "version": "5.0.0", "resolved": "https://registry.npmjs.org/find-up/-/find-up-5.0.0.tgz", @@ -10926,22 +10922,6 @@ "node": ">=6" } }, - "node_modules/query-string": { - "version": "8.1.0", - "resolved": "https://registry.npmjs.org/query-string/-/query-string-8.1.0.tgz", - "integrity": "sha512-BFQeWxJOZxZGix7y+SByG3F36dA0AbTy9o6pSmKFcFz7DAj0re9Frkty3saBn3nHo3D0oZJ/+rx3r8H8r8Jbpw==", - "dependencies": { - "decode-uri-component": "^0.4.1", - "filter-obj": "^5.1.0", - "split-on-first": "^3.0.0" - }, - "engines": { - "node": ">=14.16" - }, - "funding": { - "url": "https://github.com/sponsors/sindresorhus" - } - }, "node_modules/querystringify": { "version": "2.2.0", "resolved": "https://registry.npmjs.org/querystringify/-/querystringify-2.2.0.tgz", @@ -11397,6 +11377,15 @@ "queue-microtask": "^1.2.2" } }, + "node_modules/rxjs": { + "version": "7.8.1", + "resolved": "https://registry.npmjs.org/rxjs/-/rxjs-7.8.1.tgz", + "integrity": "sha512-AA3TVj+0A2iuIoQkWEK/tqFjBq2j+6PO6Y0zJcvzLAFhEFIO3HL0vls9hWLncZbAAbK0mar7oZ4V079I/qPMxg==", + "license": "Apache-2.0", + "dependencies": { + "tslib": "^2.1.0" + } + }, "node_modules/safe-array-concat": { "version": "1.1.2", "resolved": "https://registry.npmjs.org/safe-array-concat/-/safe-array-concat-1.1.2.tgz", @@ -11594,17 +11583,6 @@ "node": ">=0.10.0" } }, - "node_modules/split-on-first": { - "version": "3.0.0", - "resolved": "https://registry.npmjs.org/split-on-first/-/split-on-first-3.0.0.tgz", - "integrity": "sha512-qxQJTx2ryR0Dw0ITYyekNQWpz6f8dGd7vffGNflQQ3Iqj9NJ6qiZ7ELpZsJ/QBhIVAiDfXdag3+Gp8RvWa62AA==", - "engines": { - "node": ">=12" - }, - "funding": { - "url": "https://github.com/sponsors/sindresorhus" - } - }, "node_modules/stackback": { "version": "0.0.2", "resolved": "https://registry.npmjs.org/stackback/-/stackback-0.0.2.tgz", diff --git a/package.json b/package.json index 925e05df..acfe6722 100644 --- a/package.json +++ b/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", diff --git a/src/felles/Header.tsx b/src/felles/Header.tsx index 624a8769..00571bb8 100644 --- a/src/felles/Header.tsx +++ b/src/felles/Header.tsx @@ -8,6 +8,7 @@ import InfoAlert from './header/navigeringsmeny/InfoAlert'; import Navigeringsmeny from './header/navigeringsmeny/Navigeringsmeny'; import useAmplitude from './header/useAmplitude'; import { Rolle } from './tilgangskontroll/Roller'; +import InfoAlertMidlertidigNedetid from './header/navigeringsmeny/InfoAlertMidlertidigNedetid'; const Header = () => { const [mockAktiv] = useLocalStorageToggle('Mock modia'); @@ -24,6 +25,8 @@ const Header = () => { }} /> + + {!harRolle([ Rolle.AD_GRUPPE_REKRUTTERINGSBISTAND_ARBEIDSGIVERRETTET, diff --git a/src/felles/amplitude.ts b/src/felles/amplitude.ts index 97602a53..e18c3c62 100644 --- a/src/felles/amplitude.ts +++ b/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 -): Promise | 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 | 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; +}; diff --git a/src/felles/header/navigeringsmeny/InfoAlertMidlertidigNedetid.tsx b/src/felles/header/navigeringsmeny/InfoAlertMidlertidigNedetid.tsx new file mode 100644 index 00000000..d298e97c --- /dev/null +++ b/src/felles/header/navigeringsmeny/InfoAlertMidlertidigNedetid.tsx @@ -0,0 +1,17 @@ +import { Alert } from '@navikt/ds-react'; +import { FunctionComponent } from 'react'; +import css from './InfoAlert.module.css'; + +const InfoAlertMidlertidigNedetid: FunctionComponent = () => { + return ( +
+ + Rekrutteringsbistand får nedetid fra 14:30 i dag. Vi håper det er oppe igjen i løpet + av en halvtime, men vi kan ikke garantere at alt er ferdig innen det. Det er teknisk + oppdatering. + +
+ ); +}; + +export default InfoAlertMidlertidigNedetid; diff --git a/src/felles/header/useAmplitude.ts b/src/felles/header/useAmplitude.ts index 2be6ffdc..9524fa18 100644 --- a/src/felles/header/useAmplitude.ts +++ b/src/felles/header/useAmplitude.ts @@ -1,22 +1,22 @@ -import { useEffect, useState } from 'react'; import { - setNavKontorForAmplitude, - sendGenerellEvent, AmplitudeEvent, sendEvent, + sendGenerellEvent, + setNavKontorForAmplitude, } from 'felles/amplitude'; -import { generaliserPath } from './utils/path'; +import { useEffect, useState } from 'react'; import { useLocation } from 'react-router-dom'; +import { generaliserPath } from './utils/path'; const useAmplitude = (navKontor: string | null) => { const location = useLocation(); const [harSendtÅpneAppEvent, setHarSendtÅpneAppEvent] = useState(false); useEffect(() => { - const konfigurerAmplitudeOgSendEvents = async (navKontor: string) => { + const konfigurerAmplitudeOgSendEvents = (navKontor: string) => { setNavKontorForAmplitude(navKontor); - await sendGenerellEvent(AmplitudeEvent.Sidevisning, { + sendGenerellEvent(AmplitudeEvent.Sidevisning, { path: generaliserPath(location.pathname), });