Update dependencies and support darwin-arm64 (Apple M1) (#444)

* pkg: update dependencies webpack/babel/electron

* webpack: update configs to migrate to webpack 5

* pkg: update babel config for updated electron

* app: stub globalThis for global

* sentry: bypass check for isPackaged in renderer: electron / remote

* app: replace electron.remote with updated @electron/remote

* deps: update sentry

* build: replace loaders in webpack configs

* ci: update to node 16

* tests: webpack config and react bug

More info:
facebook/react#20756 (comment)

* ci: add windows build and package

* util: replace nameChecker with hsd rules module

* pkg: document mac arm64 and update package.json scripts

* docs: update BUILD.md with new mac package cmd

* pkg: move `react-16-node-hanging-test-fix` to devDep

* pkg: update non-breaking deps

* sentry: load sentry and app based on process

Co-authored-by: Rithvik Vibhu <rithvikvibhu@gmail.com>

.github/workflows/build-and-test.yml

@@ -8,22 +8,49 @@ on:
     branches: [master]
   pull_request:
     branches: [master]
+  workflow_dispatch:
 
 jobs:
-  build:
-    runs-on: ubuntu-latest
-
+  build-and-test:
     strategy:
+      fail-fast: false
       matrix:
-        node-version: [11.x]
+        os: [windows-latest, ubuntu-latest]
+        node-version: ['14', '16']
+
+        # OS-specific commands/variables
+        include:
+          - os: ubuntu-latest
+            cmd_del: rm
+            cmd_build: npm run build
+          - os: windows-latest
+            cmd_del: del
+            cmd_build: node .\scripts\package.js
+
+    runs-on: ${{matrix.os}}
 
     steps:
-      - uses: actions/checkout@v2
+      - name: Checkout repository
+        uses: actions/checkout@v2
+
       - name: Use Node.js ${{ matrix.node-version }}
         uses: actions/setup-node@v1
         with:
           node-version: ${{ matrix.node-version }}
-      - run: sudo apt update && sudo apt install libudev-dev libusb-1.0-0-dev -y
-      - run: npm i
-      - run: npm run build --if-present
-      - run: npm test
+
+      - name: Install dependencies (linux only)
+        if: matrix.os == 'ubuntu-latest'
+        run: sudo apt update && sudo apt install libudev-dev libusb-1.0-0-dev -y
+
+      - name: Remove lock file (old node.js only)
+        if: matrix.node-version == '14'
+        run: ${{ matrix.cmd_del }} package-lock.json
+
+      - name: Install npm packages
+        run: npm i --legacy-peer-deps
+
+      - name: Build
+        run: ${{ matrix.cmd_build }}
+
+      - name: Test
+        run: npm test

.github/workflows/package.yml

@@ -4,28 +4,45 @@ on: workflow_dispatch
 
 jobs:
   package:
-    runs-on: ubuntu-18.04
+    strategy:
+      fail-fast: false
+      matrix:
+        os: [windows-latest, ubuntu-18.04]
+
+        # OS-specific commands/variables
+        include:
+          - os: ubuntu-18.04
+            cmd_package: npm run package-linux
+            out_filename: Bob-linux
+          - os: windows-latest
+            cmd_package: npm run package-win
+            out_filename: Bob-windows
+
+    runs-on: ${{matrix.os}}
 
     steps:
       - name: Checkout repository
         uses: actions/checkout@v2
 
-      - name: Use Node.js ${{ matrix.node-version }}
+      - name: Use Node.js 16.x
         uses: actions/setup-node@v1
         with:
-          node-version: 14.x
+          node-version: 16.x
 
-      - name: Install dependencies
+      - name: Install dependencies (linux only)
+        if: matrix.os == 'ubuntu-18.04'
         run: sudo apt update && sudo apt install libudev-dev libusb-1.0-0-dev -y
 
-      - name: npm install
-        run: npm i
+      - name: Install npm packages
+        run: npm i --legacy-peer-deps
 
-      - name: Generate AppImage
-        run: npm run package-linux
+      - name: Generate Executable
+        run: ${{ matrix.cmd_package }}
 
       - name: Store artifacts
         uses: actions/upload-artifact@v2
         with:
-          name: AppImage
-          path: release/*.AppImage
+          name: ${{ matrix.out_filename }}
+          path: |
+            release/*.AppImage
+            release/*.msi

BUILD.md

@@ -3,7 +3,7 @@
 ### MacOS
 
 1. uninstall gmp by running `brew uninstall gmp --ignore-dependencies`
-2. run `npm run package`
+2. run `npm run package-mac` (see [README](./README.md) for cross-arch build)
 3. reinstall gmp by running `brew install gmp`
 4. notarize `Bob.dmg` by running `xcrun altool --notarize-app --primary-bundle-id "{bunde-id}" --username "{username}" --password "{password}" --asc-provider "{asc-provider-id}" --file ./release/Bob.dmg`
 5. you can check notarization status by running `xcrun altool --notarization-info "{notarization-id}" --username "{username} --password "{password}"`

README.md

@@ -48,20 +48,40 @@ Due to Ledger USB integration, additional dependencies are required:
 
 #### OSX
 
+If you are running OSX on an arm64 processor (aka "Apple Silicon" or "M1") it
+is highly recommended to upgrade to Node.js v16
+[which has arm64 support.](https://nodejs.org/en/blog/release/v16.0.0/#toolchain-and-compiler-upgrades)
+
+Building for OSX requires one extra "optional" dependency (dmg-license)
+[that can not currently be installed on Windows/Linux systems](https://github.com/electron-userland/electron-builder/issues/6520):
+
 ```bash
 brew install libusb
 git clone https://github.com/kyokan/bob-wallet
 cd bob-wallet
 npm install
+npm install dmg-license
 ```
 
-Build the app package:
+Build the app package *for the native architecture of your Mac*:
 
 ```bash
-npm run package
+npm run package-mac
 ```
 
-The output app will be created in the `/release/mac` folder. Open `Bob.app` to start the wallet.
+If you are running OSX on an arm64 but want to build the executable for x86 (Intel)
+Macs, you can do so but you must first downgrade to Node.js v14 or re-install Node.js v16
+for x86 instead of arm64. Building for a non-native architecture will seriously impair
+the performance of the application, so this option is only recommended for multi-platform
+distribution by maintainers with M1 Macs. As an extra complication, this process must
+be run in an environment where `libunbound` is available as an x86 package.
+
+```bash
+npm run package-mac-intel
+``` 
+
+The output app will be created in the `/release/mac` or `/release/mac-arm64` folder.
+Open `Bob.app` to start the wallet.
 
 
 #### Linux

app/app.html

@@ -11,5 +11,9 @@
 <body>
 <div id="root"></div>
 <div id="modal-root"></div>
+<script>
+  // https://github.com/tc39/proposal-global
+  global = globalThis;
+</script>
 </body>
 </html>

app/background/ipc/ipc.js

@@ -1,4 +1,4 @@
-const Sentry = require('@sentry/electron');
+const Sentry = require('@sentry/browser');
 
 export const SIGIL = '@@RPC@@';
 

app/components/NameClaimModal/index.js

@@ -11,7 +11,7 @@ import {clientStub as wClientStub} from "../../background/wallet/client";
 import {constants, dnssec, wire, Ownership, util} from 'bns';
 import blake2b from "bcrypto/lib/blake2b";
 import fs from "fs";
-const { dialog } = require("electron").remote;
+const { dialog } = require('@electron/remote');
 import {clientStub as nClientStub} from "../../background/node/client";
 import Alert from "../Alert";
 import CopyButton from "../CopyButton";

app/components/ProofModal/stepPrivateKey.js

@@ -5,7 +5,7 @@ import { connect } from "react-redux";
 import Submittable from "../Submittable";
 import WizardHeader from "../WizardHeader";
 import Checkbox from "../Checkbox";
-const { dialog } = require("electron").remote;
+const { dialog } = require('@electron/remote');
 
 @connect()
 export default class StepPrivateKey extends Component {

app/components/SendModal/index.js

@@ -14,21 +14,11 @@ import walletClient from '../../utils/walletClient';
 import { shell } from 'electron';
 import {I18nContext} from "../../utils/i18n";
 
-const Sentry = require('@sentry/electron');
-
 const analytics = aClientStub(() => require('electron').ipcRenderer);
 
 const SLOW = 'Slow';
 const STANDARD = 'Standard';
 const FAST = 'Fast';
-const SIMNET = 'simnet';
-// const MAINNET = 'main';
-
-const GAS_TO_ESTIMATES = {
-  [SLOW]: '20-30 mins',
-  [STANDARD]: '10-15 mins',
-  [FAST]: 'less than 5 mins',
-};
 
 @connect(
   state => ({

app/components/TLDInput/index.js

@@ -4,7 +4,7 @@ import PropTypes from 'prop-types';
 import { connect } from 'react-redux';
 import c from 'classnames';
 import * as nameActions from '../../ducks/names';
-import { verifyName } from '../../utils/nameChecker';
+import { verifyName } from 'hsd/lib/covenants/rules';
 import { decodePunycode } from '../../utils/nameHelpers';
 import { I18nContext } from "../../utils/i18n";
 import './TLDInput.scss';

app/db/names.js

@@ -1,5 +1,5 @@
 import { clientStub } from '../background/db/client';
-import { hashName } from '../utils/nameChecker';
+import { hashName } from 'hsd/lib/covenants/rules';
 const dbClient = clientStub(() => require('electron').ipcRenderer);
 
 

app/ducks/namesReducer.js

@@ -1,5 +1,5 @@
 import { SET_PENDING_TRANSACTIONS } from './walletReducer';
-import { hashName } from '../utils/nameChecker';
+import { hashName } from 'hsd/lib/covenants/rules';
 
 const ALLOWED_COVENANTS = new Set([
   'OPEN',

app/main.js

@@ -12,7 +12,7 @@ import showMainWindow, {dispatchToMainWindow, sendDeeplinkToMainWindow} from './
 import path from 'path';
 import {encrypt} from "./utils/encrypt";
 
-const Sentry = require('@sentry/electron');
+const Sentry = require('@sentry/electron/main');
 
 if (process.env.NODE_ENV === 'production') {
   const sourceMapSupport = require('source-map-support');

app/mainWindow.js

@@ -1,5 +1,7 @@
 import path from 'path';
-import { BrowserWindow, app } from 'electron';
+import * as electron from 'electron';
+import * as remoteMain from '@electron/remote/main';
+remoteMain.initialize();
 
 let mainWindow;
 
@@ -9,16 +11,19 @@ export default function showMainWindow() {
     return;
   }
 
-  mainWindow = new BrowserWindow({
+  mainWindow = new electron.BrowserWindow({
     show: false,
     width: 1024,
     height: 728,
     webPreferences: {
       preload: path.join(__dirname, 'preload.js'),
-      nodeIntegration: true
+      nodeIntegration: true,
+      contextIsolation: false,
     }
   });
 
+  remoteMain.enable(mainWindow.webContents);
+
   mainWindow.loadURL(`file://${__dirname}/app.html`);
 
   // @TODO: Use 'ready-to-show' event
@@ -42,7 +47,7 @@ export default function showMainWindow() {
     // the HSD window) once the main window is closed
     // on Windows
     if (process.platform === 'win32') {
-      app.quit();
+      electron.app.quit();
     }
   });
 }

app/pages/Auction/index.js

@@ -31,7 +31,11 @@ import { clientStub as aClientStub } from '../../background/analytics/client';
 import NameClaimModal from "../../components/NameClaimModal";
 import {I18nContext} from "../../utils/i18n";
 
-const Sentry = require('@sentry/electron');
+const Sentry = (
+  process.type === 'renderer'
+  ? require('@sentry/electron/renderer')
+  : require('@sentry/electron/main')
+);
 
 const analytics = aClientStub(() => require('electron').ipcRenderer);
 

app/pages/DomainManager/index.js

@@ -22,7 +22,7 @@ import dbClient from "../../utils/dbClient";
 import BulkFinalizeWarningModal from "./BulkFinalizeWarningModal";
 import {I18nContext} from "../../utils/i18n";
 
-const {dialog} = require('electron').remote;
+const {dialog} = require('@electron/remote');
 
 const analytics = aClientStub(() => require('electron').ipcRenderer);
 

app/pages/Exchange/index.js

@@ -3,7 +3,7 @@ import fs from "fs";
 import { connect } from 'react-redux';
 import moment from 'moment';
 import classNames from 'classnames';
-const {dialog} = require('electron').remote;
+const {dialog} = require('@electron/remote');
 import { shell } from 'electron';
 import { clientStub as aClientStub } from '../../background/analytics/client.js';
 import { clientStub as sClientStub } from '../../background/shakedex/client.js';

app/pages/Settings/ChangeDirectoryModal.js

@@ -8,7 +8,7 @@ import Alert from "../../components/Alert";
 import dbClient from "../../utils/dbClient";
 import {I18nContext} from "../../utils/i18n";
 const nodeClient = clientStub(() => require('electron').ipcRenderer);
-const {dialog} = require('electron').remote;
+const {dialog} = require('@electron/remote');
 
 
 @withRouter

app/pages/Settings/index.js

@@ -27,7 +27,7 @@ import DeepCleanAndRescanModal from "./DeepCleanAndRescanModal";
 import {showError, showSuccess} from "../../ducks/notifications";
 import BackupListingModal from "./BackupListingModal";
 import fs from "fs";
-const {dialog} = require('electron').remote;
+const {dialog} = require('@electron/remote');
 import {clientStub as sClientStub} from "../../background/shakedex/client";
 import ChangeDirectoryModal from "./ChangeDirectoryModal";
 import dbClient from "../../utils/dbClient";

app/pages/Watching/index.js

@@ -15,10 +15,11 @@ import { clientStub as aClientStub } from '../../background/analytics/client';
 import fs from "fs";
 import Dropdown from "../../components/Dropdown";
 import {getPageIndices} from "../../utils/pageable";
-import {verifyName} from "../../utils/nameChecker";
+import {verifyName} from "hsd/lib/covenants/rules";
 import dbClient from "../../utils/dbClient";
 import {I18nContext} from "../../utils/i18n";
-const {dialog} = require('electron').remote;
+const {dialog} = require('@electron/remote');
+
 
 const analytics = aClientStub(() => require('electron').ipcRenderer);
 

app/preload.js

@@ -1,3 +1,5 @@
+require('@sentry/electron/preload');
+
 window.addEventListener('DOMContentLoaded', () => {
   const scripts = [];
   const port = process.env.PORT || 1212;

app/sentry.js

@@ -1,11 +1,20 @@
-const Sentry = require('@sentry/electron');
-const electron = require('electron');
+let Sentry, app;
+
+if (process.type === 'renderer') {
+  Sentry = require('@sentry/electron/renderer');
+  app = require('@electron/remote').app;
+} else {
+  Sentry = require('@sentry/electron/main');
+  app = require('electron').app;
+}
+
 const pkg = require('../package.json');
 
 (function () {
-  if (!(electron.app || electron.remote.app).isPackaged) {
+  if (!app.isPackaged) {
     return;
   }
+
   Sentry.init({
     dsn: 'https://ea41895688674e598d69cbd975872db8@sentry.io/1759225',
     release: 'bob-wallet@' + pkg.version,