devias-io / material-kit-react Goto Github PK

React Dashboard made with Material UI’s components. Our pro template contains features like TypeScript version, authentication system with Firebase and Auth0 plus many other

Home Page: http://material-kit-react.devias.io

License: MIT License

JavaScript 2.42% TypeScript 96.97% CSS 0.61%

nodejs reactjs admin-dashboard material-dashboard material-theme admin admin-template dashboard react devias

material-kit-react's Introduction

Devias Kit - React

Free React Admin Dashboard made with MUI's components, React and of course Next.js to boost your app development process!

Free Figma Community File

Duplicate File

Upgrade to PRO Version

We also have a pro version of this product which bundles even more pages and components if you want to save more time and design efforts :)

Free Version (this one)	Devias Kit Pro
8 Pages	80+ Pages
✔ Custom Authentication	✔ Authentication with Amplify, Auth0, Firebase and Supabase
-	✔ Vite Version
-	✔ Dark Mode Support
-	✔ Complete Users Flows
-	✔ Premium Technical Support

Quick start

Clone the repo: git clone https://github.com/devias-io/material-kit-react.git
Make sure your Node.js and npm versions are up to date
Install dependencies: npm install or yarn
Start the server: npm run dev or yarn dev
Open browser: http://localhost:3000

File Structure

Within the download you'll find the following directories and files:

┌── .editorconfig
├── .eslintrc.js
├── .gitignore
├── CHANGELOG.md
├── LICENSE.md
├── next-env.d.ts
├── next.config.js
├── package.json
├── README.md
├── tsconfig.json
├── public
└── src
	├── components
	├── contexts
	├── hooks
	├── lib
	├── styles
	├── types
	└── app
		├── layout.tsx
		├── page.tsx
		├── auth
		└── dashboard

Resources

More freebies like this one: https://devias.io

Reporting Issues:

Github Issues Page

License

Licensed under MIT

Contact Us

Email Us: [email protected]

material-kit-react's People

Contributors

Stargazers

Watchers

Forkers

v1p harismuha123 vhish sshetty2 sekmet bailuo hack121 leandronascimento trickyc0d3r randydom ahmedgmurtaza charlie632 krbergola joserfelix huydeerpets ek018 hhy5277 binler adexot renquanbo ivivanov18 mrscx reddysainathn blopez2010 dsm23 ronal2do jackd942 gatarelib ace53thntu endigo shaunstanislauslau piskinfatih jaanek soumilgada sellalone webface sashikanth-k-zz fattakbar macianito awmoreira kgrvamsi kthos ryansteven79 seanlau555 delwyn gxuebin beltsazartp hiepns sanjeet05 fernandes spraguesy ariverak xufangqing zapatran jdiss hgleyder yfrfelipe pixiumdigital mrskinny gustavonv cyrke jbutko agrojas fabiojansenbr marckuz brihaspati xinzhang barclayl dnbr2002 rigel772 sajidunnar ballon3 ankitagnihotri onocy jeevasang aammjian magnuspl technext gagahkharismanuary alohawu takanorifukuyama icodenet jers73 skshiva90 jun86616396 mdmush ramyx charles2mx iamvazu dendisuhubdy chunkai1312 renatomeireles gomino phoenixrr2113 baker-0 irfanquresh s-ikuta cctoni mohammedsuhail85 marcosechague

material-kit-react's Issues

React-router breaking changes v6.0.0-beta.4

Hello,

React router version v6.0.0-beta.4 release removes the ability for nested route paths to begin with "/". (1)

The Pro package will need to be updated by simply remving "/" or the path from a children route index altogether.

(1) https://github.com/remix-run/react-router/releases/tag/v6.0.0-beta.4

I'm unable to run dashboard

npm install
npm start

There might be a problem with the project dependency tree.
It is likely not a bug in Create React App, but something you need to fix locally.

The react-scripts package provided by Create React App requires a dependency:

"eslint": "^6.6.0"

Don't try to install it manually: your package manager does it automatically.
However, a different version of eslint was detected higher up in the tree:

/Videos/react-material-dashboard-master/node_modules/eslint (version: 5.16.0)

Manually installing incompatible versions is known to cause hard-to-debug issues.

If you would prefer to ignore this check, add SKIP_PREFLIGHT_CHECK=true to an .env file in your project.
That will permanently disable this message but you might encounter other issues.

how to integrate case-sensitive-paths-webpack-plugin in material-kit-react

Hi sorry my english is so bad.

i have the next problem.

Is there a way to add that library to avoid that problem?

Thanks.

Lists using PerfectScrollbar have issues on OSX chrome. It triggers swipe back

Hi!
I bought recently the typescript version.

I spotted this bug on my version and the demo one.

How to reproduce:

Use a mac with chrome and Gesture: swipe back --> Go back, activated
Go to client listing: https://material-kit-pro-react.devias.io/dashboard/customers
Resize window until you see X scrolling
Swipe right with 2 fingers: Everything ok
Swipe left with 2 fingers: Browser back instead of scroll left!

I noticed that if I scroll up/down and then left, it works ok.
Also I removed the PerfectScrollbar component and it workend ok.

Upgrade material-ui 4.9.3 breaks styles

Hi, when I upgrade material-ui/core to latest version I get broken font and css styles. Can you advice how to fix it?

Uncaught Error while using `useRoutes`: A <Route> is only ever to be used as the child of <Routes> element, never rendered directly. Please wrap your <Route> in a <Routes>.

Getting this error when i tried to add useRoutes to render the routes. Could anyone help to find what the issue is?

App.tsx

const App = () => {
    return (
        <div className="appCover dark">
		<Suspense fallback="Loader">
			<Router>
				<ScrollToTop />
				<AppRoutes />
			</Router>
		</Suspense>
        </div>
    );
}

