support-page extension -- part 1

Signed-off-by: Roman <ixrock@gmail.com>

extensions/support-page/main.ts

@@ -0,0 +1,11 @@
+import { LensMainExtension } from "@lens/extensions";
+
+export default class SupportPageMainExtension extends LensMainExtension {
+  async onActivate() {
+    console.log("support page extension activated")
+  }
+
+  async registerAppMenus() {
+    // TODO: allow to modify global menu item "Help -> Support"
+  }
+}

extensions/support-page/package.json

@@ -0,0 +1,23 @@
+{
+  "name": "lens-support-page",
+  "version": "0.1.0",
+  "description": "Lens support page",
+  "main": "dist/main.js",
+  "renderer": "dist/renderer.js",
+  "scripts": {
+    "build": "webpack -p",
+    "dev": "webpack --watch"
+  },
+  "dependencies": {},
+  "devDependencies": {
+    "@types/node": "^14.11.11",
+    "@types/react": "^16.9.53",
+    "@types/webpack": "^4.41.17",
+    "mobx": "^5.15.5",
+    "react": "^16.13.1",
+    "ts-loader": "^8.0.4",
+    "ts-node": "^9.0.0",
+    "typescript": "^4.0.3",
+    "webpack": "^4.44.2"
+  }
+}

extensions/support-page/renderer.tsx

@@ -0,0 +1,7 @@
+import { LensRendererExtension } from "@lens/ui-extensions";
+
+export default class SupportPageRendererExtension extends LensRendererExtension {
+  async onActivate() {
+    console.log("support page extension activated")
+  }
+}

extensions/support-page/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/support-page/webpack.config.ts

@@ -0,0 +1,70 @@
+import path from "path"
+
+const outputPath = path.resolve(__dirname, 'dist');
+
+// TODO: figure out how to share base TS and Webpack configs from Lens (npm, filesystem, etc?)
+export default [
+  {
+    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: outputPath,
+    },
+  },
+  {
+    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: outputPath,
+    },
+  },
+];

package.json

@@ -174,7 +174,8 @@
   },
   "lens": {
     "extensions": [
-      "telemetry"
+      "telemetry",
+      "support-page"
     ]
   },
   "dependencies": {

src/renderer/components/mixins.scss

@@ -6,6 +6,7 @@
 @import "table/table.mixins";
 @import "+network/network-mixins";
 
+// todo: re-use in other places with theming
 @mixin custom-scrollbar-themed($invert: false) {
   @if ($invert) {
     @include custom-scrollbar(dark);