Initial telemetry extension (#1067)

* initial telemetry extension

Signed-off-by: Jari Kolehmainen <jari.kolehmainen@gmail.com>

* Fix preferences saving and default value

Signed-off-by: Lauri Nevala <lauri.nevala@gmail.com>

Co-authored-by: Lauri Nevala <lauri.nevala@gmail.com>

extensions/example-extension/README.md

@@ -5,3 +5,7 @@
 ## Build
 
 `npm run build`
+
+## Dev
+
+`npm run dev`

extensions/example-extension/package.json

@@ -10,7 +10,7 @@
   },
   "scripts": {
     "build": "webpack --config webpack.config.js",
-    "dev": "tsc --watch"
+    "dev": "npm run build --watch"
   },
   "dependencies": {
     "react-open-doodles": "^1.0.5"

extensions/example-extension/renderer.ts

@@ -1,4 +1,4 @@
-import { DynamicPageType, LensRendererExtension, PageStore } from "@lens/ui-extensions";
+import { DynamicPageType, LensRendererExtension, PageRegistry } from "@lens/ui-extensions";
 import { examplePage, ExtensionIcon } from "./page"
 
 export default class ExampleExtension extends LensRendererExtension {
@@ -6,16 +6,18 @@ export default class ExampleExtension extends LensRendererExtension {
     console.log('EXAMPLE EXTENSION RENDERER: ACTIVATED', this.getMeta());
   }
 
-  registerPages(pageStore: PageStore) {
-    this.disposers.push(pageStore.register({
-      type: DynamicPageType.CLUSTER,
-      path: "/extension-example",
-      title: "Example Extension",
-      components: {
-        Page: examplePage(this),
-        MenuIcon: ExtensionIcon,
-      }
-    }))
+  registerPages(registry: PageRegistry) {
+    this.disposers.push(
+      registry.add({
+        type: DynamicPageType.CLUSTER,
+        path: "/extension-example",
+        title: "Example Extension",
+        components: {
+          Page: examplePage(this),
+          MenuIcon: ExtensionIcon,
+        }
+      })
+    )
   }
 
   onDeactivate() {

extensions/telemetry/main.ts

@@ -0,0 +1,16 @@
+import { LensMainExtension } from "@lens/extensions";
+import { TelemetryPreferencesStore } from "./src/telemetry-preferences-store"
+
+export default class TelemetryMainExtension extends LensMainExtension {
+  protected preferencesStore: TelemetryPreferencesStore
+
+  async onActivate() {
+    console.log("telemetry main extension activated")
+    this.preferencesStore = TelemetryPreferencesStore.getInstance<TelemetryPreferencesStore>()
+    await this.preferencesStore.load()
+  }
+
+  onDeactivate() {
+    console.log("telemetry main extension deactivated")
+  }
+}

extensions/telemetry/package.json

@@ -0,0 +1,23 @@
+{
+  "name": "lens-telemetry",
+  "version": "0.1.0",
+  "description": "Lens telemetry",
+  "main": "dist/main.js",
+  "renderer": "dist/renderer.js",
+  "lens": {
+    "metadata": {},
+    "styles": []
+  },
+  "scripts": {
+    "build": "webpack --config webpack.config.js",
+    "dev": "npm run build --watch"
+  },
+  "dependencies": {},
+  "devDependencies": {
+    "ts-loader": "^8.0.4",
+    "typescript": "^4.0.3",
+    "webpack": "^4.44.2",
+    "mobx": "^5.15.5",
+    "react": "^16.13.1"
+  }
+}

extensions/telemetry/renderer.tsx

@@ -0,0 +1,30 @@
+import { AppPreferenceRegistry, LensRendererExtension } from "@lens/ui-extensions";
+import { TelemetryPreferencesStore } from "./src/telemetry-preferences-store"
+import { TelemetryPreferenceHint, TelemetryPreferenceInput } from "./src/telemetry-preference"
+import React from "react"
+
+export default class TelemetryRendererExtension extends LensRendererExtension {
+  protected preferencesStore: TelemetryPreferencesStore
+
+  async onActivate() {
+    console.log("telemetry extension activated")
+    this.preferencesStore = TelemetryPreferencesStore.getInstance<TelemetryPreferencesStore>()
+    await this.preferencesStore.load()
+  }
+
+  registerAppPreferences(registry: AppPreferenceRegistry) {
+    this.disposers.push(
+      registry.add({
+        title: "Telemetry & Usage Tracking",
+        components: {
+          Hint: () => <TelemetryPreferenceHint />,
+          Input: () => <TelemetryPreferenceInput telemetry={this.preferencesStore} />
+        }
+      })
+    )
+  }
+
+  onDeactivate() {
+    console.log("telemetry extension deactivated")
+  }
+}

extensions/telemetry/src/telemetry-preference.tsx

@@ -0,0 +1,26 @@
+import { Checkbox } from "@lens/ui-extensions"
+import React from "react"
+import { observer } from "mobx-react";
+import { TelemetryPreferencesStore } from "./telemetry-preferences-store"
+
+@observer
+export class TelemetryPreferenceInput extends React.Component<{telemetry: TelemetryPreferencesStore}, {}> {
+  render() {
+    const { telemetry } = this.props
+    return (
+      <Checkbox
+        label="Allow telemetry & usage tracking"
+        value={telemetry.enabled}
+        onChange={v => { telemetry.enabled = v; }}
+      />
+    )
+  }
+}
+
+export class TelemetryPreferenceHint extends React.Component {
+  render() {
+    return (
+      <span>Telemetry & usage data is collected to continuously improve the Lens experience.</span>
+    )
+  }
+}

extensions/telemetry/src/telemetry-preferences-store.ts

@@ -0,0 +1,33 @@
+import { BaseStore } from "@lens/extensions";
+import { toJS } from "mobx"
+
+export type TelemetryPreferencesModel = {
+  enabled: boolean;
+}
+
+export class TelemetryPreferencesStore extends BaseStore<TelemetryPreferencesModel> {
+  private constructor() {
+    super({
+      configName: "telemetry-preferences-store",
+      defaults: {
+        enabled: true
+      }
+    })
+  }
+
+  get enabled() {
+    return this.data.enabled
+  }
+
+  set enabled(v: boolean) {
+    this.data.enabled = v
+  }
+
+  toJSON(): TelemetryPreferencesModel {
+    return toJS({
+      enabled: this.data.enabled
+    }, {
+      recurseEverything: true
+    })
+  }
+}

extensions/telemetry/tsconfig.json

@@ -0,0 +1,30 @@
+{
+  "compilerOptions": {
+    "outDir": "dist",
+    "baseUrl": ".",
+    "module": "CommonJS",
+    "target": "ES2017",
+    "lib": ["ESNext", "DOM", "DOM.Iterable"],
+    "moduleResolution": "Node",
+    "sourceMap": false,
+    "declaration": false,
+    "strict": false,
+    "noImplicitAny": true,
+    "skipLibCheck": true,
+    "esModuleInterop": true,
+    "allowSyntheticDefaultImports": true,
+    "experimentalDecorators": true,
+    "jsx": "react",
+    "paths": {
+      "*": [
+        "node_modules/*",
+        "../../types/*"
+      ]
+    }
+  },
+  "include": [
+    "renderer.ts",
+    "../../types/",
+    "src/**/*"
+  ],
+}

extensions/telemetry/webpack.config.js

@@ -0,0 +1,67 @@
+const path = require('path');
+
+module.exports = [
+  {
+    entry: './main.ts',
+    context: __dirname,
+    target: "electron-main",
+    mode: "production",
+    module: {
+      rules: [
+        {
+          test: /\.tsx?$/,
+          use: 'ts-loader',
+          exclude: /node_modules/,
+        },
+      ],
+    },
+    externals: [
+      {
+        "@lens/extensions": "var global.LensExtensions",
+        "react": "var global.React",
+        "mobx": "var global.Mobx"
+      }
+    ],
+    resolve: {
+      extensions: [ '.tsx', '.ts', '.js' ],
+    },
+    output: {
+      libraryTarget: "commonjs2",
+      globalObject: "this",
+      filename: 'main.js',
+      path: path.resolve(__dirname, 'dist'),
+    },
+  },
+  {
+    entry: './renderer.tsx',
+    context: __dirname,
+    target: "electron-renderer",
+    mode: "production",
+    module: {
+      rules: [
+        {
+          test: /\.tsx?$/,
+          use: 'ts-loader',
+          exclude: /node_modules/,
+        },
+      ],
+    },
+    externals: [
+      {
+        "@lens/ui-extensions": "var global.LensExtensions",
+        "@lens/extensions": "var global.LensMainExtensions",
+        "react": "var global.React",
+        "mobx": "var global.Mobx"
+      }
+    ],
+    resolve: {
+      extensions: [ '.tsx', '.ts', '.js' ],
+    },
+    output: {
+      libraryTarget: "commonjs2",
+      globalObject: "this",
+      filename: 'renderer.js',
+      path: path.resolve(__dirname, 'dist'),
+    },
+  },
+];