From d921885f1bb24376a93c59c56f6fde4ab1344e10 Mon Sep 17 00:00:00 2001
From: Vyacheslav Matyukhin <me@berekuk.ru>
Date: Sat, 26 Mar 2022 14:23:38 +0300
Subject: [PATCH] feat: nprogress bar

---
 package-lock.json  | 24 ++++++++++++++++++++++++
 package.json       |  2 ++
 src/pages/_app.tsx |  8 ++++++++
 3 files changed, 34 insertions(+)

diff --git a/package-lock.json b/package-lock.json
index b0d98c5..0975b46 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -11,6 +11,7 @@
       "dependencies": {
         "@tailwindcss/forms": "^0.4.0",
         "@tailwindcss/typography": "^0.5.1",
+        "@types/nprogress": "^0.2.0",
         "@types/react": "^17.0.39",
         "airtable": "^0.11.1",
         "algoliasearch": "^4.10.3",
@@ -33,6 +34,7 @@
         "mongodb": "^3.6.6",
         "multiselect-react-dropdown": "^2.0.17",
         "next": "12",
+        "nprogress": "^0.2.0",
         "open": "^7.3.1",
         "papaparse": "^5.3.0",
         "pg": "^8.7.3",
@@ -1759,6 +1761,12 @@
       "resolved": "https://registry.npmjs.org/@types/node/-/node-14.14.28.tgz",
       "integrity": "sha512-lg55ArB+ZiHHbBBttLpzD07akz0QPrZgUODNakeC09i62dnrywr9mFErHuaPlB6I7z+sEbK+IYmplahvplCj2g=="
     },
+    "node_modules/@types/nprogress": {
+      "version": "0.2.0",
+      "resolved": "https://npm.team.kocherga.club/@types%2fnprogress/-/nprogress-0.2.0.tgz",
+      "integrity": "sha512-1cYJrqq9GezNFPsWTZpFut/d4CjpZqA0vhqDUPFWYKF1oIyBz5qnoYMzR+0C/T96t3ebLAC1SSnwrVOm5/j74A==",
+      "license": "MIT"
+    },
     "node_modules/@types/parse-json": {
       "version": "4.0.0",
       "resolved": "https://npm.team.kocherga.club/@types%2fparse-json/-/parse-json-4.0.0.tgz",
@@ -33638,6 +33646,12 @@
         "set-blocking": "~2.0.0"
       }
     },
+    "node_modules/nprogress": {
+      "version": "0.2.0",
+      "resolved": "https://npm.team.kocherga.club/nprogress/-/nprogress-0.2.0.tgz",
+      "integrity": "sha1-y480xTIT2JVyP8urkH6UIq28r7E=",
+      "license": "MIT"
+    },
     "node_modules/nth-check": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/nth-check/-/nth-check-2.0.1.tgz",
@@ -38514,6 +38528,11 @@
       "resolved": "https://registry.npmjs.org/@types/node/-/node-14.14.28.tgz",
       "integrity": "sha512-lg55ArB+ZiHHbBBttLpzD07akz0QPrZgUODNakeC09i62dnrywr9mFErHuaPlB6I7z+sEbK+IYmplahvplCj2g=="
     },
+    "@types/nprogress": {
+      "version": "0.2.0",
+      "resolved": "https://npm.team.kocherga.club/@types%2fnprogress/-/nprogress-0.2.0.tgz",
+      "integrity": "sha512-1cYJrqq9GezNFPsWTZpFut/d4CjpZqA0vhqDUPFWYKF1oIyBz5qnoYMzR+0C/T96t3ebLAC1SSnwrVOm5/j74A=="
+    },
     "@types/parse-json": {
       "version": "4.0.0",
       "resolved": "https://npm.team.kocherga.club/@types%2fparse-json/-/parse-json-4.0.0.tgz",
@@ -62328,6 +62347,11 @@
         "set-blocking": "~2.0.0"
       }
     },
+    "nprogress": {
+      "version": "0.2.0",
+      "resolved": "https://npm.team.kocherga.club/nprogress/-/nprogress-0.2.0.tgz",
+      "integrity": "sha1-y480xTIT2JVyP8urkH6UIq28r7E="
+    },
     "nth-check": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/nth-check/-/nth-check-2.0.1.tgz",
diff --git a/package.json b/package.json
index 36031dc..0fd67f6 100644
--- a/package.json
+++ b/package.json
@@ -29,6 +29,7 @@
   "dependencies": {
     "@tailwindcss/forms": "^0.4.0",
     "@tailwindcss/typography": "^0.5.1",
+    "@types/nprogress": "^0.2.0",
     "@types/react": "^17.0.39",
     "airtable": "^0.11.1",
     "algoliasearch": "^4.10.3",
@@ -51,6 +52,7 @@
     "mongodb": "^3.6.6",
     "multiselect-react-dropdown": "^2.0.17",
     "next": "12",
+    "nprogress": "^0.2.0",
     "open": "^7.3.1",
     "papaparse": "^5.3.0",
     "pg": "^8.7.3",
diff --git a/src/pages/_app.tsx b/src/pages/_app.tsx
index a568e28..df5d536 100644
--- a/src/pages/_app.tsx
+++ b/src/pages/_app.tsx
@@ -1,5 +1,13 @@
+import 'nprogress/nprogress.css';
 import '../styles/main.css';
 
+import Router from 'next/router';
+import NProgress from 'nprogress';
+
+Router.events.on("routeChangeStart", () => NProgress.start());
+Router.events.on("routeChangeComplete", () => NProgress.done());
+Router.events.on("routeChangeError", () => NProgress.done());
+
 function MyApp({ Component, pageProps }) {
   return <Component {...pageProps} />;
 }