feat: page load progressbar

This commit is contained in:
mehedi-hasan 2024-04-24 20:50:45 +06:00
parent 65ea9e5681
commit 64be0f87b1
3 changed files with 23 additions and 0 deletions

14
package-lock.json generated
View File

@ -55,6 +55,7 @@
"monaco-themes": "^0.4.4", "monaco-themes": "^0.4.4",
"next": "^14.0.1", "next": "^14.0.1",
"next-mdx-remote": "^4.4.1", "next-mdx-remote": "^4.4.1",
"next-nprogress-bar": "^2.3.11",
"next-themes": "^0.2.1", "next-themes": "^0.2.1",
"postcss": "8.4.28", "postcss": "8.4.28",
"react": "^18.2.0", "react": "^18.2.0",
@ -12801,6 +12802,14 @@
"react-dom": ">=16.x <=18.x" "react-dom": ">=16.x <=18.x"
} }
}, },
"node_modules/next-nprogress-bar": {
"version": "2.3.11",
"resolved": "https://registry.npmjs.org/next-nprogress-bar/-/next-nprogress-bar-2.3.11.tgz",
"integrity": "sha512-OjSvsQwgSWa2qBMYO478QreGG9Jt82tr4wTQptmiyzNqqjzHCyKZNkhANnzPrjuFAoelIvmruJuakODofSnvTQ==",
"dependencies": {
"nprogress": "^0.2.0"
}
},
"node_modules/next-themes": { "node_modules/next-themes": {
"version": "0.2.1", "version": "0.2.1",
"resolved": "https://registry.npmjs.org/next-themes/-/next-themes-0.2.1.tgz", "resolved": "https://registry.npmjs.org/next-themes/-/next-themes-0.2.1.tgz",
@ -12919,6 +12928,11 @@
"node": ">=0.10.0" "node": ">=0.10.0"
} }
}, },
"node_modules/nprogress": {
"version": "0.2.0",
"resolved": "https://registry.npmjs.org/nprogress/-/nprogress-0.2.0.tgz",
"integrity": "sha512-I19aIingLgR1fmhftnbWWO3dXc0hSxqHQHQb3H8m+K3TnEn/iSeTZZOyvKXWqQESMwuUVnatlCnZdLBZZt2VSA=="
},
"node_modules/object-assign": { "node_modules/object-assign": {
"version": "4.1.1", "version": "4.1.1",
"resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz", "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",

View File

@ -57,6 +57,7 @@
"monaco-themes": "^0.4.4", "monaco-themes": "^0.4.4",
"next": "^14.0.1", "next": "^14.0.1",
"next-mdx-remote": "^4.4.1", "next-mdx-remote": "^4.4.1",
"next-nprogress-bar": "^2.3.11",
"next-themes": "^0.2.1", "next-themes": "^0.2.1",
"postcss": "8.4.28", "postcss": "8.4.28",
"react": "^18.2.0", "react": "^18.2.0",

View File

@ -1,11 +1,19 @@
"use client"; "use client";
import React from "react"; import React from "react";
import ThemeProvider from "./ThemeToggle/theme-provider"; import ThemeProvider from "./ThemeToggle/theme-provider";
import { AppProgressBar as ProgressBar } from "next-nprogress-bar";
export default function Providers({ children }: { children: React.ReactNode }) { export default function Providers({ children }: { children: React.ReactNode }) {
return ( return (
<> <>
<ThemeProvider attribute="class" defaultTheme="dark" enableSystem> <ThemeProvider attribute="class" defaultTheme="dark" enableSystem>
{children} {children}
<ProgressBar
height="4px"
color="hsl(217.2 91.2% 59.8%)"
options={{ showSpinner: false }}
shallowRouting
/>
</ThemeProvider> </ThemeProvider>
</> </>
); );