chore: remove JS code generated from protos

.github/workflows/main.yml

@@ -32,8 +32,10 @@ jobs:
         with:
           node-version: ${{ matrix.node_version }}
 
-      - name: install yarn
-        run: npm install -g yarn
+      - name: setup protoc
+        uses: arduino/setup-protoc@master
+        with:
+          repo-token: ${{ secrets.GITHUB_TOKEN }}
 
       - name: get yarn cache dir
         id: yarn-cache-dir
@@ -93,5 +95,10 @@ jobs:
         with:
           go-version: '~${{ matrix.go_version }}'
 
+      - name: setup protoc
+        uses: arduino/setup-protoc@master
+        with:
+          repo-token: ${{ secrets.GITHUB_TOKEN }}
+
       - name: build backend binary
         run: make build

.gitignore

@@ -1,6 +1,5 @@
-# generated proxy commands
-https.cert
-https.key
+# generated proto scripts
+/app/src/types/generated
 
 # local environment vars to ignore
 .env*.local

app/package.json

@@ -12,7 +12,8 @@
     "eject": "react-scripts eject",
     "lint": "eslint --ext .ts,.tsx --ignore-path .eslintignore .",
     "tsc": "tsc --noEmit",
-    "protos": "./scripts/build-protos.sh",
+    "postinstall": "yarn protos",
+    "protos": "node ./scripts/build-protos.js",
     "storybook": "start-storybook -p 9009 -s public",
     "build-storybook": "build-storybook -s public"
   },

app/scripts/build-protos.js

@@ -0,0 +1,91 @@
+/* eslint-disable @typescript-eslint/no-var-requires */
+const util = require('util');
+const exec = util.promisify(require('child_process').exec);
+const { promises: fs } = require('fs');
+const { join, sep } = require('path');
+const { platform } = require('os');
+const appPath = join(__dirname, '..');
+
+/** list of proto files and patches to apply */
+const filePatches = {
+  lnd: 'lnrpc: {}',
+  loop: 'looprpc: {}',
+  'google/api/annotations': 'google: { api: {} }',
+  'google/api/http': 'google: { api: {} }',
+};
+
+/**
+ * Executes the `protoc` compiler to convert *.proto files into TS & JS code
+ */
+const generate = async () => {
+  console.log('Compiling protobuf definitions');
+  await fs.mkdir('./src/types/generated', { recursive: true });
+
+  const protocGen = join(
+    appPath,
+    'node_modules',
+    '.bin',
+    platform() === 'win32' ? 'protoc-gen-ts.cmd' : 'protoc-gen-ts',
+  );
+  const protocCmd = [
+    'protoc',
+    `--plugin=protoc-gen-ts=${protocGen}`,
+    '--proto_path=../proto',
+    '--js_out=import_style=commonjs,binary:./src/types/generated',
+    '--ts_out=service=grpc-web:./src/types/generated',
+    ...Object.keys(filePatches).map(file => `../proto/${file}.proto`),
+  ].join(' ');
+
+  console.log(protocCmd);
+  const { stdout, stderr } = await exec(protocCmd, { cwd: appPath });
+  if (stderr) {
+    throw new Error(`exec stderr:\n${stderr}`);
+  }
+  console.log(stdout);
+};
+
+/**
+ * Patches the generated JS files as they contain a type error that prevents webpack from bundling properly.
+ * The code below will prepend the necessary code to resolve the error.
+ * Example: prepends `var proto = { lnrpc: {} };` to lnd_pb.js
+ */
+const patch = async () => {
+  console.log('Patching generated JS files');
+
+  for (const filename of Object.keys(filePatches)) {
+    const patch = [
+      '/* eslint-disable */',
+      `var proto = { ${filePatches[filename]} };`,
+      '',
+    ].join('\n');
+    const path = join(
+      appPath,
+      'src',
+      'types',
+      'generated',
+      `${filename.replace(/\//, sep)}_pb.js`,
+    );
+
+    console.log(` - ${path}`);
+    let content = await fs.readFile(path);
+    content = `${patch}\n${content}`;
+    await fs.writeFile(path, content);
+  }
+};
+
+/**
+ * An async wrapper with error handling around the two funcs above
+ */
+const main = async () => {
+  try {
+    await generate();
+    await patch();
+  } catch (error) {
+    console.error(error);
+  }
+};
+
+/**
+ * execute the main function
+ */
+main();