diff --git a/package-lock.json b/package-lock.json index 4d9184c..6ad57c2 100644 --- a/package-lock.json +++ b/package-lock.json @@ -8,6 +8,8 @@ "name": "react-typescript-app1", "version": "0.1.0", "dependencies": { + "@microsoft/applicationinsights-react-js": "^17.1.2", + "@microsoft/applicationinsights-web": "^3.2.0", "@testing-library/jest-dom": "^5.17.0", "@testing-library/react": "^13.4.0", "@testing-library/user-event": "^13.5.0", @@ -15,6 +17,7 @@ "@types/node": "^16.18.96", "@types/react": "^18.3.0", "@types/react-dom": "^18.3.0", + "dotenv": "^16.4.5", "react": "^18.3.0", "react-dom": "^18.3.0", "react-scripts": "5.0.1", @@ -3236,6 +3239,179 @@ "resolved": "https://registry.npmjs.org/@leichtgewicht/ip-codec/-/ip-codec-2.0.5.tgz", "integrity": "sha512-Vo+PSpZG2/fmgmiNzYK9qWRh8h/CHrwD0mo1h1DzL4yzHNSfWYujGTYsWGreD000gcgmZ7K4Ys6Tx9TxtsKdDw==" }, + "node_modules/@microsoft/applicationinsights-analytics-js": { + "version": "3.2.0", + "resolved": "https://registry.npmjs.org/@microsoft/applicationinsights-analytics-js/-/applicationinsights-analytics-js-3.2.0.tgz", + "integrity": "sha512-cWIODbXfKah+JQ6ObroRDbGfqmG0znudPU0TZm5s50JONSii06tfKpKj1YNY9OlqluS7XnpW4o0M0G+Wk84RPA==", + "dependencies": { + "@microsoft/applicationinsights-common": "3.2.0", + "@microsoft/applicationinsights-core-js": "3.2.0", + "@microsoft/applicationinsights-shims": "3.0.1", + "@microsoft/dynamicproto-js": "^2.0.3", + "@nevware21/ts-utils": ">= 0.11.1 < 2.x" + }, + "peerDependencies": { + "tslib": "*" + } + }, + "node_modules/@microsoft/applicationinsights-cfgsync-js": { + "version": "3.2.0", + "resolved": "https://registry.npmjs.org/@microsoft/applicationinsights-cfgsync-js/-/applicationinsights-cfgsync-js-3.2.0.tgz", + "integrity": "sha512-CEPk8DrjVqkZgkB8IR+jzZJ2Lxk2uc9s3luFSaJOsZr+KdDVOwIYxFVlz0TAdqVEy2GUpI1k+iS0Jkk3E67UpQ==", + "dependencies": { + "@microsoft/applicationinsights-common": "3.2.0", + "@microsoft/applicationinsights-core-js": "3.2.0", + "@microsoft/applicationinsights-shims": "3.0.1", + "@microsoft/dynamicproto-js": "^2.0.3", + "@nevware21/ts-async": ">= 0.5.1 < 2.x", + "@nevware21/ts-utils": ">= 0.11.1 < 2.x" + }, + "peerDependencies": { + "tslib": "*" + } + }, + "node_modules/@microsoft/applicationinsights-channel-js": { + "version": "3.2.0", + "resolved": "https://registry.npmjs.org/@microsoft/applicationinsights-channel-js/-/applicationinsights-channel-js-3.2.0.tgz", + "integrity": "sha512-mNIRZMSrrzigOzSbKflhTndFE/E0IMM07fKDop6ca0Ko6ejWINTlhLVhzjZPYDwoFbPKco+RX+B2NxFC6Fh+1w==", + "dependencies": { + "@microsoft/applicationinsights-common": "3.2.0", + "@microsoft/applicationinsights-core-js": "3.2.0", + "@microsoft/applicationinsights-shims": "3.0.1", + "@microsoft/dynamicproto-js": "^2.0.3", + "@nevware21/ts-async": ">= 0.5.1 < 2.x", + "@nevware21/ts-utils": ">= 0.11.1 < 2.x" + }, + "peerDependencies": { + "tslib": "*" + } + }, + "node_modules/@microsoft/applicationinsights-common": { + "version": "3.2.0", + "resolved": "https://registry.npmjs.org/@microsoft/applicationinsights-common/-/applicationinsights-common-3.2.0.tgz", + "integrity": "sha512-oGTnmeAbl5ymHdbnDYg/GY6ZnJ712yBnCc+3pC9oolBfLxV0E0MsL6miiYDefsKmeZvv5r13FWoxxf6PGAv0Cw==", + "dependencies": { + "@microsoft/applicationinsights-core-js": "3.2.0", + "@microsoft/applicationinsights-shims": "3.0.1", + "@microsoft/dynamicproto-js": "^2.0.3", + "@nevware21/ts-utils": ">= 0.11.1 < 2.x" + }, + "peerDependencies": { + "tslib": "*" + } + }, + "node_modules/@microsoft/applicationinsights-core-js": { + "version": "3.2.0", + "resolved": "https://registry.npmjs.org/@microsoft/applicationinsights-core-js/-/applicationinsights-core-js-3.2.0.tgz", + "integrity": "sha512-QSX0nDWl045k0xZAEpe0LkrAsNquL3bNN19g2ZrSxnP0e248CLa6XdYvdaXd9tphFTJjOcjsPWMFsQm4NmtkuA==", + "dependencies": { + "@microsoft/applicationinsights-shims": "3.0.1", + "@microsoft/dynamicproto-js": "^2.0.3", + "@nevware21/ts-async": ">= 0.5.1 < 2.x", + "@nevware21/ts-utils": ">= 0.11.1 < 2.x" + }, + "peerDependencies": { + "tslib": "*" + } + }, + "node_modules/@microsoft/applicationinsights-dependencies-js": { + "version": "3.2.0", + "resolved": "https://registry.npmjs.org/@microsoft/applicationinsights-dependencies-js/-/applicationinsights-dependencies-js-3.2.0.tgz", + "integrity": "sha512-TJdZkCCgywXGhymAMfUXlKyMDDbMXb8tGoFpTPRbE5YCXRxbYGxTsrJUkvAKKyFIWpVYu7J0+fbEKgW20zlArA==", + "dependencies": { + "@microsoft/applicationinsights-common": "3.2.0", + "@microsoft/applicationinsights-core-js": "3.2.0", + "@microsoft/applicationinsights-shims": "3.0.1", + "@microsoft/dynamicproto-js": "^2.0.3", + "@nevware21/ts-async": ">= 0.5.1 < 2.x", + "@nevware21/ts-utils": ">= 0.11.1 < 2.x" + }, + "peerDependencies": { + "tslib": "*" + } + }, + "node_modules/@microsoft/applicationinsights-properties-js": { + "version": "3.2.0", + "resolved": "https://registry.npmjs.org/@microsoft/applicationinsights-properties-js/-/applicationinsights-properties-js-3.2.0.tgz", + "integrity": "sha512-ebr8i6hhQooGBvTC8Gum+HvUBY8gBv9mEC1jS7ESjEJ0qthukroCGIGtYwg6G+wW3Y+vu86ft+aLScIapFUUrw==", + "dependencies": { + "@microsoft/applicationinsights-common": "3.2.0", + "@microsoft/applicationinsights-core-js": "3.2.0", + "@microsoft/applicationinsights-shims": "3.0.1", + "@microsoft/dynamicproto-js": "^2.0.3", + "@nevware21/ts-utils": ">= 0.11.1 < 2.x" + }, + "peerDependencies": { + "tslib": "*" + } + }, + "node_modules/@microsoft/applicationinsights-react-js": { + "version": "17.1.2", + "resolved": "https://registry.npmjs.org/@microsoft/applicationinsights-react-js/-/applicationinsights-react-js-17.1.2.tgz", + "integrity": "sha512-i98Ep/UQvuLeDWWCWOLuvpF1cACOR98gafpTcOVeZSPKYlUtvFAqx6Xkn7HjjqZklxP9h0Hqjs5dreu4D5nM2A==", + "dependencies": { + "@microsoft/applicationinsights-common": "^3.1.2", + "@microsoft/applicationinsights-core-js": "^3.1.2", + "@microsoft/applicationinsights-shims": "^3.0.1", + "@microsoft/dynamicproto-js": "^2.0.3", + "@nevware21/ts-utils": ">= 0.10.5 < 2.x" + }, + "peerDependencies": { + "history": ">= 4.10.1", + "react": ">= 17.0.1", + "tslib": "*" + } + }, + "node_modules/@microsoft/applicationinsights-shims": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/@microsoft/applicationinsights-shims/-/applicationinsights-shims-3.0.1.tgz", + "integrity": "sha512-DKwboF47H1nb33rSUfjqI6ryX29v+2QWcTrRvcQDA32AZr5Ilkr7whOOSsD1aBzwqX0RJEIP1Z81jfE3NBm/Lg==", + "dependencies": { + "@nevware21/ts-utils": ">= 0.9.4 < 2.x" + } + }, + "node_modules/@microsoft/applicationinsights-web": { + "version": "3.2.0", + "resolved": "https://registry.npmjs.org/@microsoft/applicationinsights-web/-/applicationinsights-web-3.2.0.tgz", + "integrity": "sha512-wc/k9WC5wX+ZOCINDlzBl9V29bCKOWa2e2VgnjYiaxiIayfoCZr0Sx9QHNWbBMBmJbZPOKKSvMVYZhPoq6Oj1Q==", + "dependencies": { + "@microsoft/applicationinsights-analytics-js": "3.2.0", + "@microsoft/applicationinsights-cfgsync-js": "3.2.0", + "@microsoft/applicationinsights-channel-js": "3.2.0", + "@microsoft/applicationinsights-common": "3.2.0", + "@microsoft/applicationinsights-core-js": "3.2.0", + "@microsoft/applicationinsights-dependencies-js": "3.2.0", + "@microsoft/applicationinsights-properties-js": "3.2.0", + "@microsoft/applicationinsights-shims": "3.0.1", + "@microsoft/dynamicproto-js": "^2.0.3", + "@nevware21/ts-async": ">= 0.5.1 < 2.x", + "@nevware21/ts-utils": ">= 0.11.1 < 2.x" + }, + "peerDependencies": { + "tslib": "*" + } + }, + "node_modules/@microsoft/dynamicproto-js": { + "version": "2.0.3", + "resolved": "https://registry.npmjs.org/@microsoft/dynamicproto-js/-/dynamicproto-js-2.0.3.tgz", + "integrity": "sha512-JTWTU80rMy3mdxOjjpaiDQsTLZ6YSGGqsjURsY6AUQtIj0udlF/jYmhdLZu8693ZIC0T1IwYnFa0+QeiMnziBA==", + "dependencies": { + "@nevware21/ts-utils": ">= 0.10.4 < 2.x" + } + }, + "node_modules/@nevware21/ts-async": { + "version": "0.5.1", + "resolved": "https://registry.npmjs.org/@nevware21/ts-async/-/ts-async-0.5.1.tgz", + "integrity": "sha512-O2kN8n2HpDWJ7Oji+oTMnhITrCndmrNvrHbGDwAIBydx+FWvLE/vrw4QwnRRMvSCa2AJrcP59Ryklxv30KfkWQ==", + "dependencies": { + "@nevware21/ts-utils": ">= 0.11.2 < 2.x" + } + }, + "node_modules/@nevware21/ts-utils": { + "version": "0.11.2", + "resolved": "https://registry.npmjs.org/@nevware21/ts-utils/-/ts-utils-0.11.2.tgz", + "integrity": "sha512-80W8BkS09kkGuUHJX50Fqq+QqAslxUaOQytH+3JhRacXs1EpEt2JOOkYKytqFZAYir3SeH9fahniEaDzIBxlUw==" + }, "node_modules/@nicolo-ribaudo/eslint-scope-5-internals": { "version": "5.1.1-v1", "resolved": "https://registry.npmjs.org/@nicolo-ribaudo/eslint-scope-5-internals/-/eslint-scope-5-internals-5.1.1-v1.tgz", @@ -6977,11 +7153,14 @@ } }, "node_modules/dotenv": { - "version": "10.0.0", - "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-10.0.0.tgz", - "integrity": "sha512-rlBi9d8jpv9Sf1klPjNfFAuWDjKLwTIJJ/VxtoTwIR6hnZxcEOQCZg2oIL3MWBYw5GpUDKOEnND7LXTbIpQ03Q==", + "version": "16.4.5", + "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-16.4.5.tgz", + "integrity": "sha512-ZmdL2rui+eB2YwhsWzjInR8LldtZHGDoQ1ugH85ppHKwpUHL7j7rN0Ti9NCnGiQbhaZ11FpR+7ao1dNsmduNUg==", "engines": { - "node": ">=10" + "node": ">=12" + }, + "funding": { + "url": "https://dotenvx.com" } }, "node_modules/dotenv-expand": { @@ -8954,6 +9133,15 @@ "he": "bin/he" } }, + "node_modules/history": { + "version": "5.3.0", + "resolved": "https://registry.npmjs.org/history/-/history-5.3.0.tgz", + "integrity": "sha512-ZqaKwjjrAYUYfLG+htGaIIZ4nioX2L70ZUMIFysS3xvBsSG4x/n1V6TXV3N8ZYNuFGlDirFg32T7B6WOUPDYcQ==", + "peer": true, + "dependencies": { + "@babel/runtime": "^7.7.6" + } + }, "node_modules/hoopy": { "version": "0.1.4", "resolved": "https://registry.npmjs.org/hoopy/-/hoopy-0.1.4.tgz", @@ -14937,6 +15125,14 @@ } } }, + "node_modules/react-scripts/node_modules/dotenv": { + "version": "10.0.0", + "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-10.0.0.tgz", + "integrity": "sha512-rlBi9d8jpv9Sf1klPjNfFAuWDjKLwTIJJ/VxtoTwIR6hnZxcEOQCZg2oIL3MWBYw5GpUDKOEnND7LXTbIpQ03Q==", + "engines": { + "node": ">=10" + } + }, "node_modules/read-cache": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/read-cache/-/read-cache-1.0.0.tgz", diff --git a/package.json b/package.json index a9f3996..71b9301 100644 --- a/package.json +++ b/package.json @@ -3,6 +3,8 @@ "version": "0.1.0", "private": true, "dependencies": { + "@microsoft/applicationinsights-react-js": "^17.1.2", + "@microsoft/applicationinsights-web": "^3.2.0", "@testing-library/jest-dom": "^5.17.0", "@testing-library/react": "^13.4.0", "@testing-library/user-event": "^13.5.0", @@ -10,6 +12,7 @@ "@types/node": "^16.18.96", "@types/react": "^18.3.0", "@types/react-dom": "^18.3.0", + "dotenv": "^16.4.5", "react": "^18.3.0", "react-dom": "^18.3.0", "react-scripts": "5.0.1", diff --git a/src/telemetry.ts b/src/telemetry.ts new file mode 100644 index 0000000..e3583e9 --- /dev/null +++ b/src/telemetry.ts @@ -0,0 +1,54 @@ +import { + ApplicationInsights, + ITelemetryItem, +} from "@microsoft/applicationinsights-web"; +import { ReactPlugin } from "@microsoft/applicationinsights-react-js"; +import { createBrowserHistory } from "history"; + +const history = createBrowserHistory(); + +const reactPlugin = new ReactPlugin(); + +const appInsights = new ApplicationInsights({ + config: { + connectionString: process.env.VITE_APP_AI_INSTRUMENTATION_CONNECTION_STRING, + disableFetchTracking: false, + //enableRequestHeaderTracking: true, // Enable to get request headers in dependency logs + enableResponseHeaderTracking: true, // Enable to get response headers in dependency logs + ignoreHeaders: [ + "Authorization", + "X-API-Key", + "WWW-Authenticate", + "date", + "x-ms-blob-type", + "x-ms-lease-status", + "x-ms-request-id", + "x-ms-version", + "content-type", + "X-Powered-By", + "X-Firefox-Spdy", + "Set-Cookie", + "Request-Context", + "Content-Encoding", + "Access-Control-Allow-Origin", + "Content-Encoding", + "Vary", + ], // Ignore these headers in dependency logs + disableAjaxTracking: false, + enableCorsCorrelation: true, + extensions: [reactPlugin /* debugPluginInstance */], + extensionConfig: { + [reactPlugin.identifier]: { + history, + }, + /* + [DebugPlugin.identifier]: { + trackers: toTrack + } + */ + }, + }, +}); + +appInsights.loadAppInsights(); +export { reactPlugin, appInsights };