AppRoutes.tsx

const Index = () => {
	return useRoutes(routes())
}

routes.tsx

const appRoutes = (): RouteObject[] => {

	return [
		{
			path: "/sign-in",
			element: <PublicRoute>
				<SignIn />
			</PublicRoute>
		},
		{
			path: "/",
			element: <PrivateRoute>
				<Dashboard />
			</PrivateRoute>
		},
		{
			path: "*",
			element: <PublicRoute>
				<ErrorPages />
			</PublicRoute>,
			children: []
		},
	]
};

window.scrollTo(0,0) doesn't work with Dashboard Layout components

Dear material-kit-react friends,

window.scrollTo(0,0) stops working when I am using the dashboard template.
window.scrollTo(0,0) is the recommended way for react-router to navigate back to the top when a page changes.

Because of this issue it is hard for users to navigate around the website (for example if you scroll down and then hit a link, you enter the next page at the bottom).

Does anyone find a good solution ? Hope to hear your expertise.

--Luke

Expected LF but found CRLF on W10 VSCode

I downloaded the template and created a few new components by copy-pasting some existing components and tweaked the text only. When I started the app, it crashed and gave me this error
Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style

My question is, Was your template written on Linux? If so, what are the best ways to make the template work on W10 code editors? Or what could be the linebreak settings I can do on my end to keep my code running?

The navbar toggle button doesn't work

Reproduction steps:

Open the live example
Resize the browser window to make it the same as mobile resolution.
Click on the button to display the navbar.

Expected behavior:

The navbar should be displayed when the button is clicked

Actual behavior:

The navbar toggle button doesn't work

still supporting CRA in free or pro version?

Hi, thanks for a cool template!

i'm considering using this template for an existing project made with CRA.
Referring to the changelog, it migrated from CRA to Next.js in v5.0.0, but do you still support CRA?

project status?

hi - I like the style of this project, but I'm worried that your domain is down and it seems to have died. are you still supporting the project?

https://devias.io

Nextjs version?

Is there a nextjs version available?
Has anyone used it with nextjs?

Typescript question.

Does this repository has typescript version?

Devias Dashboard Design Library Kit broken Link

Could you fix this 404 error for the Figma link -> https://www.figma.com/community/file/1039837897183395483/Devias-Dashboard-Design-Library-Kit It is the one in the readme file?

How do I integrate redux?

Hey!

Could you please explain how would I connect redux to this template?

From what I know so far, I need some kind of "root" component where I would wrap everything with "", but I can't seem to find a proper place to do so.

Any form of guidance would be super helpful, thanks!

Import Error

Attempted import error: 'useRoutes' is not exported from 'react-router-dom'

Update to MUI v5

Is there any plan to update to the newest MUI v5?

Add `exact` property for NavItem in NavBar

I got an issue in case I have defined 2 routes as / and /product and when the /product route is active, both items in NavBar are active as well.

I'd suggest that we add one more exact property for RouterLink to avoid this problem for someone who is not familiar with react-router-dom don't get confused in this case.

<Button
    exact // new added
    activeClassName={classes.active}
    className={classes.button}
    component={RouterLink}
    to={href}
>

ref: https://github.com/devias-io/react-material-dashboard/blob/3e74c66f509afb99acd5960ed9a217e34fd99b2d/src/layouts/DashboardLayout/NavBar/NavItem.js#L58

missing sidebar on hd screen

A PostCSS Plugin was passed as a function using require(), but it must be provided as a string

Starting the server with npm run dev fails with the following message:

alex@alex-ubuntu:~/dev/src/material-kit-react$ npm run dev

> [email protected] dev
> next

ready - started server on 0.0.0.0:3000, url: http://localhost:3000
Error: A PostCSS Plugin was passed as a function using require(), but it must be provided as a string.
Read more: https://nextjs.org/docs/messages/postcss-shape
Error: Malformed PostCSS Configuration
    at /home/alex/dev/src/material-kit-react/node_modules/next/dist/build/webpack/config/blocks/css/plugins.js:156:19
    at Array.forEach (<anonymous>)
    at Object.getPostCssPlugins (/home/alex/dev/src/material-kit-react/node_modules/next/dist/build/webpack/config/blocks/css/plugins.js:130:13)
    at async Object.__overrideCssConfiguration (/home/alex/dev/src/material-kit-react/node_modules/next/dist/build/webpack/config/blocks/css/overrideCssConfiguration.js:15:28)
    at async Object.getBaseWebpackConfig [as default] (/home/alex/dev/src/material-kit-react/node_modules/next/dist/build/webpack-config.js:1525:9)
    at async Promise.all (index 0)
    at async Span.traceAsyncFn (/home/alex/dev/src/material-kit-react/node_modules/next/dist/trace/trace.js:74:20)
    at async Span.traceAsyncFn (/home/alex/dev/src/material-kit-react/node_modules/next/dist/trace/trace.js:74:20)
    at async HotReloader.start (/home/alex/dev/src/material-kit-react/node_modules/next/dist/server/dev/hot-reloader.js:325:25)
    at async DevServer.prepare (/home/alex/dev/src/material-kit-react/node_modules/next/dist/server/dev/next-dev-server.js:289:9)

Environment:

Nodejs: v14.15.4
Ubuntu 18.04

Demo has error

I cloned the repo, ran npm install then ran it with npm run dev, then I get this error on localhost:3000:

Warning: Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:

You might have mismatching versions of React and the renderer (such as React DOM)
You might be breaking the Rules of Hooks
You might have more than one copy of React in the same app
See https://reactjs.org/link/invalid-hook-call for tips about how to debug and fix this problem.

