Tabs + Build process (#24)

* WIP: moving to simple-ftp client

* ADDED: needsConnection decorator
CLEANED-UP: fileState so that no un-necessary FS is re-created
ADDED: SimpleFtp.list, SimpleFtp.cd implemented (more work needed)

* ADDED: basic cache handling for ftp connection (need to handle close/timeout now)
FIXED: remove unneeded call to waitForConnection in several methods (@needsConnection) already does this

* ADDED: Client.freeClient to remove a client
ADDED: Ftp: schedule a call to 'NOOP' to detect timeouts (needs more work since we cannot call it if an operation is already in progress)

* ADDED: canTimeout function that will create a new client if needed
FIXED: 530 error keeps connection opened which breaks calls to client.access()

* ADDED: no internet error handling (EHOSTDOWN)
IMPROVED: made the login process use the canTimeout annotation as well
FIXED: canTimeout should reject if login is skipped, fixes infinite loop
FIXED: pathbar tooltip could be stuck if window was small enough
FIXED: tooltip Linux example localized string

* WIP: added the transferId to async FS calls so that a new FTP client can be used if needed

* ADDED: implemented SimpleFtp.get/.getStream, works but needs testing

* FIXED: made FsLocal detect Windows network shares which start with \\

* FIXED: use a new transferId when opening a file

* IMPROVED: made openFile() define and use a Batch instead of using the get method
RENAMED: appState.prepareDragDropTransfer -> prepareTransfer
ADDED: appState.prepareLocalTransfer that transfers from a srcCache to local FS
ADDED: Fs now exports DOWNLOADS_DIR const
REMOVED: FS.get() method that's no longer used

* ADDED: error handling on readStream when doing a transfer, needs testing

* 1.4.1

* FIXED: hardcoded english strings in Toolbar.tsx, fixes #23

* FIXED: crash when initiating a transfer from ftp after going back in history

* WIP: improve transfers progress bar

* ADDED: tabs handling

* FIXED: drag and drop (tabs regression)
UPGRADED: blueprintjs to 3.10.0 (to use Icon htmlTitle prop)

* ADDED: new ViewState store to keep track of view tabs
WIP: close tab button works, needs testing

* FIXED: using cursor keys would move selection in both views

* FIXED: viewState.isActive set to false by default, not undefined, fixes mod + o
FIXED: by default mod + o should open in current view, shift + mod + o in other view

* IMPROVED: when clicking on an inactive view, only stop event propagation when click happens inside the filetable

* UPDATED: React-FTP => React-Explorer
UPDATED: mac build configuration now supports darkMode
ADDED: new platform.isPackage to detect package mode
FIXED: disable watcher/devtools in package mode

* FIXED: close tab on non-selected tab
ADDED: viewState.selectTab
ADDED: new webpack production config file

* FIXED: do not add a new history entry when selecting tab

* IMPROVED: tab css

* ADDED: new/next/previous/close tab accelerators, need to implement new tab

* ADDED: missing locale string

* ADDED: new sendFakeCombo() to send combos from the renderer process
ADDED: addTab now works (should tabs added at the end?)
IMPROVED: use ellipsis to cleanly cut tab titles

* ADDED: app icon
ADDED: Windows and Linux build targets
ADDED: splash screen
FIXED: watcher (development mode)
ADDED: use OverlayScrellbars for main webview (needs testing on Win/Linux)
ADDED: git hash now displayed in logs and about dialog

* ADDED: copy button in about dialog to copy version string to clipboard (Win/Linux)

.gitignore

@@ -2,3 +2,4 @@ node_modules
 dist/
 dist-e2e/
 .DS_Store
+build/

README.md

@@ -1,17 +1,17 @@
 # FTP & local file explorer written in TypeScript & React
 
-![React-FTP](./img/react-ftp.png)
+![React-Explorer](./img/react-ftp.png)
 
 ## Features
 
 **Note**
-React-FTP is still being worked on so this is a work in progress.
+React-Explorer is still being worked on so this is a work in progress.
 
-- Plugin-based filesystem type: FTP and local supported for now
+- Plugin-based filesystem type: local supported for now
 - Can be fully keyboard controlled
-- Transfers from Local to FTP, from FTP to FTP and from local to local folders
+- Transfers from/to any plugin
 - Fully localized (French & English available)
-- DarkMode with automatic detection on macOS Mojave
+- Dark Mode with automatic detection on macOS Mojave
 
 ## Requirements
 
@@ -21,9 +21,9 @@ React-FTP is still being worked on so this is a work in progress.
 
 ## Building for local development
 
-In order to build React-FTP you need to have installed `nodejs`.
+In order to build React-Explorer you need to have installed `nodejs`.
 
-Once installed, building React-FTP is as easy as typing:
+Once installed, building React-Explorer is as easy as typing:
 
 ```shell
 npm install && npm run build
@@ -38,34 +38,34 @@ npx electron ./dist/main.js
 ```
 
 ## Building binary packages
-TODO
-
-### Windows
+In order to build binary packages, simply type the following:
 
-### macOS
+```shell
+npm run dist
+```
 
-### Linux
+This will build packaged binaries of React Explorer into the `dist` folder.
 
 ## Tests
 
 ## How to develop a new Plugin
 
-React-FTP has been written so that it can easily be extended using plugins.
+React-Explorer has been written so that it can easily be extended using plugins.
 
 TODO
 
 ## Acknowledgments
 
-FTP-Electron makes use of the following tools/components:
+React-Explorer makes use of the following tools/components:
 
  - [React](https://reactjs.org)
  - [Electron](https://electron.s.org)
  - [TypeScript](https://typescriptlang.org)
  - [MobX](https://mobx.js.org)
  - [Blueprintjs](https://blueprintjs.com)
- - [node-ftp](https://github.com/warpdesign/node-ftp)
+ - [basic-ftp](https://github.com/patrickjuchli/basic-ftp)
  - [i18next](https://i18next.com) & [react-i18n](https://github.com/i18next/react-i18next)
 
  ## Licence
 
- React-FTP is licenced under the MIT licence.
+ React-Explorer is licenced under the MIT licence.

index.html

@@ -1,18 +1,70 @@
 <!DOCTYPE html>
 <html>
-    <head>
-        <meta charset="UTF-8" />
-        <meta http-equiv="Content-Security-Policy" content="script-src 'self'">
-        <title><%= htmlWebpackPlugin.options.title %></title>
-    </head>
-    <body>
-        <div id="root"></div>
-        <button id="reload">Reload!</button>
-        <!-- Dependencies -->
-        <!-- <script src="./node_modules/react/umd/react.development.js"></script>
+
+<head>
+    <meta charset="UTF-8" />
+    <meta http-equiv="Content-Security-Policy" content="script-src 'self'">
+    <title><%= htmlWebpackPlugin.options.title %></title>
+    <style type="text/css">
+        body {
+            margin: 0;
+            overflow: hidden;
+            height: 100vh;
+        }
+
+        #root {
+            opacity: 0;
+            transition-property: opacity;
+            transition-duration: 1s;
+        }
+
+        body.loaded #root {
+            opacity: 1;
+        }
+
+        .splash {
+            position: absolute;
+            z-index: 1;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            opacity: .6;
+            transition-property: opacity;
+            transition-duration: 1s;
+            width: 100%;
+            height: 90%;
+        }
+
+        body.loaded .splash {
+            pointer-events: none;
+            opacity: 0;
+        }
+    </style>
+</head>
+
+<body>
+    <div class="splash">
+        <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 40 40"
+            version="1.1" width="128px" height="128px">
+            <g id="surface1">
+                <path style=" fill:#B6DCFE;"
+                    d="M 1.5 35.5 L 1.5 4.5 L 11.792969 4.5 L 14.792969 7.5 L 35.5 7.5 L 35.5 35.5 Z " />
+                <path style=" fill:#4788C7;"
+                    d="M 11.585938 5 L 14.585938 8 L 35 8 L 35 35 L 2 35 L 2 5 L 11.585938 5 M 12 4 L 1 4 L 1 36 L 36 36 L 36 7 L 15 7 Z " />
+                <path style=" fill:#DFF0FE;"
+                    d="M 1.597656 35.5 L 5.417969 14.5 L 16.152344 14.5 L 19.152344 12.5 L 39.410156 12.5 L 35.578125 35.5 Z " />
+                <path style=" fill:#4788C7;"
+                    d="M 38.820313 13 L 35.152344 35 L 2.199219 35 L 5.835938 15 L 16.304688 15 L 16.554688 14.832031 L 19.304688 13 L 38.820313 13 M 40 12 L 19 12 L 16 14 L 5 14 L 1 36 L 36 36 Z " />
+            </g>
+        </svg>
+    </div>
+    <div id="root"></div>
+    <!-- Dependencies -->
+    <!-- <script src="./node_modules/react/umd/react.development.js"></script>
         <script src="./node_modules/react-dom/umd/react-dom.development.js"></script> -->
 
-        <!-- Main -->
-        <!-- <script src="./dist/bundle.js"></script> -->
-    </body>
+    <!-- Main -->
+    <!-- <script src="./dist/bundle.js"></script> -->
+</body>
+
 </html>