add nprogress bar
This commit is contained in:
		
							parent
							
								
									b20e18283e
								
							
						
					
					
						commit
						ab75c4caf5
					
				| 
						 | 
				
			
			@ -15,6 +15,7 @@
 | 
			
		|||
        "classnames": "^2.5.1",
 | 
			
		||||
        "next": "14.2.2",
 | 
			
		||||
        "next-intl": "^3.11.3",
 | 
			
		||||
        "next-nprogress-bar": "^2.3.11",
 | 
			
		||||
        "react": "^18",
 | 
			
		||||
        "react-dom": "^18",
 | 
			
		||||
        "react-icons": "^5.1.0",
 | 
			
		||||
| 
						 | 
				
			
			@ -3642,6 +3643,14 @@
 | 
			
		|||
        "react": "^16.8.0 || ^17.0.0 || ^18.0.0"
 | 
			
		||||
      }
 | 
			
		||||
    },
 | 
			
		||||
    "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/normalize-path": {
 | 
			
		||||
      "version": "3.0.0",
 | 
			
		||||
      "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-3.0.0.tgz",
 | 
			
		||||
| 
						 | 
				
			
			@ -3651,6 +3660,11 @@
 | 
			
		|||
        "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/nth-check": {
 | 
			
		||||
      "version": "2.1.1",
 | 
			
		||||
      "resolved": "https://registry.npmjs.org/nth-check/-/nth-check-2.1.1.tgz",
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -16,6 +16,7 @@
 | 
			
		|||
    "classnames": "^2.5.1",
 | 
			
		||||
    "next": "14.2.2",
 | 
			
		||||
    "next-intl": "^3.11.3",
 | 
			
		||||
    "next-nprogress-bar": "^2.3.11",
 | 
			
		||||
    "react": "^18",
 | 
			
		||||
    "react-dom": "^18",
 | 
			
		||||
    "react-icons": "^5.1.0",
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -2,9 +2,14 @@
 | 
			
		|||
 | 
			
		||||
import React from 'react';
 | 
			
		||||
 | 
			
		||||
import { useAppSelector } from '@/store/store';
 | 
			
		||||
import Head from 'next/head';
 | 
			
		||||
 | 
			
		||||
import { AppProgressBar as ProgressBar } from 'next-nprogress-bar';
 | 
			
		||||
 | 
			
		||||
import { useAppSelector } from '@/store/store';
 | 
			
		||||
import { LAYOUT_COLORS_PINK, LAYOUT_COLORS_YELLOW } from '@/constants/colors';
 | 
			
		||||
import { Themes } from '@/meta/settings';
 | 
			
		||||
 | 
			
		||||
const Layout: React.FC<React.PropsWithChildren> = (props) => {
 | 
			
		||||
 | 
			
		||||
  const { children } = props;
 | 
			
		||||
| 
						 | 
				
			
			@ -20,6 +25,12 @@ const Layout: React.FC<React.PropsWithChildren> = (props) => {
 | 
			
		|||
      </Head>
 | 
			
		||||
      <body>
 | 
			
		||||
        <main className="container">{children}</main>
 | 
			
		||||
        <ProgressBar
 | 
			
		||||
          height="4px"
 | 
			
		||||
          color={theme == Themes.dark ? LAYOUT_COLORS_YELLOW : LAYOUT_COLORS_PINK }
 | 
			
		||||
          options={{ showSpinner: false }}
 | 
			
		||||
          shallowRouting
 | 
			
		||||
        />
 | 
			
		||||
      </body>
 | 
			
		||||
    </html>
 | 
			
		||||
  );
 | 
			
		||||
| 
						 | 
				
			
			
 | 
			
		|||
| 
						 | 
				
			
			@ -0,0 +1,2 @@
 | 
			
		|||
export const LAYOUT_COLORS_YELLOW = '#fdd835';
 | 
			
		||||
export const LAYOUT_COLORS_PINK = '#d81b60';
 | 
			
		||||
		Loading…
	
		Reference in New Issue