Continue addressing code review and feedback

.eslintignore

@@ -7,6 +7,3 @@
 
 # compiled by tsc from /src/electron/
 /public
-
-# rest resources
-/src/utils/resources

.vscode/settings.json

@@ -67,5 +67,16 @@
   ],
   "editor.codeActionsOnSave": {
     "source.fixAll.eslint": true
-  }
+  },
+  "cSpell.words": [
+    "Testcafe",
+    "antd",
+    "bitcoind",
+    "clightning",
+    "cmps",
+    "logobw",
+    "mrblenny",
+    "unzipper",
+    "uploader"
+  ]
 }

src/__mocks__/archiver.js

@@ -0,0 +1,22 @@
+const createMockArchiver = () => {
+  // TODO: this code should live in __mocks__/archiver.js
+
+  // eslint-disable-next-line @typescript-eslint/no-var-requires
+  const { PassThrough } = require('stream');
+  let mockStream;
+  // return a fake stream when "archiver()" is called in the app
+  const ctor = function() {
+    mockStream = new PassThrough();
+    mockStream.file = jest.fn();
+    mockStream.directory = jest.fn();
+    mockStream.append = jest.fn();
+    mockStream.finalize = jest.fn();
+    return mockStream;
+  };
+  // attach a func to emit events on the stream from the tests
+  ctor.mockEmit = (event, data) => mockStream.emit(event, data);
+
+  return ctor;
+};
+
+export default createMockArchiver();

src/__mocks__/fs-extra.js

@@ -1,8 +1,11 @@
 module.exports = {
   outputFile: jest.fn(),
+  writeFile: jest.fn(),
   pathExists: jest.fn(),
   readFile: jest.fn(),
   remove: jest.fn(),
   ensureDir: jest.fn(),
-  copyFile: jest.fn(),
+  copy: jest.fn(),
+  createWriteStream: jest.fn(),
+  createReadStream: jest.fn(),
 };

src/components/network/ImportNetwork.spec.tsx

