xevion/bus-reminder
1
0
Fork 0
mirror of https://github.com/Xevion/bus-reminder.git synced 2025-12-10 12:06:43 -06:00
Code Issues Packages Projects Releases Wiki Activity

Add nprogress hook ^& css

Browse Source
This commit is contained in:
Xevion
2023-02-27 20:09:34 -06:00
parent db576298cb
commit d8a9270ce6
4 changed files with 52 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
package.json
View File

@@ -11,6 +11,7 @@
"dependencies": {
"@tailwindcss/forms": "^0.5.3",
"@types/node": "18.14.0",
"@types/nprogress": "^0.2.0",
"@types/prismjs": "^1.26.0",
"@types/react": "18.0.28",
"@types/react-dom": "18.0.11",
@@ -20,6 +21,7 @@
"ioredis": "^5.3.1",
"life360-node-api": "^0.0.10",
"next": "13.1.6",
"nprogress": "^0.2.0",
"postcss": "^8.4.21",
"prismjs": "^1.29.0",
"react": "18.2.0",

19
src/pages/_app.tsx
View File

@@ -1,12 +1,15 @@
import {AppType} from "next/app";
import "@/styles/globals.scss";
import { AppType } from 'next/app';
import useNProgress from '@/utils/useNProgress';
import '@/styles/globals.scss';
import 'nprogress/nprogress.css';
const MyApp: AppType = ({ Component, pageProps }) => {
return (
<>
<Component {...pageProps} />
</>
);
useNProgress();
return (
<>
<Component {...pageProps} />
</>
);
};
export default MyApp;
export default MyApp;

29
src/utils/useNProgress.ts Normal file
View File

@@ -0,0 +1,29 @@
import { useRouter } from 'next/router';
import { useEffect } from 'react';
import NProgress from 'nprogress';
const useNProgress = () => {
// Setup progress bar router-based listeners
const router = useRouter();
useEffect(() => {
const handleStart = () => {
NProgress.start();
};
const handleStop = () => {
NProgress.done();
};
router.events.on('routeChangeStart', handleStart);
router.events.on('routeChangeComplete', handleStop);
router.events.on('routeChangeError', handleStop);
return () => {
router.events.off('routeChangeStart', handleStart);
router.events.off('routeChangeComplete', handleStop);
router.events.off('routeChangeError', handleStop);
};
}, [router]);
};
export default useNProgress;

10
yarn.lock
View File

@@ -186,6 +186,11 @@
resolved "https://registry.yarnpkg.com/@types/node/-/node-14.18.36.tgz#c414052cb9d43fab67d679d5f3c641be911f5835"
integrity sha512-FXKWbsJ6a1hIrRxv+FoukuHnGTgEzKYGi7kilfMae96AL9UNkPFNWJEEYWzdRI9ooIkbr4AKldyuSTLql06vLQ==
"@types/nprogress@^0.2.0":
version "0.2.0"
resolved "https://registry.yarnpkg.com/@types/nprogress/-/nprogress-0.2.0.tgz#86c593682d4199212a0509cc3c4d562bbbd6e45f"
integrity sha512-1cYJrqq9GezNFPsWTZpFut/d4CjpZqA0vhqDUPFWYKF1oIyBz5qnoYMzR+0C/T96t3ebLAC1SSnwrVOm5/j74A==
"@types/prismjs@^1.26.0":
version "1.26.0"
resolved "https://registry.yarnpkg.com/@types/prismjs/-/prismjs-1.26.0.tgz#a1c3809b0ad61c62cac6d4e0c56d610c910b7654"
@@ -686,6 +691,11 @@ normalize-range@^0.1.2:
resolved "https://registry.yarnpkg.com/normalize-range/-/normalize-range-0.1.2.tgz#2d10c06bdfd312ea9777695a4d28439456b75942"
integrity sha512-bdok/XvKII3nUpklnV6P2hxtMNrCboOjAcyBuQnWEhO665FwrSNRxU+AqpsyvO6LgGYPspN+lu5CLtw4jPRKNA==
nprogress@^0.2.0:
version "0.2.0"
resolved "https://registry.yarnpkg.com/nprogress/-/nprogress-0.2.0.tgz#cb8f34c53213d895723fcbab907e9422adbcafb1"
integrity sha512-I19aIingLgR1fmhftnbWWO3dXc0hSxqHQHQb3H8m+K3TnEn/iSeTZZOyvKXWqQESMwuUVnatlCnZdLBZZt2VSA==
object-hash@^3.0.0:
version "3.0.0"
resolved "https://registry.yarnpkg.com/object-hash/-/object-hash-3.0.0.tgz#73f97f753e7baffc0e2cc9d6e079079744ac82e9"