💚 Made AppInsights configuration consistent with latest

.env.template

@@ -12,4 +12,4 @@ CRM_SCOPE=#{CRM_SCOPE}
 CRM_VIEW_CURRENT=#{CRM_VIEW_CURRENT}
 CRM_VIEW_PAST=#{CRM_VIEW_PAST}
 RULESWIDGET_APPINSIGHTS_INSTRUMENTATIONKEY=#{APPINSIGHTS_INSTRUMENTATIONKEY}
-APPINSIGHTS_INSTRUMENTATIONKEY=#{APPINSIGHTS_INSTRUMENTATIONKEY}
+APPLICATIONINSIGHTS_CONNECTION_STRING=#{APPLICATIONINSIGHTS_CONNECTION_STRING}

.github/workflows/template-build.yml

@@ -40,7 +40,7 @@ jobs:
           CRM_SCOPE: ${{ secrets.CRM_SCOPE }}
           CRM_VIEW_CURRENT: ${{ secrets.CRM_VIEW_CURRENT }}
           CRM_VIEW_PAST: ${{ secrets.CRM_VIEW_PAST }}
-          APPINSIGHTS_INSTRUMENTATIONKEY: ${{ secrets.APPINSIGHTS_INSTRUMENTATIONKEY }}
+          APPLICATIONINSIGHTS_CONNECTION_STRING: ${{ secrets.APPLICATIONINSIGHTS_CONNECTION_STRING }}
           RULESWIDGET_APPINSIGHTS_INSTRUMENTATIONKEY: ${{ secrets.RULESWIDGET_APPINSIGHTS_INSTRUMENTATIONKEY }}
           CHINA_BUILD: FALSE
           VERSION_DEPLOYED: ${{ github.run_number }}

Readme.md

@@ -17,7 +17,7 @@ This is a Gatsby generated site pulling data from:
 
 ### Required Tools
 
-- Install nodejs via <https://nodejs.org/en/> (LTS Version)
+- Install nodejs via <https://nodejs.org/en/> (LTS Version, last tested with 20)
 - Install yarn via <https://yarnpkg.com/lang/en/docs/install/> (Used for package management)
 - Package dependencies (Windows)
   - Python 3
@@ -47,7 +47,7 @@ This is a Gatsby generated site pulling data from:
   CRM_SCOPE=
   CRM_VIEW_CURRENT=
   CRM_VIEW_PAST=
-  APPINSIGHTS_INSTRUMENTATIONKEY=#{APPINSIGHTS_INSTRUMENTATIONKEY}
+  APPLICATIONINSIGHTS_CONNECTION_STRING=#{APPLICATIONINSIGHTS_CONNECTION_STRING}
   ```
 
 ### Development

gatsby-browser.js

@@ -4,30 +4,55 @@ import AppProvider from 'store/provider';
 // import { isChinaBuild } from 'helpers/chinaHelper';
 // import axios from 'axios';
 import { ApplicationInsights } from '@microsoft/applicationinsights-web';
+import { SeverityLevel } from '@microsoft/applicationinsights-web';
 // import { siteUrlCn } from './site-config.js';
 
-const instrumentationKey = process.env.APPINSIGHTS_INSTRUMENTATIONKEY;
-
-if (!instrumentationKey) {
+const environment = process.env.NODE_ENV;
+const appInsightsConnectionString = process.env.APPLICATIONINSIGHTS_CONNECTION_STRING;
+if (!appInsightsConnectionString) {
+  /* eslint-disable no-console */
+  console.warn('APPLICATIONINSIGHTS_CONNECTION_STRING is not set');
+} else if (environment === 'development') {
   /* eslint-disable no-console */
-  console.warn('APPINSIGHTS_INSTRUMENTATIONKEY is not set');
+  console.info('Application Insights is disabled in development mode');
 } else {
   try {
     const appInsights = new ApplicationInsights({
       config: {
-        instrumentationKey,
+        connectionString: appInsightsConnectionString,
+        disableCorrelationHeaders: false
       },
     });
+
     appInsights.loadAppInsights();
     appInsights.addTelemetryInitializer((item) => {
       item.tags['ai.cloud.role'] = 'SSW.People-StaticClientPage';
+      item.data = item.data || {};
+      item.data.environment = environment;
+    });
+
+    // Additional telemetry for unhandled errors and promise rejections
+    window.addEventListener('error', (event) => {
+      appInsights.trackException({
+        error: event.error,
+        severityLevel: SeverityLevel.Error
+      });
     });
+
+    window.addEventListener('unhandledrejection', (event) => {
+      appInsights.trackException({
+        error: event.reason,
+        severityLevel: SeverityLevel.Error
+      });
+    });
+
     appInsights.trackPageView(); // Manually call trackPageView to establish the current user/session/pageview
   } catch (error) {
     /* eslint-disable no-console */
     console.error('Error initializing Application Insights', error);
   }
 }
+
 // React Context in Browser
 // eslint-disable-next-line react/prop-types
 export const wrapRootElement = ({ element }) => {

gatsby-node.js

@@ -9,17 +9,28 @@ const appInsights = require('applicationinsights');
 const fs = require('fs');
 const siteconfig = require('./site-config');
 
-if (process.env.APPINSIGHTS_INSTRUMENTATIONKEY) {
-  // Log build time stats to appInsights
-  appInsights
-    .setup()
-    .setAutoCollectConsole(true, true) // Enable logging of console.xxx
-    .start();
-} else {
+const environment = process.env.NODE_ENV;
+const appInsightsConnectionString = process.env.APPLICATIONINSIGHTS_CONNECTION_STRING;
+if (!appInsightsConnectionString) {
   // eslint-disable-next-line no-console
-  console.warn(
-    'Missing APPINSIGHTS_INSTRUMENTATIONKEY, this build will not be logged to Application Insights'
-  );
+  console.warn('Missing APPLICATIONINSIGHTS_CONNECTION_STRING, this build will not be logged to Application Insights');
+} else if (environment === 'development') {
+  /* eslint-disable no-console */
+  console.info('Application Insights is disabled in development mode');
+} else {
+  // Log build time stats to appInsights
+  const config = appInsights
+    .setup(appInsightsConnectionString)
+    .setAutoCollectConsole(true, true); // Enable logging of console.xxx
+
+  const client = appInsights.defaultClient;
+
+  // Add a telemetry initializer if needed
+  client.addTelemetryProcessor((envelope, contextObjects) => {
+    envelope.tags[appInsights.defaultClient.context.keys.cloudRole] = 'GatsbyBuildProcess';
+  });
+
+  config.start();
 }
 
 let assetsManifest = {};