[WIP] Metrics

.gitignore

@@ -1,2 +1,3 @@
 node_modules
 dist
+ui-src/.env

manifest.json

@@ -5,6 +5,9 @@
   "main": "dist/code.js",
   "ui": "dist/index.html",
   "editorType": ["figma"],
-  "networkAccess": { "allowedDomains": ["none"] },
+  "networkAccess": {
+    "allowedDomains": ["https://bam.eu01.nr-data.net"],
+    "reasoning": "We use New Relic to monitor the performance of our application and get errors information."
+  },
   "documentAccess": "dynamic-page"
 }

package.json

@@ -23,6 +23,7 @@
   "license": "MPL2.0",
   "dependencies": {
     "@create-figma-plugin/ui": "^3.2",
+    "@newrelic/browser-agent": "^1.269.0",
     "base64-js": "^1.5",
     "classnames": "^2.5",
     "lru-cache": "^11.0",

ui-src/.env.example

@@ -0,0 +1,5 @@
+VITE_ACCOUNT_ID=
+VITE_TRUST_KEY=
+VITE_AGENT_ID=
+VITE_LICENSE_KEY=
+VITE_APPLICATION_ID=

ui-src/context/useFigma.ts

@@ -69,6 +69,8 @@ export const useFigma = (): UseFigmaHook => {
         setExporting(false);
         setStep(undefined);
 
+        window.newrelic.addPageAction('document-exported');
+
         break;
       }
       case 'CUSTOM_FONTS': {

ui-src/main.tsx

@@ -1,3 +1,4 @@
+import { BrowserAgent } from '@newrelic/browser-agent/loaders/browser-agent';
 import 'node_modules/@create-figma-plugin/ui/lib/css/base.css';
 import { StrictMode } from 'react';
 import { createRoot } from 'react-dom/client';
@@ -6,6 +7,38 @@ import { App } from './App';
 import './main.css';
 import './reset.css';
 
+const options = {
+  init: {
+    distributed_tracing: { enabled: false },
+    privacy: { cookies_enabled: true },
+    ajax: { deny_list: ['bam.eu01.nr-data.net'] }
+  },
+  loader_config: {
+    accountID: import.meta.env.VITE_ACCOUNT_ID,
+    trustKey: import.meta.env.VITE_TRUST_KEY,
+    agentID: import.meta.env.VITE_AGENT_ID,
+    licenseKey: import.meta.env.VITE_LICENSE_KEY,
+    applicationID: import.meta.env.VITE_APPLICATION_ID
+  },
+  info: {
+    beacon: 'bam.eu01.nr-data.net',
+    errorBeacon: 'bam.eu01.nr-data.net',
+    licenseKey: import.meta.env.VITE_LICENSE_KEY,
+    applicationID: import.meta.env.VITE_APPLICATION_ID,
+    sa: 1
+  }
+};
+
+new BrowserAgent(options);
+
+declare global {
+  interface Window {
+    newrelic: BrowserAgent;
+  }
+}
+
+window.newrelic.addPageAction('plugin-loaded');
+
 createRoot(document.getElementById('root') as HTMLElement).render(
   <StrictMode>
     <App />

ui-src/vite-env.d.ts

@@ -1,2 +1,11 @@
 /// <reference types="vite/client" />
 /// <reference types="vite-plugin-svgr/client" />
+declare module ViteEnv {
+  interface ImportMetaEnv {
+    VITE_NR_ACCOUNT_ID: string;
+    VITE_NR_TRUST_KEY: string;
+    VITE_NR_AGENT_ID: string;
+    VITE_NR_LICENSE_KEY: string;
+    VITE_NR_APPLICATION_ID: string;
+  }
+}