Add New Relic browser agent for monitoring

- Add @newrelic/browser-agent dependency - Initialize browser agent in webApp.ts with distributed tracing enabled 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
2026-01-03 07:15:18 -06:00 · 2026-01-03 07:15:18 -06:00 · 960c64984e
commit 960c64984e
parent d79f4efa98
3 changed files with 124 additions and 3 deletions
--- a/package-lock.json
+++ b/package-lock.json
@ -1,12 +1,12 @@
 {
  "name": "immersive",
-  "version": "0.0.8-41",
+  "version": "0.0.8-45",
  "lockfileVersion": 3,
  "requires": true,
  "packages": {
    "": {
      "name": "immersive",
-      "version": "0.0.8-41",
+      "version": "0.0.8-45",
      "license": "MIT",
      "dependencies": {
        "@auth0/auth0-react": "^2.2.4",
@ -24,6 +24,7 @@
        "@mantine/form": "^7.17.8",
        "@mantine/hooks": "^7.17.8",
        "@maptiler/client": "1.8.1",
+        "@newrelic/browser-agent": "^1.306.0",
        "@picovoice/cobra-web": "^2.0.3",
        "@picovoice/eagle-web": "^1.0.0",
        "@picovoice/web-voice-processor": "^4.0.9",
@ -1048,6 +1049,60 @@
        "quick-lru": "^7.0.0"
      }
    },
+    "node_modules/@newrelic/browser-agent": {
+      "version": "1.306.0",
+      "resolved": "https://registry.npmjs.org/@newrelic/browser-agent/-/browser-agent-1.306.0.tgz",
+      "integrity": "sha512-P/mmYrsCgydVeGBDdzurOmZEnIMefybZ/QAyZ3SgBf/oZXeV1l0p66XGuVRZrs5oRm04/201U+JGeumi4x95RA==",
+      "dependencies": {
+        "@newrelic/rrweb": "1.0.1",
+        "fflate": "0.8.2",
+        "web-vitals": "4.2.4"
+      },
+      "engines": {
+        "node": ">=12.17.0 < 13.0.0 || >=13.7.0"
+      }
+    },
+    "node_modules/@newrelic/rrdom": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/@newrelic/rrdom/-/rrdom-1.0.1.tgz",
+      "integrity": "sha512-nfO0ZnyqIta4gnKmcoAyP03o7Jc+EAj0TyJPq91gwNXkzbHSazDM0uWXj2KCCXFqx3KLu68cFbkcJXb8/piqTw==",
+      "dependencies": {
+        "@newrelic/rrweb-snapshot": "^1.0.1"
+      }
+    },
+    "node_modules/@newrelic/rrweb": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/@newrelic/rrweb/-/rrweb-1.0.1.tgz",
+      "integrity": "sha512-qr6JbjamTPYfkJazf+Rpd4AGPgWuJ2V4L2rdpPXzA5GiBx8eFkujJpDV+20hNzxhIYvoLxC1tqfejDVq9qNM7g==",
+      "dependencies": {
+        "@newrelic/rrdom": "^1.0.1",
+        "@newrelic/rrweb-snapshot": "^1.0.1",
+        "@newrelic/rrweb-types": "^1.0.1",
+        "@newrelic/rrweb-utils": "^1.0.1",
+        "@types/css-font-loading-module": "0.0.7",
+        "@xstate/fsm": "^1.4.0",
+        "base64-arraybuffer": "^1.0.1",
+        "mitt": "^3.0.0"
+      }
+    },
+    "node_modules/@newrelic/rrweb-snapshot": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/@newrelic/rrweb-snapshot/-/rrweb-snapshot-1.0.1.tgz",
+      "integrity": "sha512-nOx5UqbRkc0g5rbX1JeVUi3Qnb7QDvGsuxKVo2ZbxHVrCjW8nwM/jsHKpNVZ+1mf95Nmhoxzu4pZIOXp4Dt4ZQ==",
+      "dependencies": {
+        "postcss": "^8.4.38"
+      }
+    },
+    "node_modules/@newrelic/rrweb-types": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/@newrelic/rrweb-types/-/rrweb-types-1.0.1.tgz",
+      "integrity": "sha512-NPllHLTkmXyRNMwItuCl3kOQvWUH7Y6homnxnHDgINLsM2ohRYuQyN32UssAV1zi7JqDgCszsK4X/47+J8hyKg=="
+    },
+    "node_modules/@newrelic/rrweb-utils": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/@newrelic/rrweb-utils/-/rrweb-utils-1.0.1.tgz",
+      "integrity": "sha512-2twM2sR6LQWWUZOqXyWR27eREqIyIfx4PKivAt9vsYrxh1M32dWs6zYv4f/d397FweVkWT00cvxo3w03kKnQcw=="
+    },
    "node_modules/@nodelib/fs.scandir": {
      "version": "2.1.5",
      "resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz",
@ -1392,6 +1447,11 @@
        "react": ">= 16"
      }
    },