TypeError: Cannot read properties of null (reading 'useContext')
at Object.useContext (C:\Users\User\Workspace5\material-kit-react\node_modules\react\cjs\react.development.js:1618:21)
at Html (webpack-internal:///./node_modules/next/dist/pages/_document.js:643:106)
at renderWithHooks (c:\Users\User\Workspace5\material-kit-react\node_modules\react-dom\cjs\react-dom-server-legacy.browser.development.js:5661:16)
at renderIndeterminateComponent (c:\Users\User\Workspace5\material-kit-react\node_modules\react-dom\cjs\react-dom-server-legacy.browser.development.js:5734:15)
at renderElement (c:\Users\User\Workspace5\material-kit-react\node_modules\react-dom\cjs\react-dom-server-legacy.browser.development.js:5949:7)
at renderNodeDestructiveImpl (c:\Users\User\Workspace5\material-kit-react\node_modules\react-dom\cjs\react-dom-server-legacy.browser.development.js:6107:11)
at renderNodeDestructive (c:\Users\User\Workspace5\material-kit-react\node_modules\react-dom\cjs\react-dom-server-legacy.browser.development.js:6079:14)
at finishClassComponent (c:\Users\User\Workspace5\material-kit-react\node_modules\react-dom\cjs\react-dom-server-legacy.browser.development.js:5691:3)
at renderClassComponent (c:\Users\User\Workspace5\material-kit-react\node_modules\react-dom\cjs\react-dom-server-legacy.browser.development.js:5699:3)
at renderElement (c:\Users\User\Workspace5\material-kit-react\node_modules\react-dom\cjs\react-dom-server-legacy.browser.development.js:5946:7)

npm version is 8.19.2

Hidden component

The Hidden component is out of material ui 5 version

./src/components/DashboardSidebar.js
Attempted import error: 'Hidden' is not exported from '@material-ui/core'.

How to create multiple menu?

next export lacking all html tags

I'm using the PRO version of this.

I'm using next build && next export and I'm copying out directory to S3. But for some reason my generated index.html file does not contain all html tags like a regular fully static page. Most of the index.html are <script> tags with JS which builds the website view.

I'm having a hard time getting this to work correctly.

Table pagination not working

Table pagination does not seem to work properly when we click on the next page button(in default mode can be reproduced when items per page are set to 5).

This is in customer page.

Does this template support collapsing of sidebar in free or pro version?

Hi,
Thanks for an amazing dashboard template. Out team was thinking of using this in one of our projects. Wanted to know if this support's the feature of sidebar collapsing with a button, where only the icons are visible in sidebar(In Desktop view)
If not, is that feature available in the pro version?

Slide Menu is not closing

Hi,
Thanks for the awesome framework. I am try this framework for my personal project. I am facing an issue with the Slide Menu. When the page is render in a small window the side menu became burger menu. When we click the burger menu, it slides from the right. If we click any of the navigation link, the menu is not closing but in page renders properly. Please let me know is there is any workaround.
Thanks.

fails to compile

Failed to compile.

./node_modules/react-perfect-scrollbar/dist/css/styles.css (./node_modules/css-loader/dist/cjs.js??ref--6-oneOf-3-1!./node_modules/postcss-loader/src??postcss!./node_modules/react-perfect-scrollbar/dist/css/styles.css)
Error: No valid exports main found for '/Users/mpa/dev/react-material-dashboard/node_modules/colorette'

after:

➜  react-material-dashboard git:(master) node --version
v13.3.0
➜  react-material-dashboard git:(master) npm version
{
  'react-material-dashboard': '1.0.0',
  npm: '6.13.1',
  ares: '1.15.0',
  brotli: '1.0.7',
  cldr: '35.1',
  icu: '64.2',
  llhttp: '2.0.1',
  modules: '79',
  napi: '5',
  nghttp2: '1.40.0',
  node: '13.3.0',
  openssl: '1.1.1d',
  tz: '2019c',
  unicode: '12.1',
  uv: '1.33.1',
  v8: '7.9.317.25-node.23',
  zlib: '1.2.11'
}
➜  react-material-dashboard git:(master) npm install
npm WARN [email protected] requires a peer of typescript@>=2.8.0 || >= 3.2.0-dev || >= 3.3.0-dev || >= 3.4.0-dev || >= 3.5.0-dev || >= 3.6.0-dev || >= 3.6.0-beta || >= 3.7.0-dev || >= 3.7.0-beta but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] No repository field.
npm WARN [email protected] No license field.

audited 1718 packages in 6.147s

67 packages are looking for funding
  run `npm fund` for details

found 2 vulnerabilities (1 low, 1 high)
  run `npm audit fix` to fix them, or `npm audit` for details

Running Error - #130 Similarity

similar to another user, I'm getting a blank page when running. I'm on Windows 10

I followed the steps you mentioned in the post:

#130 (comment)

Invalid left-hand side in assignment

problem is fixed

How to keep loading screen on until the end of data call for the edit post screen?

I want to keep loading screen on until I set the values from database to the text fields. How can I achieve this?

Or what is the best practice for this purpose?

running error

getting blank page when running

makeStyles has moved from material-ui/core to material-ui/styles

