add page progress

package.json

@@ -46,6 +46,7 @@
     "electron-is-dev": "^0.3.0",
     "electron-next": "^3.1.3",
     "fs-extra": "^5.0.0",
+    "nprogress": "^0.2.0",
     "path-exists": "^3.0.0",
     "prop-types": "^15.6.0",
     "react-cookies": "^0.1.0",

renderer/layouts/page.js

@@ -6,13 +6,27 @@ import { platform } from 'os'
 // Packages
 import { Component } from 'react'
 import Router from 'next/router'
+import Progress from 'nprogress'
 
 // Components
 import WinControls from '../components/win-controls'
 
 // Theme
 import { colors, typography } from './../theme'
 
+let progress
+const stopProgress = () => {
+  clearTimeout(progress)
+  Progress.done()
+}
+
+Router.onRouteChangeStart = () => {
+  progress = setTimeout(Progress.start, 200)
+}
+
+Router.onRouteChangeComplete = stopProgress
+Router.onRouteChangeError = stopProgress
+
 class Page extends Component {
   constructor() {
     super()
@@ -111,6 +125,31 @@ class Page extends Component {
           fieldset {
             border: 0;
           }
+
+          #nprogress {
+            pointer-events: none;
+          }
+
+          #nprogress .bar {
+            background: ${colors.white};
+            position: fixed;
+            z-index: 1031;
+            top: 0;
+            left: 0;
+            width: 100%;
+            height: 2px;
+          }
+
+          #nprogress .peg {
+            display: block;
+            position: absolute;
+            right: 0px;
+            width: 100px;
+            height: 100%;
+            box-shadow: 0 0 10px ${colors.white}, 0 0 5px ${colors.white};
+            opacity: 1;
+            transform: rotate(3deg) translate(0px, -4px);
+          }
         `}</style>
       </main>
     )

yarn.lock

@@ -4605,6 +4605,10 @@ npmconf@^2.1.2:
     gauge "~2.7.3"
     set-blocking "~2.0.0"
 
+nprogress@^0.2.0:
+  version "0.2.0"
+  resolved "https://registry.yarnpkg.com/nprogress/-/nprogress-0.2.0.tgz#cb8f34c53213d895723fcbab907e9422adbcafb1"
+
 nugget@^2.0.0, nugget@^2.0.1:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/nugget/-/nugget-2.0.1.tgz#201095a487e1ad36081b3432fa3cada4f8d071b0"