Add Telemetry Reporting

.gitignore

@@ -18,6 +18,7 @@ yarn-error.log
 vscode.lsif
 vscode.db
 .vscode-test
+.vscode-test-web
 /.profile-oss
 test/.wdio-vscode-service
 test/screenshots

package.json

@@ -119,6 +119,7 @@
     "lit": "^2.3.0",
     "rollup-plugin-multi-input": "^1.3.1",
     "rxjs": "^7.5.6",
-    "tangle": "^2.1.0"
+    "tangle": "^2.1.0",
+    "vscode-telemetry": "^0.2.0"
   }
 }

rollup.config.mjs

@@ -1,7 +1,7 @@
 import fs from 'fs/promises';
 import resolve from '@rollup/plugin-node-resolve';
 import typescript from '@rollup/plugin-typescript';
-import nodePolyfills from 'rollup-plugin-node-polyfills'
+import nodePolyfills from 'rollup-plugin-node-polyfills';
 import eta from 'rollup-plugin-eta';
 
 const pkg = JSON.parse((await fs.readFile('package.json')).toString());
@@ -14,7 +14,7 @@ export default [{
             file: './out/webview.js',
             format: 'esm',
             sourcemap: true,
-        },
+        }
     ],
     plugins: [
         typescript({
@@ -30,7 +30,7 @@ export default [{
             dir: 'out',
             format: 'cjs',
             sourcemap: true,
-        },
+        }
     ],
     plugins: [
         typescript({ tsconfig: './tsconfig.json' }),
@@ -45,7 +45,8 @@ export default [{
             file: './out/web.js',
             format: 'cjs',
             sourcemap: true,
-        },
+            inlineDynamicImports: true
+        }
     ],
     external: ['vscode'],
     plugins: [

src/components/events.ts

@@ -7,6 +7,7 @@ import {
     LitElement
 } from 'lit';
 import { customElement } from 'lit/decorators.js';
+import { TelemetryReporter } from 'vscode-telemetry/webview';
 import type { Webview } from 'vscode';
 
 import { vscode, config } from './constants';
@@ -16,6 +17,8 @@ interface TangleEvents {
     ring?: boolean
 }
 
+const reporter = TelemetryReporter.configure(vscode);
+
 @customElement('app-events')
 export class Events extends LitElement {
     private _notifications = config.defaultNotifications;
@@ -79,6 +82,7 @@ export class Events extends LitElement {
     }
 
     private _ringBell() {
+        reporter.sendTelemetryEvent('bellRinged');
         this._client.emit('ring', true);
     }
 }

src/components/settings.ts

@@ -7,6 +7,7 @@ import {
 import { customElement } from 'lit/decorators.js';
 import Channel from 'tangle/webviews';
 import { Checkbox } from '@vscode/webview-ui-toolkit';
+import { TelemetryReporter } from 'vscode-telemetry/webview';
 import type { Client } from 'tangle';
 import type { Webview } from 'vscode';
 
@@ -25,6 +26,8 @@ const LABELS = {
     replaceTabsWithSpaces: 'Replace Tabs with Spaces'
 };
 
+const reporter = TelemetryReporter.configure(vscode);
+
 @customElement('app-settings')
 export class Settings extends LitElement {
     private _client: Client<State>;
@@ -72,6 +75,7 @@ export class Settings extends LitElement {
     private _updateState (ev: CustomEvent) {
         const elem = ev.composedPath()[0] as Checkbox;
         const state = elem.id as keyof typeof this._state;
+        reporter.sendTelemetryEvent('checkboxChecked', { checked: elem.checked ? 'Yes' : 'no' });
         this._client.broadcast({
             ...this._state,
             ...{ [state]: elem.checked }

src/controller/extension.ts

@@ -2,6 +2,7 @@ import vscode from "vscode";
 import { EventEmitter } from 'events';
 
 import Channel from 'tangle/webviews';
+import { createWebviewTelemetryPanel } from 'vscode-telemetry';
 
 import TodoAppPanel from "../webview/todoApp";
 import { getHtmlForWebview } from '../utils';
@@ -32,7 +33,7 @@ export default class ExtensionController implements vscode.Disposable {
         this._examplePanel2 = new TodoAppPanel(this._context, 'panel2');
         this._disposables.push(vscode.window.registerWebviewViewProvider('panel2', this._examplePanel2));
 
-        this._webviewPanel = vscode.window.createWebviewPanel(
+        this._webviewPanel = createWebviewTelemetryPanel(
             'column-one',
             'Example WebView Panel',
             vscode.ViewColumn.One,

src/index.ts

@@ -1,8 +1,12 @@
 import vscode from "vscode";
+import { TelemetryReporter } from 'vscode-telemetry';
+
 import ExtensionController from './controller/extension';
 import { cmdCtrlReady, cmdGetController } from './constants';
 
 export async function activate(context: vscode.ExtensionContext) {
+    TelemetryReporter.configure(context, '66346d45-9df3-4d44-bd46-f3c9e01071ce');
+    TelemetryReporter.sendTelemetryEvent('ExtensionActivated');
     const controller = new ExtensionController(context);
     await controller.activate();
 }

src/webview/todoApp.ts

@@ -5,19 +5,22 @@ import {
     ExtensionContext
 } from 'vscode';
 import { Subject } from "rxjs";
+import { TelemetryViewProvider } from 'vscode-telemetry';
 
 import { webviewOptions } from '../constants';
 import { getHtmlForWebview } from '../utils';
 
-export default class TodoAppPanel implements WebviewViewProvider {
+export default class TodoAppPanel extends TelemetryViewProvider implements WebviewViewProvider {
     private _webview = new Subject<Webview>();
 
     constructor(
         private readonly _context: ExtensionContext,
         public readonly identifier: string
-    ) {}
+    ) {
+        super();
+    }
 
-    async resolveWebviewView(webviewView: WebviewView): Promise<void> {
+    async resolveWebviewTelemetryView(webviewView: WebviewView): Promise<void> {
         webviewView.webview.html = await getHtmlForWebview(webviewView.webview, this._context.extensionUri);
         webviewView.webview.options = {
             ...webviewOptions,

yarn.lock

@@ -146,6 +146,42 @@
   resolved "https://registry.yarnpkg.com/@lit/reactive-element/-/reactive-element-1.4.0.tgz#78ed05eb9b750e8e3671a61a30c19198e4038f80"
   integrity sha512-blrtlLKvtVyjTJ3gUHWNSHOU6tD8be9mRafqtnO7GVMcB+5z4RjNcO0DpMGmccK6N8yur1vVVYnS0gPdQ/WgEQ==
 
+"@microsoft/[email protected]", "@microsoft/1ds-core-js@^3.2.3":
+  version "3.2.6"
+  resolved "https://registry.yarnpkg.com/@microsoft/1ds-core-js/-/1ds-core-js-3.2.6.tgz#8a77909f89f991aa2f0b4ae8825c75042962e68e"
+  integrity sha512-6OpppYCEA+rXjcs2w0KnWji3Y6ZDx0wykY7ZL3QF68NS323C45GHSpkDpVRT/lDU6Xbau/PvQm2zTYAzLcperA==
+  dependencies:
+    "@microsoft/applicationinsights-core-js" "2.8.6"
+    "@microsoft/applicationinsights-shims" "^2.0.1"
+    "@microsoft/dynamicproto-js" "^1.1.6"
+
+"@microsoft/1ds-post-js@^3.2.3":
+  version "3.2.6"
+  resolved "https://registry.yarnpkg.com/@microsoft/1ds-post-js/-/1ds-post-js-3.2.6.tgz#cdfa74acfc3205c0a5b79925284d6d166aa43901"
+  integrity sha512-Zdyl3FU6kU/a7TlVVSTBZg+hSECTT65iI99FsjMOx88HudyVyk9M/0lVbA+FVXvGaxzmtBW6Lw0qRHYp4tBMSA==
+  dependencies:
+    "@microsoft/1ds-core-js" "3.2.6"
+    "@microsoft/applicationinsights-shims" "^2.0.1"
+    "@microsoft/dynamicproto-js" "^1.1.6"
+
+"@microsoft/[email protected]":
+  version "2.8.6"
+  resolved "https://registry.yarnpkg.com/@microsoft/applicationinsights-core-js/-/applicationinsights-core-js-2.8.6.tgz#4f0f9ad809aacfc96cb882139b69b3625519c51a"
+  integrity sha512-rL+ceda1Y6HaHBe1vIbNT/f5JGuHiD5Ydq+DoAfu56o13wyJu4sao3QKaabgaIM59pPO+3BMeGsK8NNUGYaT3w==
+  dependencies:
+    "@microsoft/applicationinsights-shims" "2.0.1"
+    "@microsoft/dynamicproto-js" "^1.1.6"
+
+"@microsoft/[email protected]", "@microsoft/applicationinsights-shims@^2.0.1":
+  version "2.0.1"
+  resolved "https://registry.yarnpkg.com/@microsoft/applicationinsights-shims/-/applicationinsights-shims-2.0.1.tgz#5d72fb7aaf4056c4fda54f9d7c93ccf8ca9bcbfd"
+  integrity sha512-G0MXf6R6HndRbDy9BbEj0zrLeuhwt2nsXk2zKtF0TnYo39KgYqhYC2ayIzKPTm2KAE+xzD7rgyLdZnrcRvt9WQ==
+
+"@microsoft/dynamicproto-js@^1.1.6":
+  version "1.1.6"
+  resolved "https://registry.yarnpkg.com/@microsoft/dynamicproto-js/-/dynamicproto-js-1.1.6.tgz#6fe03468862861f5f88ac4c3959a652b3797f1bc"
+  integrity sha512-D1Oivw1A4bIXhzBIy3/BBPn3p2On+kpO2NiYt9shICDK7L/w+cR6FFBUsBZ05l6iqzTeL+Jm8lAYn0g6G7DmDg==
+
 "@microsoft/fast-element@^1.10.5", "@microsoft/fast-element@^1.6.2", "@microsoft/fast-element@^1.9.0":
   version "1.10.5"
   resolved "https://registry.yarnpkg.com/@microsoft/fast-element/-/fast-element-1.10.5.tgz#0ccedb56bd1fa9d981acb33665d074abb3bf76f5"
@@ -615,6 +651,14 @@
   resolved "https://registry.yarnpkg.com/@vscode/codicons/-/codicons-0.0.32.tgz#9e27de90d509c69762b073719ba3bf46c3cd2530"
   integrity sha512-3lgSTWhAzzWN/EPURoY4ZDBEA80OPmnaknNujA3qnI4Iu7AONWd9xF3iE4L+4prIe8E3TUnLQ4pxoaFTEEZNwg==
 
+"@vscode/extension-telemetry@^0.6.2":
+  version "0.6.2"
+  resolved "https://registry.yarnpkg.com/@vscode/extension-telemetry/-/extension-telemetry-0.6.2.tgz#b86814ee680615730da94220c2b03ea9c3c14a8e"
+  integrity sha512-yb/wxLuaaCRcBAZtDCjNYSisAXz3FWsSqAha5nhHcYxx2ZPdQdWuZqVXGKq0ZpHVndBWWtK6XqtpCN2/HB4S1w==
+  dependencies:
+    "@microsoft/1ds-core-js" "^3.2.3"
+    "@microsoft/1ds-post-js" "^3.2.3"
+
 "@vscode/test-electron@^2.1.3", "@vscode/test-electron@^2.1.5":
   version "2.1.5"
   resolved "https://registry.yarnpkg.com/@vscode/test-electron/-/test-electron-2.1.5.tgz#ac98f8f445ea4590753f5fa0c7f6e4298f08c3b7"
@@ -5361,6 +5405,16 @@ vsce@^2.10.0:
     yauzl "^2.3.1"
     yazl "^2.2.2"
 
+vscode-telemetry@^0.2.0:
+  version "0.2.0"
+  resolved "https://registry.yarnpkg.com/vscode-telemetry/-/vscode-telemetry-0.2.0.tgz#c76eb91017764842069660219f62a128c2e91826"
+  integrity sha512-bWMbbyPuJo7lNea6GzVk5KmLmvsk1VKbVdGLlxi7PD9VEzUUUKq4vQwAfn2KyoD5UUfSupT6Q3nBBN7vQkuNnA==
+  dependencies:
+    "@types/vscode" "^1.70.0"
+    "@types/vscode-webview" "^1.57.0"
+    "@vscode/extension-telemetry" "^0.6.2"
+    tangle "^2.1.0"
+
 vscode-uri@^3.0.3:
   version "3.0.3"
   resolved "https://registry.yarnpkg.com/vscode-uri/-/vscode-uri-3.0.3.tgz#a95c1ce2e6f41b7549f86279d19f47951e4f4d84"