+    "node_modules/@types/css-font-loading-module": {
+      "version": "0.0.7",
+      "resolved": "https://registry.npmjs.org/@types/css-font-loading-module/-/css-font-loading-module-0.0.7.tgz",
+      "integrity": "sha512-nl09VhutdjINdWyXxHWN/w9zlNCfr60JUqJbd24YXUuCwgeL0TpFSdElCwb6cxfB6ybE19Gjj4g0jsgkXxKv1Q=="
+    },
    "node_modules/@types/debug": {
      "version": "4.1.12",
      "resolved": "https://registry.npmjs.org/@types/debug/-/debug-4.1.12.tgz",
@ -1567,6 +1627,11 @@
      "resolved": "https://registry.npmjs.org/@xobotyi/scrollbar-width/-/scrollbar-width-1.9.5.tgz",
      "integrity": "sha512-N8tkAACJx2ww8vFMneJmaAgmjAG1tnVBZJRLRcx061tmsLRZHSEZSLuGWnwPtunsSLvSqXQ2wfp7Mgqg1I+2dQ=="
    },
+    "node_modules/@xstate/fsm": {
+      "version": "1.6.5",
+      "resolved": "https://registry.npmjs.org/@xstate/fsm/-/fsm-1.6.5.tgz",
+      "integrity": "sha512-b5o1I6aLNeYlU/3CPlj/Z91ybk1gUsKT+5NAJI+2W4UjvS5KLG28K9v5UvNoFVjHV8PajVZ00RH3vnjyQO7ZAw=="
+    },
    "node_modules/abort-controller": {
      "version": "3.0.0",
      "resolved": "https://registry.npmjs.org/abort-controller/-/abort-controller-3.0.0.tgz",
@ -1778,6 +1843,14 @@
        "node": "*"
      }
    },
+    "node_modules/base64-arraybuffer": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/base64-arraybuffer/-/base64-arraybuffer-1.0.2.tgz",
+      "integrity": "sha512-I3yl4r9QB5ZRY3XuJVEPfc2XhZO6YweFPI+UovAzn+8/hb3oJ6lnysaFcjVpkCPfVWFUDvoZ8kmVDP7WyRtYtQ==",
+      "engines": {
+        "node": ">= 0.6.0"
+      }
+    },
    "node_modules/base64-js": {
      "version": "1.5.1",
      "resolved": "https://registry.npmjs.org/base64-js/-/base64-js-1.5.1.tgz",
@ -3572,6 +3645,11 @@
        "node": ">=8"
      }
    },