diff --git a/src/components/GlobalStyles.js b/src/components/GlobalStyles.js
index 7cf9cc4..c322806 100644
--- a/src/components/GlobalStyles.js
+++ b/src/components/GlobalStyles.js
@@ -1,4 +1,4 @@
-import { createStyles, makeStyles } from '@material-ui/core';
+import { createStyles, makeStyles } from '@material-ui/styles';

 const useStyles = makeStyles(() => createStyles({
   '@global': {

Link to Figma file broken

Hi,

I'd like to access the Figma file referenced in the README, but the link is broken and refers to a 404.
Could somebody provide a new link?

Thanks in advance!

Plans to support Typescript?

I am evaluating this dashboard for use with a product I am building. Are there any plans to support Typescript or third-party mechanisms to enable Typescript support?

Sorry if this is a repeat of https://github.com/devias-io/react-material-dashboard/issues/16. It was closed and I didn't want to piggyback on a closed issue.

Figma / Sketch download is not working

Hi,

Thank you so much for this template. I've tried to download the figma/sketch but it's failing.

When building electron-react app with devias kit pro theme and want to build for both mac and windows. App is installing but failed to load with error

Issue Details
Electron Version:
11.1.1
Operating System:
macOS 10.13.6 / Windows 10
Screenshots:

Additional Information
My package.json
{
"name": "@devias-io/material-kit-pro-react",
"author": "DeviasIO",
"licence": "UNLICENSED",
"version": "3.1.0",
"private": true,
"proxy": "https://doctorscan.com.au/",
"scripts": {
"react-start": "react-scripts start",
"react-build": "react-scripts build",
"react-test": "react-scripts test --env=jsdom",
"react-eject": "react-scripts eject",
"electron-build": "electron-builder",
"release": "yarn react-build && electron-builder --publish=always",
"build": "yarn react-build && yarn electron-build",
"start": "concurrently "cross-env BROWSER=none yarn react-start" "wait-on http://localhost:3000 && electron .""
},
"browserslist": {
"production": [
">0.2%",
"ie 11",
"not dead",
"not op_mini all"
],
"development": [
"ie 11",
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
},
"dependencies": {
"@auth0/auth0-spa-js": "^1.11.0",
"@date-io/core": "^2.8.0",
"@date-io/moment": "^1.3.13",
"@fullcalendar/core": "^4.4.2",
"@fullcalendar/daygrid": "^4.4.2",
"@fullcalendar/interaction": "^4.4.2",
"@fullcalendar/list": "^4.4.2",
"@fullcalendar/react": "^4.4.2",
"@fullcalendar/timegrid": "^4.4.2",
"@fullcalendar/timeline": "^4.4.2",
"@material-ui/core": "^4.11.0",
"@material-ui/icons": "^4.9.1",
"@material-ui/lab": "^4.0.0-alpha.56",
"@material-ui/pickers": "^3.2.10",
"@material-ui/styles": "^4.10.0",
"@mdx-js/react": "^1.6.14",
"@react-pdf/renderer": "^1.6.10",
"@reduxjs/toolkit": "^1.4.0",
"apexcharts": "^3.19.3",
"awesome-phonenumber": "^2.40.0",
"aws-s3": "^2.0.5",
"axios": "^0.19.2",
"axios-mock-adapter": "^1.18.2",
"change-case": "^4.1.1",
"chart.js": "^2.9.3",
"chroma-js": "^2.1.0",
"clsx": "^1.1.1",
"create-react-class": "^15.7.0",
"draft-js": "^0.11.7",
"firebase": "^8.1.1",
"formik": "^2.1.5",
"history": "^4.10.1",
"immer": "^6.0.9",
"immutable": "^4.0.0-rc.12",
"js-cookie": "^2.2.1",
"jsonwebtoken": "^8.5.1",
"jss": "^10.3.0",
"jss-rtl": "^0.3.0",
"jwt-decode": "^2.2.0",
"lodash": "^4.17.19",
"material-ui-phone-number": "^2.2.6",
"material-ui-time-picker": "^1.3.0",
"moment": "^2.28.0",
"notistack": "^0.9.17",
"nprogress": "^0.2.0",
"prismjs": "^1.20.0",
"prop-types": "^15.7.2",
"react": "^16.13.1",
"react-add-to-calendar": "^0.1.5",
"react-apexcharts": "^1.3.7",
"react-app-polyfill": "^1.0.6",
"react-beautiful-dnd": "^13.0.0",
"react-chartjs-2": "^2.9.0",
"react-dom": "^16.13.1",
"react-draft-wysiwyg": "^1.14.5",
"react-dropzone": "^10.2.2",
"react-feather": "^2.0.8",
"react-helmet": "^5.2.1",
"react-markdown": "^4.3.1",
"react-modal-image": "^2.5.0",
"react-moment": "^0.9.7",
"react-pdf": "^5.1.0",
"react-perfect-scrollbar": "^1.5.8",
"react-quill": "^1.3.5",
"react-redux": "^7.2.0",
"react-router": "^5.2.0",
"react-router-dom": "^5.2.0",
"react-scripts": "^3.4.1",
"react-select": "^3.1.0",
"react-webcam": "^5.2.1",
"redux": "^4.0.5",
"redux-devtools-extension": "^2.13.8",
"redux-form": "^8.3.6",
"redux-thunk": "^2.3.0",
"socket.io-client": "^2.3.1",
"sweetalert": "^2.1.2",
"sweetalert2": "^10.3.0",
"twilio-client": "^1.12.5",
"twilio-video": "^2.7.2",
"uuid": "^7.0.3",
"yup": "^0.28.5",
"cross-env": "^7.0.3",
"electron-is-dev": "^1.2.0",
"electron-updater": "^4.3.5"
},
"devDependencies": {
"eslint": "^6.8.0",
"eslint-config-airbnb": "^18.2.0",
"eslint-config-prettier": "^6.11.0",
"eslint-plugin-import": "^2.22.0",
"eslint-plugin-jsx-a11y": "^6.3.1",
"eslint-plugin-mdx": "^1.7.1",
"eslint-plugin-prettier": "^3.1.4",
"eslint-plugin-react": "^7.20.3",
"eslint-plugin-react-hooks": "^2.5.1",
"mdx-loader": "^3.0.2",
"numeral": "^2.0.6",
"prettier": "^1.19.1",
"typescript": "^3.9.7",
"concurrently": "^5.3.0",
"electron": "^11.1.1",
"electron-builder": "^22.9.1",
"electron-mocha": "^10.0.0",
"electron-rebuild": "^2.3.4",
"wait-on": "^5.2.1"
},
"main": "public/electron.js",
"homepage": "./"
}

Support of virtual list

Hi,

does your normal or pro kit support virtual lists?

Error: useRoutes() may be used only in the context of a <Router> component

App.js throw Error: useRoutes() may be used only in the context of a component

This does not work:

const App = () => {
  const routing = useRoutes(routes);
  return (
    <ThemeProvider theme={theme}>
      <GlobalStyles />
      {routing}
    </ThemeProvider>
  );
};

It looks like we need to wrap app inside Router like so:

const AppRoute = () => {
    const routing = useRoutes(routes);
    return (
        <ThemeProvider theme={theme}>
            <GlobalStyles />
            {routing}0
        </ThemeProvider>
    );
}
const App = () => {
    return (
        <Router>
            <AppRoute />
        </Router>
    );
};

Free Figma Comunity File Not Found (404)

Link not found in Free Figma Community File section.

bar chart triggers several deprecated warnings

Dear material-kit-react friends,

bar chart has several deprecated usages as shown in attached screenshot, including Axes.barPercentage, barThcknes, etc.

We are using Ubuntu 18.04, Chrome Version 90.0.4430.93 (Official Build) (64-bit).
Hope to hear your expertise to fix these warnings.

Best,
--Luke

Cannot build my custom components.

I cloned this git repo and add some custom components to it. When I use npm start, it works perfectly and showed all the custom components. But when I use npm run build and serve with nestjs static serve or serve -s build then it doesn't show my custom components.

Can not make it work

Hello,

When I try to run this react project it gives me these errors:

info  - Checking validity of types
info  - Creating an optimized production build
info  - Compiled successfully
info  - Collecting page data
[    ] info  - Generating static pages (0/9)
Error occurred prerendering page "/404". Read more: https://nextjs.org/docs/messages/prerender-error
Error: Minified React error #321; visit https://reactjs.org/docs/error-decoder.html?invariant=321 for the full message or use the non-minified dev environment for full errors and additional helpful warnings.
    at S (C:\Users\goto\Documents\Proyectos\Equipos 2021\Frontend\node_modules\react\cjs\react.production.min.js:18:327)
    at Object.exports.useContext (C:\Users\goto\Documents\Proyectos\Equipos 2021\Frontend\node_modules\react\cjs\react.production.min.js:22:269)
    at Head (C:\Users\goto\Documents\Proyectos\Equipos 2021\Frontend\node_modules\next\dist\shared\lib\head.js:170:34)
    at d (C:\Users\goto\AppData\Roaming\npm\node_modules\next\node_modules\react-dom\cjs\react-dom-server.node.production.min.js:33:498)
    at bb (C:\Users\goto\AppData\Roaming\npm\node_modules\next\node_modules\react-dom\cjs\react-dom-server.node.production.min.js:36:16)
    at a.b.render (C:\Users\goto\AppData\Roaming\npm\node_modules\next\node_modules\react-dom\cjs\react-dom-server.node.production.min.js:42:43)
    at a.b.read (C:\Users\goto\AppData\Roaming\npm\node_modules\next\node_modules\react-dom\cjs\react-dom-server.node.production.min.js:41:83)
    at Object.exports.renderToString (C:\Users\goto\AppData\Roaming\npm\node_modules\next\node_modules\react-dom\cjs\react-dom-server.node.production.min.js:52:138)
    at renderPage (C:\Users\goto\AppData\Roaming\npm\node_modules\next\dist\server\render.js:686:46)
    at Object.ctx.renderPage (C:\Users\goto\Documents\Proyectos\Equipos 2021\Frontend\.next\server\pages\_document.js:102:26)

Error occurred prerendering page "/account". Read more: https://nextjs.org/docs/messages/prerender-error
Error: Minified React error #321; visit https://reactjs.org/docs/error-decoder.html?invariant=321 for the full message or use the non-minified dev environment for full errors and additional helpful warnings.
    at S (C:\Users\goto\Documents\Proyectos\Equipos 2021\Frontend\node_modules\react\cjs\react.production.min.js:18:327)
    at Object.exports.useContext (C:\Users\goto\Documents\Proyectos\Equipos 2021\Frontend\node_modules\react\cjs\react.production.min.js:22:269)
    at Head (C:\Users\goto\Documents\Proyectos\Equipos 2021\Frontend\node_modules\next\dist\shared\lib\head.js:170:34)
    at d (C:\Users\goto\AppData\Roaming\npm\node_modules\next\node_modules\react-dom\cjs\react-dom-server.node.production.min.js:33:498)
    at bb (C:\Users\goto\AppData\Roaming\npm\node_modules\next\node_modules\react-dom\cjs\react-dom-server.node.production.min.js:36:16)
    at a.b.render (C:\Users\goto\AppData\Roaming\npm\node_modules\next\node_modules\react-dom\cjs\react-dom-server.node.production.min.js:42:43)
    at a.b.read (C:\Users\goto\AppData\Roaming\npm\node_modules\next\node_modules\react-dom\cjs\react-dom-server.node.production.min.js:41:83)
    at Object.exports.renderToString (C:\Users\goto\AppData\Roaming\npm\node_modules\next\node_modules\react-dom\cjs\react-dom-server.node.production.min.js:52:138)
    at renderPage (C:\Users\goto\AppData\Roaming\npm\node_modules\next\dist\server\render.js:686:46)
    at Object.ctx.renderPage (C:\Users\goto\Documents\Proyectos\Equipos 2021\Frontend\.next\server\pages\_document.js:102:26)

Error occurred prerendering page "/products". Read more: https://nextjs.org/docs/messages/prerender-error
Error: Minified React error #321; visit https://reactjs.org/docs/error-decoder.html?invariant=321 for the full message or use the non-minified dev environment for full errors and additional helpful warnings.
    at S (C:\Users\goto\Documents\Proyectos\Equipos 2021\Frontend\node_modules\react\cjs\react.production.min.js:18:327)
    at Object.exports.useContext (C:\Users\goto\Documents\Proyectos\Equipos 2021\Frontend\node_modules\react\cjs\react.production.min.js:22:269)
    at Head (C:\Users\goto\Documents\Proyectos\Equipos 2021\Frontend\node_modules\next\dist\shared\lib\head.js:170:34)
    at d (C:\Users\goto\AppData\Roaming\npm\node_modules\next\node_modules\react-dom\cjs\react-dom-server.node.production.min.js:33:498)
    at bb (C:\Users\goto\AppData\Roaming\npm\node_modules\next\node_modules\react-dom\cjs\react-dom-server.node.production.min.js:36:16)
    at a.b.render (C:\Users\goto\AppData\Roaming\npm\node_modules\next\node_modules\react-dom\cjs\react-dom-server.node.production.min.js:42:43)
    at a.b.read (C:\Users\goto\AppData\Roaming\npm\node_modules\next\node_modules\react-dom\cjs\react-dom-server.node.production.min.js:41:83)
    at Object.exports.renderToString (C:\Users\goto\AppData\Roaming\npm\node_modules\next\node_modules\react-dom\cjs\react-dom-server.node.production.min.js:52:138)
    at renderPage (C:\Users\goto\AppData\Roaming\npm\node_modules\next\dist\server\render.js:686:46)
    at Object.ctx.renderPage (C:\Users\goto\Documents\Proyectos\Equipos 2021\Frontend\.next\server\pages\_document.js:102:26)

Error occurred prerendering page "/settings". Read more: https://nextjs.org/docs/messages/prerender-error
Error: Minified React error #321; visit https://reactjs.org/docs/error-decoder.html?invariant=321 for the full message or use the non-minified dev environment for full errors and additional helpful warnings.
    at S (C:\Users\goto\Documents\Proyectos\Equipos 2021\Frontend\node_modules\react\cjs\react.production.min.js:18:327)
    at Object.exports.useContext (C:\Users\goto\Documents\Proyectos\Equipos 2021\Frontend\node_modules\react\cjs\react.production.min.js:22:269)
    at Head (C:\Users\goto\Documents\Proyectos\Equipos 2021\Frontend\node_modules\next\dist\shared\lib\head.js:170:34)
    at d (C:\Users\goto\AppData\Roaming\npm\node_modules\next\node_modules\react-dom\cjs\react-dom-server.node.production.min.js:33:498)
    at bb (C:\Users\goto\AppData\Roaming\npm\node_modules\next\node_modules\react-dom\cjs\react-dom-server.node.production.min.js:36:16)
    at a.b.render (C:\Users\goto\AppData\Roaming\npm\node_modules\next\node_modules\react-dom\cjs\react-dom-server.node.production.min.js:42:43)
    at a.b.read (C:\Users\goto\AppData\Roaming\npm\node_modules\next\node_modules\react-dom\cjs\react-dom-server.node.production.min.js:41:83)
    at Object.exports.renderToString (C:\Users\goto\AppData\Roaming\npm\node_modules\next\node_modules\react-dom\cjs\react-dom-server.node.production.min.js:52:138)
    at renderPage (C:\Users\goto\AppData\Roaming\npm\node_modules\next\dist\server\render.js:686:46)
    at Object.ctx.renderPage (C:\Users\goto\Documents\Proyectos\Equipos 2021\Frontend\.next\server\pages\_document.js:102:26)

Error occurred prerendering page "/login". Read more: https://nextjs.org/docs/messages/prerender-error
Error: Minified React error #321; visit https://reactjs.org/docs/error-decoder.html?invariant=321 for the full message or use the non-minified dev environment for full errors and additional helpful warnings.
    at S (C:\Users\goto\Documents\Proyectos\Equipos 2021\Frontend\node_modules\react\cjs\react.production.min.js:18:327)
    at Object.exports.useContext (C:\Users\goto\Documents\Proyectos\Equipos 2021\Frontend\node_modules\react\cjs\react.production.min.js:22:269)
    at Head (C:\Users\goto\Documents\Proyectos\Equipos 2021\Frontend\node_modules\next\dist\shared\lib\head.js:170:34)
    at d (C:\Users\goto\AppData\Roaming\npm\node_modules\next\node_modules\react-dom\cjs\react-dom-server.node.production.min.js:33:498)
    at bb (C:\Users\goto\AppData\Roaming\npm\node_modules\next\node_modules\react-dom\cjs\react-dom-server.node.production.min.js:36:16)
    at a.b.render (C:\Users\goto\AppData\Roaming\npm\node_modules\next\node_modules\react-dom\cjs\react-dom-server.node.production.min.js:42:43)
    at a.b.read (C:\Users\goto\AppData\Roaming\npm\node_modules\next\node_modules\react-dom\cjs\react-dom-server.node.production.min.js:41:83)
    at Object.exports.renderToString (C:\Users\goto\AppData\Roaming\npm\node_modules\next\node_modules\react-dom\cjs\react-dom-server.node.production.min.js:52:138)
    at renderPage (C:\Users\goto\AppData\Roaming\npm\node_modules\next\dist\server\render.js:686:46)
    at Object.ctx.renderPage (C:\Users\goto\Documents\Proyectos\Equipos 2021\Frontend\.next\server\pages\_document.js:102:26)

Error occurred prerendering page "/register". Read more: https://nextjs.org/docs/messages/prerender-error
Error: Minified React error #321; visit https://reactjs.org/docs/error-decoder.html?invariant=321 for the full message or use the non-minified dev environment for full errors and additional helpful warnings.
    at S (C:\Users\goto\Documents\Proyectos\Equipos 2021\Frontend\node_modules\react\cjs\react.production.min.js:18:327)
    at Object.exports.useContext (C:\Users\goto\Documents\Proyectos\Equipos 2021\Frontend\node_modules\react\cjs\react.production.min.js:22:269)
    at Head (C:\Users\goto\Documents\Proyectos\Equipos 2021\Frontend\node_modules\next\dist\shared\lib\head.js:170:34)
    at d (C:\Users\goto\AppData\Roaming\npm\node_modules\next\node_modules\react-dom\cjs\react-dom-server.node.production.min.js:33:498)
    at bb (C:\Users\goto\AppData\Roaming\npm\node_modules\next\node_modules\react-dom\cjs\react-dom-server.node.production.min.js:36:16)
    at a.b.render (C:\Users\goto\AppData\Roaming\npm\node_modules\next\node_modules\react-dom\cjs\react-dom-server.node.production.min.js:42:43)
    at a.b.read (C:\Users\goto\AppData\Roaming\npm\node_modules\next\node_modules\react-dom\cjs\react-dom-server.node.production.min.js:41:83)
    at Object.exports.renderToString (C:\Users\goto\AppData\Roaming\npm\node_modules\next\node_modules\react-dom\cjs\react-dom-server.node.production.min.js:52:138)
    at renderPage (C:\Users\goto\AppData\Roaming\npm\node_modules\next\dist\server\render.js:686:46)
    at Object.ctx.renderPage (C:\Users\goto\Documents\Proyectos\Equipos 2021\Frontend\.next\server\pages\_document.js:102:26)

Error occurred prerendering page "/500". Read more: https://nextjs.org/docs/messages/prerender-error
Error: Minified React error #321; visit https://reactjs.org/docs/error-decoder.html?invariant=321 for the full message or use the non-minified dev environment for full errors and additional helpful warnings.
    at S (C:\Users\goto\Documents\Proyectos\Equipos 2021\Frontend\node_modules\react\cjs\react.production.min.js:18:327)
    at Object.exports.useContext (C:\Users\goto\Documents\Proyectos\Equipos 2021\Frontend\node_modules\react\cjs\react.production.min.js:22:269)
    at Head (C:\Users\goto\Documents\Proyectos\Equipos 2021\Frontend\node_modules\next\dist\shared\lib\head.js:170:34)
    at d (C:\Users\goto\AppData\Roaming\npm\node_modules\next\node_modules\react-dom\cjs\react-dom-server.node.production.min.js:33:498)
    at bb (C:\Users\goto\AppData\Roaming\npm\node_modules\next\node_modules\react-dom\cjs\react-dom-server.node.production.min.js:36:16)
    at a.b.render (C:\Users\goto\AppData\Roaming\npm\node_modules\next\node_modules\react-dom\cjs\react-dom-server.node.production.min.js:42:43)
    at a.b.read (C:\Users\goto\AppData\Roaming\npm\node_modules\next\node_modules\react-dom\cjs\react-dom-server.node.production.min.js:41:83)
    at Object.exports.renderToString (C:\Users\goto\AppData\Roaming\npm\node_modules\next\node_modules\react-dom\cjs\react-dom-server.node.production.min.js:52:138)
    at renderPage (C:\Users\goto\AppData\Roaming\npm\node_modules\next\dist\server\render.js:686:46)
    at Object.ctx.renderPage (C:\Users\goto\Documents\Proyectos\Equipos 2021\Frontend\.next\server\pages\_document.js:102:26)

Error occurred prerendering page "/". Read more: https://nextjs.org/docs/messages/prerender-error
Error: Minified React error #321; visit https://reactjs.org/docs/error-decoder.html?invariant=321 for the full message or use the non-minified dev environment for full errors and additional helpful warnings.
    at S (C:\Users\goto\Documents\Proyectos\Equipos 2021\Frontend\node_modules\react\cjs\react.production.min.js:18:327)
    at Object.exports.useContext (C:\Users\goto\Documents\Proyectos\Equipos 2021\Frontend\node_modules\react\cjs\react.production.min.js:22:269)
    at Head (C:\Users\goto\Documents\Proyectos\Equipos 2021\Frontend\node_modules\next\dist\shared\lib\head.js:170:34)
    at d (C:\Users\goto\AppData\Roaming\npm\node_modules\next\node_modules\react-dom\cjs\react-dom-server.node.production.min.js:33:498)
    at bb (C:\Users\goto\AppData\Roaming\npm\node_modules\next\node_modules\react-dom\cjs\react-dom-server.node.production.min.js:36:16)
    at a.b.render (C:\Users\goto\AppData\Roaming\npm\node_modules\next\node_modules\react-dom\cjs\react-dom-server.node.production.min.js:42:43)
    at a.b.read (C:\Users\goto\AppData\Roaming\npm\node_modules\next\node_modules\react-dom\cjs\react-dom-server.node.production.min.js:41:83)
    at Object.exports.renderToString (C:\Users\goto\AppData\Roaming\npm\node_modules\next\node_modules\react-dom\cjs\react-dom-server.node.production.min.js:52:138)
    at renderPage (C:\Users\goto\AppData\Roaming\npm\node_modules\next\dist\server\render.js:686:46)
    at Object.ctx.renderPage (C:\Users\goto\Documents\Proyectos\Equipos 2021\Frontend\.next\server\pages\_document.js:102:26)

Error occurred prerendering page "/customers". Read more: https://nextjs.org/docs/messages/prerender-error
Error: Minified React error #321; visit https://reactjs.org/docs/error-decoder.html?invariant=321 for the full message or use the non-minified dev environment for full errors and additional helpful warnings.
    at S (C:\Users\goto\Documents\Proyectos\Equipos 2021\Frontend\node_modules\react\cjs\react.production.min.js:18:327)
    at Object.exports.useContext (C:\Users\goto\Documents\Proyectos\Equipos 2021\Frontend\node_modules\react\cjs\react.production.min.js:22:269)
    at Head (C:\Users\goto\Documents\Proyectos\Equipos 2021\Frontend\node_modules\next\dist\shared\lib\head.js:170:34)
    at d (C:\Users\goto\AppData\Roaming\npm\node_modules\next\node_modules\react-dom\cjs\react-dom-server.node.production.min.js:33:498)
    at bb (C:\Users\goto\AppData\Roaming\npm\node_modules\next\node_modules\react-dom\cjs\react-dom-server.node.production.min.js:36:16)
    at a.b.render (C:\Users\goto\AppData\Roaming\npm\node_modules\next\node_modules\react-dom\cjs\react-dom-server.node.production.min.js:42:43)
    at a.b.read (C:\Users\goto\AppData\Roaming\npm\node_modules\next\node_modules\react-dom\cjs\react-dom-server.node.production.min.js:41:83)
    at Object.exports.renderToString (C:\Users\goto\AppData\Roaming\npm\node_modules\next\node_modules\react-dom\cjs\react-dom-server.node.production.min.js:52:138)
    at renderPage (C:\Users\goto\AppData\Roaming\npm\node_modules\next\dist\server\render.js:686:46)
    at Object.ctx.renderPage (C:\Users\goto\Documents\Proyectos\Equipos 2021\Frontend\.next\server\pages\_document.js:102:26)
info  - Generating static pages (9/9)

> Build error occurred
Error: Export encountered errors on following paths:
        /
        /404
        /_error: /500
        /account
        /customers
        /login
        /products
        /register
        /settings
    at C:\Users\goto\AppData\Roaming\npm\node_modules\next\dist\export\index.js:500:19
    at runMicrotasks (<anonymous>)
    at processTicksAndRejections (node:internal/process/task_queues:96:5)
    at async Span.traceAsyncFn (C:\Users\goto\AppData\Roaming\npm\node_modules\next\dist\trace\trace.js:74:20)
    at async C:\Users\goto\AppData\Roaming\npm\node_modules\next\dist\build\index.js:987:17
    at async Span.traceAsyncFn (C:\Users\goto\AppData\Roaming\npm\node_modules\next\dist\trace\trace.js:74:20)
    at async C:\Users\goto\AppData\Roaming\npm\node_modules\next\dist\build\index.js:861:13
    at async Span.traceAsyncFn (C:\Users\goto\AppData\Roaming\npm\node_modules\next\dist\trace\trace.js:74:20)
    at async Object.build [as default] (C:\Users\goto\AppData\Roaming\npm\node_modules\next\dist\build\index.js:82:25)

System:

Node.js 16
Installed next 12.0.7 globally

Commands executed:

npm i
next build

How to pass an initial array into useSelection?

I would like to load the table select component with an initial list of selected items but I can't seem to figure out how. Any suggestions?

Error "Module not found"

App loads to dashboard page and not login

Whenever I load the app, it automatically redirects to /app/dashboard. I tried updating route.js under path: 'app' to use element which gave me a login screen but when you click sign in it just goes gray and doesn't redirect to the dashboard.

How can I get it to load the login page first when going to localhost:3000 then after clicking sign in it loads the dashboard?

Thanks

Table body is not scrolled vertically in mobile design

The table is not scrolled vertically when switching to mobile. Sometimes it's available, but in the console, there are a lot of errors.

touch.js:169 [Intervention] Ignored attempt to cancel a touchmove event with cancelable=false, for example because scrolling is in progress and cannot be interrupted.

It would be great if there is a solution.

Support for nested list in sidebar

Hello. I'm using this template in my project. I'm trying to add a nested list for one component in my Sidebar. I'm not quite sure how to implement it? Can this feature be added to the dashboard?

Refreshing page when using auth0 causes logout.

Hi lovely kit,

I've found an odd bug where when activating the auth0 popup login (paid version), everything works fine but if I refreshed when inside the an authenticated page /dashboard/x it just logs me out 😢

Any pointers would be greatly appreciated as this makes it rather unusable. When testing the demo where it uses JWT everything seems to work correctly.

Why are my .JS files huge?

Hello,

I have downloaded the latest version of "Free React Admin Dashboard".
When I run it on my PC in dev mode or build the production version (without changing the code), I find myself with a chunk.js file of more than 1Mb. This is obviously problematic because the page is long to load.

But if I go on the demo page https://material-kit-react.devias.io/app/dashboard there are no big .js files

How is it possible ?

devias-io / material-kit-react Goto Github PK

material-kit-react's Introduction

Pages

Free Figma Community File

Upgrade to PRO Version

Quick start

File Structure

Resources

Reporting Issues:

License

Contact Us

material-kit-react's People

Contributors

Stargazers

Watchers

Forkers

material-kit-react's Issues

App.tsx

AppRoutes.tsx

routes.tsx

Recommend Projects

Recommend Topics

Recommend Org