@@ -21,7 +21,9 @@ describe('ImportNetwork component', () => {
   it('has a file uploader', async () => {
     const { getByText } = renderComponent();
     expect(
-      getByText('Click or drag ZIP file to this area to import'),
+      getByText(
+        'Drag a zip file exported from Polar here, or click to browse for the file',
+      ),
     ).toBeInTheDocument();
   });
 

src/components/network/ImportNetwork.tsx

@@ -1,4 +1,5 @@
-import React, { useState } from 'react';
+import React from 'react';
+import { useAsyncCallback } from 'react-async-hook';
 import { RouteComponentProps } from 'react-router';
 import { UploadOutlined } from '@ant-design/icons';
 import styled from '@emotion/styled';
@@ -35,27 +36,17 @@ const ImportNetwork: React.FC<RouteComponentProps> = () => {
   const { navigateTo, notify } = useStoreActions(s => s.app);
   const { importNetwork } = useStoreActions(s => s.network);
   const { l } = usePrefixedTranslation('cmps.network.ImportNetwork');
-  const [importing, setImporting] = useState(false);
+  const doImportNetwork = useAsyncCallback(async (file: RcFile) => {
+    try {
+      const network = await importNetwork(file.path);
+      notify({ message: l('importSuccess', { name: network.name }) });
+      navigateTo(HOME);
+    } catch (error) {
+      notify({ message: l('importError', { file: file.name }), error });
+    }
 
-  const doImportNetwork = (file: RcFile) => {
-    setImporting(true);
-
-    // we kick off the import promise, but don't wait for it
-    importNetwork(file.path)
-      .then(network => {
-        notify({ message: l('importSuccess', { name: network.name }) });
-        navigateTo(HOME);
-      })
-      .catch(error => {
-        notify({ message: l('importError', { file: file.name }), error });
-      })
-      .then(() => {
-        setImporting(false);
-      });
-
-    // return false to prevent the Upload.Dragger from sending the file somewhere
-    return false;
-  };
+    return;
+  });
 
   const theme = useTheme();
   return (
@@ -70,10 +61,10 @@ const ImportNetwork: React.FC<RouteComponentProps> = () => {
           // to not display a file in the upload dragger after the user has selected a zip
           fileList={undefined}
           accept=".zip"
-          disabled={importing}
-          beforeUpload={doImportNetwork}
+          disabled={doImportNetwork.loading}
+          beforeUpload={doImportNetwork.execute}
         >
-          {importing ? (
+          {doImportNetwork.loading ? (
             <>
               <Spin size="large" />
               <p>{l('importText')}</p>

src/components/network/NetworkView.spec.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import electron from 'electron';
 import fsExtra from 'fs-extra';
-import { fireEvent, wait, waitForElement } from '@testing-library/dom';
+import { fireEvent, getByText, wait, waitForElement } from '@testing-library/dom';
 import { act } from '@testing-library/react';
 import { createMemoryHistory } from 'history';
 import { Status } from 'shared/types';

src/components/routing/Routes.spec.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import { renderWithProviders } from 'utils/tests';
-import { HOME, NETWORK_NEW, Routes, NETWORK_IMPORT } from 'components/routing';
+import { HOME, NETWORK_IMPORT, NETWORK_NEW, Routes } from 'components/routing';
 
 describe('App container', () => {
   const renderComponent = (route: string) => {
@@ -19,6 +19,6 @@ describe('App container', () => {
 
   it('should render the import network page', () => {
     const { getByText } = renderComponent(NETWORK_IMPORT);
-    expect(getByText('Import a pre-defined Lightning Network')).toBeInTheDocument();
+    expect(getByText('Import a Lightning Network')).toBeInTheDocument();
   });
 });

src/i18n/locales/en-US.json

@@ -263,8 +263,8 @@
   "cmps.network.NetworkView.exportSuccess": "Exported '{{name}}'. Saved the zip file to {{destination}}",
   "cmps.network.NetworkView.notReadyToExport": "Cannot export a running network",
   "cmps.network.NetworkView.notReadyToExportDescription": "Make sure the network is completely stopped before exporting it.",
-  "cmps.network.ImportNetwork.title": "Import a pre-defined Lightning Network",
-  "cmps.network.ImportNetwork.fileDraggerArea": "Click or drag ZIP file to this area to import",
+  "cmps.network.ImportNetwork.title": "Import a Lightning Network",
+  "cmps.network.ImportNetwork.fileDraggerArea": "Drag a zip file exported from Polar here, or click to browse for the file",
   "cmps.network.ImportNetwork.importText": "Importing...",
   "cmps.network.ImportNetwork.importSuccess": "Imported network '{{name}}' successfully",
   "cmps.network.ImportNetwork.importError": "Could not import '{{file}}'",
@@ -347,5 +347,5 @@
   "store.models.network.removeLastErr": "Cannot remove the only bitcoin node",
   "store.models.network.removeCompatErr": "There are no other compatible backends for {{lnName}} to connect to. You must remove the {{lnName}} node first",
   "utils.network.backendCompatError": "This network does not contain a Bitcoin Core v{{requiredVersion}} (or lower) node which is required for {{implementation}} v{{version}}",
-  "utils.network.importClightningWindows": "Importing networks with c-lightning nodes is not supported on Windows"
+  "utils.network.incompatibleImplementation": "Importing networks with {{implementation}} nodes is not supported on {{platform}}"
 }

src/store/models/network.spec.ts

@@ -27,16 +27,14 @@ jest.mock('utils/files', () => ({
 jest.mock('utils/network', () => ({
   ...jest.requireActual('utils/network'),
   importNetworkFromZip: () => {
-    return jest.fn().mockImplementation(() => {
-      const network = {
-        id: 1,
-        nodes: {
-          bitcoin: [{}],
-          lightning: [{}],
-        },
-      };
-      return [network, {}];
-    })();
+    const network = {
+      id: 1,
+      nodes: {
+        bitcoin: [{}],
+        lightning: [{}],
+      },
+    };
+    return [network, {}];
   },
 }));
 
@@ -825,11 +823,11 @@ describe('Network model', () => {
 
   describe('Export', () => {
     it('should export a network and show a save dialogue', async () => {
-      const { network: networkActions } = store.getActions();
+      const { exportNetwork } = store.getActions().network;
 
       const spy = jest.spyOn(electron.remote.dialog, 'showSaveDialog');
 
-      const exported = await networkActions.exportNetwork(getNetwork());
+      const exported = await exportNetwork(getNetwork());
       expect(exported).toBeDefined();
 
       expect(spy).toHaveBeenCalled();
@@ -842,18 +840,18 @@ describe('Network model', () => {
       // returns undefined if user closes the window
       mock.mockImplementation(() => ({} as any));
 
-      const { network: networkActions } = store.getActions();
-      const exported = await networkActions.exportNetwork(getNetwork());
+      const { exportNetwork } = store.getActions().network;
+      const exported = await exportNetwork(getNetwork());
       expect(exported).toBeUndefined();
     });
   });
 
   describe('Import', () => {
     it('should import a network', async () => {
-      const { network: networkActions } = store.getActions();
+      const { importNetwork } = store.getActions().network;
       const statePreImport = store.getState();
 
-      const imported = await networkActions.importNetwork('zip');
+      const imported = await importNetwork('zip');
       expect(imported.id).toBeDefined();
       expect(imported.nodes.bitcoin.length).toBeGreaterThan(0);
       expect(imported.nodes.lightning.length).toBeGreaterThan(0);

src/store/models/network.ts

@@ -1,6 +1,6 @@
 import { remote, SaveDialogOptions } from 'electron';
 import { info } from 'electron-log';
-import { copyFile, ensureDir } from 'fs-extra';
+import { copy, ensureDir } from 'fs-extra';
 import { join } from 'path';
 import { push } from 'connected-react-router';
 import { Action, action, Computed, computed, Thunk, thunk } from 'easy-peasy';
@@ -645,7 +645,7 @@ const networkModel: NetworkModel = {
 
     const zipped = await zipNetwork(network, allCharts[network.id]);
 
-    await copyFile(zipped, zipDestination);
+    await copy(zipped, zipDestination);
     info('exported network to', zipDestination);
     return zipDestination;
   }),
@@ -655,14 +655,14 @@ const networkModel: NetworkModel = {
       network: { networks },
     } = getStoreState();
 
-    const { network: networkActions } = getStoreActions();
-    const { designer: designerActions } = getStoreActions();
+    const { add, save } = getStoreActions().network;
+    const { setChart } = getStoreActions().designer;
 
     const [newNetwork, chart] = await importNetworkFromZip(path, networks);
 
-    networkActions.add(newNetwork);
-    designerActions.setChart({ chart, id: newNetwork.id });
-    await networkActions.save();
+    add(newNetwork);
+    setChart({ chart, id: newNetwork.id });
+    await save();
 
     info('imported', newNetwork);
     return newNetwork;

src/utils/constants.ts

@@ -143,6 +143,7 @@ export const dockerConfigs: Record<NodeImplementation, DockerConfig> = {
       'bitcoind',
       '-server=1',
       '-regtest=1',
+      '-reindex',
       '-rpcauth={{rpcUser}}:{{rpcAuth}}',
       '-debug=0',
       '-zmqpubrawblock=tcp://0.0.0.0:28334',