+    "node_modules/fflate": {
+      "version": "0.8.2",
+      "resolved": "https://registry.npmjs.org/fflate/-/fflate-0.8.2.tgz",
+      "integrity": "sha512-cPJU47OaAoCbg0pBvzsgpTPhmhqI5eJjh/JIu8tPj5q+T7iLvW/JAYUqmE7KOB4R1ZyEhzBaIQpQpardBF5z8A=="
+    },
    "node_modules/fill-range": {
      "version": "7.1.1",
      "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.1.1.tgz",
@ -4814,6 +4892,11 @@
        "url": "https://github.com/sponsors/ljharb"
      }
    },
+    "node_modules/mitt": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/mitt/-/mitt-3.0.1.tgz",
+      "integrity": "sha512-vKivATfr97l2/QBCYAkXYDbrIWPM2IIKEl7YPhjCvKlG3kE2gm+uBo6nEXK3M5/Ffh/FLpKExzOQ3JJoJGFKBw=="
+    },
    "node_modules/mkdirp": {
      "version": "0.5.6",
      "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.6.tgz",
@ -5237,7 +5320,6 @@
      "version": "8.4.41",
      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.41.tgz",
      "integrity": "sha512-TesUflQ0WKZqAvg52PWL6kHgLKP6xB6heTOdoYM0Wt2UHyxNa4K25EZZMgKns3BH1RLVbZCREPpLY0rhnNoHVQ==",
-      "dev": true,
      "funding": [
        {
          "type": "opencollective",
@ -7753,6 +7835,11 @@
      "resolved": "https://registry.npmjs.org/vuvuzela/-/vuvuzela-1.0.3.tgz",
      "integrity": "sha512-Tm7jR1xTzBbPW+6y1tknKiEhz04Wf/1iZkcTJjSFcpNko43+dFW6+OOeQe9taJIug3NdfUAjFKgUSyQrIKaDvQ=="
    },
+    "node_modules/web-vitals": {
+      "version": "4.2.4",
+      "resolved": "https://registry.npmjs.org/web-vitals/-/web-vitals-4.2.4.tgz",
+      "integrity": "sha512-r4DIlprAGwJ7YM11VZp4R884m0Vmgr6EAKe3P+kO0PPj3Unqyvv59rczf6UiGcb9Z8QxZVcqKNwv/g0WNdWwsw=="
+    },
    "node_modules/webidl-conversions": {
      "version": "3.0.1",
      "resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-3.0.1.tgz",
--- a/package.json
+++ b/package.json
@ -40,6 +40,7 @@
    "@types/node": "^18.14.0",
    "@types/react": "^18.2.72",
    "@types/react-dom": "^18.2.22",
+    "@newrelic/browser-agent": "^1.306.0",
    "axios": "^1.10.0",
    "canvas-hypertxt": "1.0.3",
    "cors": "^2.8.5",
--- a/src/webApp.ts
+++ b/src/webApp.ts
@ -1,3 +1,36 @@
+import { BrowserAgent } from '@newrelic/browser-agent/loaders/browser-agent'
+// Remaining import statements
+
+// Populate using values from NerdGraph
+const options = {
+    init: {
+        distributed_tracing: { enabled: true },
+        performance: { capture_measures: true },
+        browser_consent_mode: { enabled: false },
+        privacy: { cookies_enabled: true },
+        ajax: { deny_list: ["bam.nr-data.net"] }
+    },
+    loader_config: {
+        accountID: "7354964",
+        trustKey: "7354964",
+        agentID: "601611442",
+        licenseKey: "NRBR-755e4b6fdb9ac53dc04",
+        applicationID: "601611442"
+    },
+    info: {
+        beacon: "bam.nr-data.net",
+        errorBeacon: "bam.nr-data.net",
+        licenseKey: "NRBR-755e4b6fdb9ac53dc04",
+        applicationID: "601611442",
+        sa: 1
+    }
+};
+
+// The agent loader code executes immediately on instantiation.
+const nrba = new BrowserAgent(options)
+
+// Remaining code
+
 import * as ReactDOM from "react-dom/client";
 import WebApp from "./react/webApp";