uilibrary / matx-react Goto Github PK

View Code? Open in Web Editor NEW

915.0 915.0 382.0 48.15 MB

Matx -Free and open-source React Material UI Admin Dashboard Template

Home Page: https://ui-lib.com/downloads/matx-react-dashboard

License: MIT License

HTML 2.03% JavaScript 97.97%

admin admin-dashboard dahsboard dashboard-templates material-ui mui muiv5 react react-admin reactadmin reactjs

matx-react's Introduction

Matx React Material Design Admin Dashboard Template

MatX is a full-featured React Material UI Admin Dashboard template. MatX is built with React, Redux & Material UI We implemented all the features you might need to start a new Web application. The free version includes all Material UI components, Form elements, and validation, JWT authentication, Sign in, sign up pages, Vertical navigation, Lazy loading, Code splitting.

Features

MatX Free	MatX Pro
Live Preview Download MatX	Live Preview Get MatX Pro
JWT authentication Role based authentication Lazy loading components Code splitting Dashboard Analytics UI kits Autocomplete Buttons Checkbox Dialog Expansion panel Menu Progress Datetime picker Radio Switch Slider Snackbar Data table Forms Basic Rich text editor eChart Session pages Sign in Sign up Forgot password Error page Drag and drop Google map Utilities Color Spacing Typography Display Multi level menu	All features of Matx free + Firebase authentication Auth0 authentication Horizontal navigation Pages Customer List Customer View/Add/Edit Product List Customer View/Add/Edit Order List Order View/Add/Edit Help center FAQ Pricings User List/Grid/Row Forms Order form Invoice form Property listing form Single upload Multiple upload Wizard Working Apps CRUD table Shop/eCommerce Scrum board Invoice builder Event calendar Chat Inbox Todo Lists Row/Grid List Infinite scroll list Charts eChart Rechart Victory chart React vis Account setting User profile 6 month support

MatX Free

MatX Pro

Live Preview
Download MatX

Live Preview
Get MatX Pro

JWT authentication
Role based authentication
Lazy loading components
Code splitting
Dashboard Analytics
UI kits
- Autocomplete
- Buttons
- Checkbox
- Dialog
- Expansion panel
- Menu
- Progress
- Datetime picker
- Radio
- Switch
- Slider
- Snackbar
- Data table
Forms
- Basic
- Rich text editor
eChart
Session pages
- Sign in
- Sign up
- Forgot password
- Error page
Drag and drop
Google map
Utilities
- Color
- Spacing
- Typography
- Display
Multi level menu

All features of Matx free +
Firebase authentication
Auth0 authentication
Horizontal navigation
Pages
- Customer List
- Customer View/Add/Edit
- Product List
- Customer View/Add/Edit
- Order List
- Order View/Add/Edit
- Help center
- FAQ
- Pricings
- User List/Grid/Row
Forms
- Order form
- Invoice form
- Property listing form
- Single upload
- Multiple upload
- Wizard
Working Apps
- CRUD table
- Shop/eCommerce
- Scrum board
- Invoice builder
- Event calendar
- Chat
- Inbox
- Todo
Lists
- Row/Grid List
- Infinite scroll list
Charts
- eChart
- Rechart
- Victory chart
- React vis
Account setting
User profile
6 month support

Version 4 changes

Updated all packages
Added Auth0 and Firebase authentication system

Version 3 changes

Added Material UI – Styled api (v5)
Added Material UI updated components from MUI@version 5
Added React Apex Chart
Updated JWT authentication
Updated Charts
Removed CSS Utilities (replaced by MUI)
Removed SASS Integrigration (replaced by Styled API)
Removed Victory chart (Replaced by React Apex Chart)

Getting started

In the project directory, you can run:

`npm start`

Runs the app in the development mode.
Open http://localhost:3000 to view it in the browser.

The page will reload if you make edits.
You will also see any lint errors in the console.

`npm run build`

Builds the app for production to the build folder.
It correctly bundles React in production mode and optimizes the build for the best performance.

The build is minified and the filenames include the hashes.
Your app is ready to be deployed!

Download

Download From official website

For questions and support mail us at [email protected]

matx-react's People

Contributors

Stargazers

Watchers

Forkers

rashedulislammasum pitson3 itsaiub ruwerh kingsylver vishal1003 kumail-raza pawankp550 szabadiandras glympero habiburrahman30 mamedinfo ameenaliu smsaifulalom dextreeamper abdulmoizshaikh jamiejamesdev soldierforus shroud1995 abedmaatalla anan7codes arifwidianto08 patbi vijay2330 tshamim lakshanpinto tgmarinho aupv9 mazrou limaale salmondev catelina777 elrodrix dioneb sagormax adityaarakeri masiskar arraycto aligithaider afrinnusrat walter-futch trendingtechnology francishero kishan2127 rajneeshkshwh fernando-espinosa-clip serkanodaci rodrigo398 nzakicodes snetts nuradiyana op-buggy franknmungai ahmadsayeed3 zh1225py martinbedouret vinothkumart cosmoarunn kbmanikanta notnotdaniel drvgao veerendrapatel vahanmkrtumyan bgourimbnr peymancyb deveshkumarpathak bitz0x75 kumarsolanki streetprogrammer great-hijack quanghv96 msinnema33 erosmlima forest1206 saivivek-peddi eyehwk gilatb s-ueno yangzy7513 abhishekpauldapl nickmckenney emmaroland32 delf1 mgrevesse gentlesammy fanyfernaldi ahmedgmurtaza mashfiqur-rahman adoel90 bahachammakhi mumud melodyjerry rpiresajr vicky4165 joyant-bhakto theruslanusmanov ibn-hamzat jianminli faran4engg jimgonzalesddm

matx-react's Issues

Icons from the dashboard popping up in the menu bar

Icons from the dashboard popping up in the menu bar which looks like an inappropriate action and disturbing the menu view while hovering towards the menu items, Kindly find the screenshot uploaded for your reference and I have highlighted the error.
Please Note: I can able to notice the same error in Matx-react offical demo page as well as code running on my local machine ( Linux ubuntu 22.04 std) - Mozilla firefox browser 117.0 (64-bit)

Cannot install dependencies

when i try to npm install on the root dir. i get the error.

Enable user permision not working

`import useAuth from "app/hooks/useAuth";
import { Navigate, useLocation } from "react-router-dom";

// const userHasPermission = (pathname, user, routes) => {
// if (!user) {
// return false;
// }
// const matched = routes.find((r) => r.path === pathname);

// const authenticated =
// matched && matched.auth && matched.auth.length ? matched.auth.includes(user.role) : true;
// return authenticated;
// };

const AuthGuard = ({ children }) => {
const { pathname } = useLocation();
const { isAuthenticated } = useAuth();
// const flatRoutes = flat(routes);

// const hasPermission = userHasPermission(pathname, user, routes);
// let authenticated = isAuthenticated && hasPermission;

// // IF YOU NEED ROLE BASED AUTHENTICATION,
// // UNCOMMENT ABOVE LINES
// // AND COMMENT OUT BELOW authenticated VARIABLE

if (isAuthenticated) return <>{children}</>;

return <Navigate replace to="/session/signin" state={{ from: pathname }} />;
};`

export default AuthGuard;

changed to

`import useAuth from "app/hooks/useAuth";
import { Navigate, useLocation } from "react-router-dom";
import routes from "app/routes";
//import {flat} from 'react'

const userHasPermission = (pathname, user, routes) => {
if (!user) {
return false;
}
const matched = routes.find((r) => r.path === pathname);

const authenticated =
matched && matched.auth && matched.auth.length ? matched.auth.includes(user.role) : true;
return authenticated;
};

export default function AuthGuard({ children }) {
const { pathname } = useLocation();
const { isAuthenticated,user } = useAuth();
const flatRoutes = flat(routes);

const hasPermission = userHasPermission(pathname, user, flatRoutes);
let authenticated = isAuthenticated && hasPermission;

// // IF YOU NEED ROLE BASED AUTHENTICATION,
// // UNCOMMENT ABOVE LINES
// // AND COMMENT OUT BELOW authenticated VARIABLE

if (authenticated) return <>{children}</>;

return <Navigate replace to="/session/signin" state={{ from: pathname }} />;
}`

issue

`Failed to compile.

[eslint]
src/app/auth/AuthGuard.jsx
Line 19:22: 'flat' is not defined no-undef
Line 19:27: 'routes' is not defined no-undef

Search for the keywords to learn more about each error.
ERROR in [eslint]
src/app/auth/AuthGuard.jsx
Line 19:22: 'flat' is not defined no-undef
Line 19:27: 'routes' is not defined no-undef

Search for the keywords to learn more about each error.

webpack compiled with 1 error`

im a pro user, please support

npm start errors with ERR_OSSL_EVP_UNSUPPORTED

Hello,
I am trying to run on a macbook.
npm install
and then nm start - but returns this..

Error: error:0308010C:digital envelope routines::unsupported
at new Hash (node:internal/crypto/hash:71:19)
at Object.createHash (node:crypto:140:10)
at module.exports (/--/matx-react/node_modules/webpack/lib/util/createHash.js:135:53)
at NormalModule._initBuildHash (/--/matx-react/node_modules/webpack/lib/NormalModule.js:417:16)
at /--/matx-react/node_modules/webpack/lib/NormalModule.js:452:10
at /--/matx-react/node_modules/webpack/lib/NormalModule.js:323:13
at /--/matx-react/node_modules/loader-runner/lib/LoaderRunner.js:367:11
at /--/matx-react/node_modules/loader-runner/lib/LoaderRunner.js:233:18
at context.callback (/--/matx-react/node_modules/loader-runner/lib/LoaderRunner.js:111:13)
at /--/matx-react/node_modules/babel-loader/lib/index.js:59:103 {
opensslErrorStack: [ 'error:03000086:digital envelope routines::initialization error' ],
library: 'digital envelope routines',
reason: 'unsupported',
code: 'ERR_OSSL_EVP_UNSUPPORTED'
}

Can you shed any light onto why?
thanks
Joe

Navigations Based on User Role

Hi , Side Nav Navigations are not working based on User Role. Looks like this was broken in matx-react 3.0.0 which was worked fine in matx-react 1.0.0
Can some one help me to fix this in matx-react 3.0.0

thanks in advance

the default route is "/home"

When the app is started at localhost:3000 it defaults to this route localhost:3000/home which return a 404 not found error.
According to the route configuration in src/app/routes.jsx
{ path: '/', element: <Navigate to="dashboard/default" /> },
it should render localhost:3000/dashboard/default.
I cannot figure out where is http://localhost:3000/home route coming from.

Material Table Enter key problem

If the table has Combobox items defined for one or more columns and has a validation for it, this validation is not working when "enter" key is pressed, saving the item anyway.
For example, for this definition:

<MaterialTable
          columns={[
            {
              title: 'Sucursal', field: 'sucursal', lookup: sucursalO, editPlaceholder: 'Sucursal',
              validate: rowData => rowData.sucursal !== undefined
            },
            {
              title: 'Nombre', field: 'nombre',
              validate: (rowData) => (!!rowData.nombre)
            },

...

if we fill the "nombre" field but "sucursal" is not selected, the "enter" key is pressed, and the validation for "sucursal" doesn't work.

Taking too long to compile during refresh

The app is taking too long to compile during refresh in development when you hit save after making changes... Sometimes even freezing the whole computer and you are forced to force shut. I tried disabling JavaScript source maps but still freezing the computer after a couple of continuous saves.

Can't find dark theme mode

Can you help me with searching switch button for dark theme?

No hamburger icon at 1256px

Hi,

The hamburger icon disappears at 1256px (wide) and there is no way to access the menu. It is not only at 1256px, it is a range, but that should work so you can reproduce the error.

npm start : react-scripts: command not found

> [email protected] start /Users/minlhg/xdatd/gentlehub/matx-react
> react-scripts start

sh: react-scripts: command not found
npm ERR! code ELIFECYCLE
npm ERR! syscall spawn
npm ERR! file sh
npm ERR! errno ENOENT
npm ERR! [email protected] start: `react-scripts start`
npm ERR! spawn ENOENT
npm ERR!
npm ERR! Failed at the [email protected] start script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm WARN Local package.json exists, but node_modules missing, did you mean to install?

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/minlhg/.npm/_logs/2020-01-22T08_46_07_267Z-debug.log

I want to remove your authentication and level of access, can you help me?

Hi, I want to add my custom authentication with server but How can I remove all authentication and level access system. I want to every logged user to access the dashboard....
Thanks

Function components

First of all, thanks for the pretty application! I liked it so much I bought the pro version. Just wondering if you would consider changing from class components to functional ones to make the usage of react hooks possible?

npm bugs matx-react

npm-debug.log

[email protected] start /root/bot
react-scripts start

sh: 1: react-scripts: not found

npm ERR! Linux 4.15.0-189-generic
npm ERR! argv "/usr/bin/node" "/usr/bin/npm" "start"
npm ERR! node v8.10.0
npm ERR! npm v3.5.2
npm ERR! file sh
npm ERR! code ELIFECYCLE
npm ERR! errno ENOENT
npm ERR! syscall spawn
npm ERR! [email protected] start: react-scripts start
npm ERR! spawn ENOENT
npm ERR!
npm ERR! Failed at the [email protected] start script 'react-scripts start'.
npm ERR! Make sure you have the latest version of node.js and npm installed.
npm ERR! If you do, this is most likely a problem with the matx-react package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR! react-scripts start
npm ERR! You can get information on how to open an issue for this project with:
npm ERR! npm bugs matx-react
npm ERR! Or if that isn't available, you can get their info via:
npm ERR! npm owner ls matx-react
npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request:
npm ERR! /root/bot/npm-debug.log

MUI Datatable

There is an error when trying to import a mui-datatable:

index.js:1 Warning: Failed prop type: The prop buttonRefofForwardRef(ButtonBase)is deprecated. Useref instead.

I suspect it has to do with the prop-types version?

Missing license

What license is this released under?

Prior to commit 68181c50a782e458228c2f464e9212c6efc57677, this project was released under an MIT license. That commit removed the licensing information.

Without a license at all this project isn't a good fit for a public Github repo, nor is it something anyone can easily use in their own projects.

Error with Authentication Flow

Hello,
first of all thank you for you're great work. I just love the Dashboard and currently I'm checking whether i can use it productively.
At the moment im trying to connect the dashboard to my small JWT Authentication Server (Node + Express). I just changed the loginWithEmailAndPassword() & loginWithToken() methods and getting the following error. The Servers responses in the console looks pretty fine.
The Error comes every time i try to login.
Do you have any idea what is going on?

Greetings

loginWithEmailAndPassword():
https://pastebin.com/jCz4uryt

loginWithToken():
https://pastebin.com/RpcbwzNW

Change Sidenav menu item

😶

Email [email protected] is not working

I try to send email to support but is not working. This is the error:

This message was created automatically by mail delivery software.

A message that you sent could not be delivered to one or more of its
recipients. This is a permanent error. The following address(es) failed:

  pipe to |/home/edyqaumy/public_html/support/pipe.php
    generated by [[email protected]](mailto:[email protected])

The following text was generated during the delivery attempt:

------ pipe to |/home/edyqaumy/public_html/support/pipe.php
       generated by [[email protected]](mailto:[email protected]) ------


In TicketCreatedNotif.php line 28:
                                               
  Trying to get property 'name' of non-object

Suggestions: publish via npm

So this is a application, and it has taken some decisions which isn't the best for everyone (I saw some dependencies but they should have been devDependencies)

I'd love to use this, but for that to happen, it'd require for me to be able to install this to my own boilerplate project, just like how bootstrap, material ui, uikit, antd etc provides.

I suggest making this npm library, and people being able to simply import {Button} from "matx-react"

the menu item doesn't stay highlighted

When I run it locally, the menu item doesn't stay highlighted, and no matter what option I choose, in the browser console I see

index.tsx:25 No routes matched location "/dashboard/default"
index.tsx:25 No routes matched location "/dashboard/analytics"

suggestions [reactivesearch/react-admin]

Hi,

Hope you are all well !

It would be nice to add https://github.com/appbaseio/reactivesearch for faceted search interface, and to integrate a ui based on https://github.com/marmelab/react-admin

Is there a way to setup the menu and the layout of the admin panel from yaml configuration file ?

Cheers,
X

Dynamic Route not working

import AuthGuard from 'app/auth/AuthGuard';
import chartsRoute from 'app/views/charts/ChartsRoute';
import dashboardRoutes from 'app/views/dashboard/DashboardRoutes';
import materialRoutes from 'app/views/material-kit/MaterialRoutes';
import NotFound from 'app/views/sessions/NotFound';
import sessionRoutes from 'app/views/sessions/SessionRoutes';
import { Navigate } from 'react-router-dom';
import MatxLayout from './components/MatxLayout/MatxLayout';
import loginRoutes from 'app/views/modular/Login/LoginRoutes';
import usersRoute from 'app/views/modular/UserManagement/route';

var arrayModules = [];

let data = require.context("app/views/modular", true, /\index.js$/, 'lazy');

Promise.all(
data.keys().map((item)=>{
const cleanModule = item.substring(item.indexOf('./') + 1);

return import(`app/views/modular${cleanModule.replace('/index.js','')}`).then(component=>{            
  
  return component.default;
})

})
).then(res=>{

res.map((item)=>{

arrayModules.push(...item)

})

});

const routes = [

...loginRoutes,
{

// children: [...dashboardRoutes, ...chartsRoute, ...materialRoutes,...usersRoute],
children: arrayModules,
element: (
  <AuthGuard>
    <MatxLayout />    
  </AuthGuard>
)

},
{ path: '/', element: },
{ path: '*', element: },

];

export default routes;

List not work

I used example code here https://mui.com/material-ui/react-list/ but the list not display correctly.

import * as React from 'react';
import Box from '@mui/material/Box';
import List from '@mui/material/List';
import ListItem from '@mui/material/ListItem';
import ListItemButton from '@mui/material/ListItemButton';
import ListItemIcon from '@mui/material/ListItemIcon';
import ListItemText from '@mui/material/ListItemText';
import Divider from '@mui/material/Divider';
import InboxIcon from '@mui/icons-material/Inbox';
import DraftsIcon from '@mui/icons-material/Drafts';

export default function BasicList() {
  return (
    <Box sx={{ width: '100%', maxWidth: 360, bgcolor: 'background.paper' }}>
      <nav aria-label="main mailbox folders">
        <List>
          <ListItem disablePadding>
            <ListItemButton>
              <ListItemIcon>
                <InboxIcon />
              </ListItemIcon>
              <ListItemText primary="Inbox" />
            </ListItemButton>
          </ListItem>
          <ListItem disablePadding>
            <ListItemButton>
              <ListItemIcon>
                <DraftsIcon />
              </ListItemIcon>
              <ListItemText primary="Drafts" />
            </ListItemButton>
          </ListItem>
        </List>
      </nav>
      <Divider />
      <nav aria-label="secondary mailbox folders">
        <List>
          <ListItem disablePadding>
            <ListItemButton>
              <ListItemText primary="Trash" />
            </ListItemButton>
          </ListItem>
          <ListItem disablePadding>
            <ListItemButton component="a" href="#simple-list">
              <ListItemText primary="Spam" />
            </ListItemButton>
          </ListItem>
        </List>
      </nav>
    </Box>
  );
}

Installation failed with webpack 5

Navigation bar doesn't hide menui tems on different roles

I logged in with different users, and different roles and I am not able to reach forbidden paths, but menu items still visible for all users. It seems getNavigationByUser() is not fired.
I think it's provided by free tier, am I right?
Can you please provide a solution?

Update dependencies!

 $ : npx npm-check
Need to install the following packages:
  npm-check
Ok to proceed? (y) y
npm WARN deprecated [email protected]: cross-spawn no longer requires a build toolchain, use it instead
npm WARN deprecated [email protected]: core-js@<3.3 is no longer maintained and not recommended for usage due to the number of issues. Because of the V8 engine whims, feature detection in old core-js versions could cause a slowdown up to 100x even if nothing is polyfilled. Please, upgrade your dependencies to the actual version of core-js.

@auth0/auth0-spa-js         😍  UPDATE!   Your local install is out of date. https://github.com/auth0/auth0-spa-js#readme
                                         npm install --save @auth0/[email protected] to go from 1.15.0 to 1.17.0
                            😕  NOTUSED?  Still using @auth0/auth0-spa-js?
                                         Depcheck did not find code similar to require('@auth0/auth0-spa-js') or import from '@auth0/auth0-spa-js'.
                                         Check your code before removing as depcheck isn't able to foresee all ways dependencies can be used.
                                         Use --skip-unused to skip this check.
                                         To remove this package: npm uninstall --save @auth0/auth0-spa-js

@date-io/core               😎  MAJOR UP  Major update available. https://github.com/dmtrKovalenko/date-io#readme
                                         npm install --save @date-io/[email protected] to go from 1.3.13 to 2.11.0

@date-io/date-fns           😎  MAJOR UP  Major update available. https://github.com/dmtrKovalenko/date-io#readme
                                         npm install --save @date-io/[email protected] to go from 1.3.13 to 2.11.0

@material-ui/codemod        😕  NOTUSED?  Still using @material-ui/codemod?
                                         Depcheck did not find code similar to require('@material-ui/codemod') or import from '@material-ui/codemod'.
                                         Check your code before removing as depcheck isn't able to foresee all ways dependencies can be used.
                                         Use --skip-unused to skip this check.
                                         To remove this package: npm uninstall --save @material-ui/codemod

@material-ui/core           😍  UPDATE!   Your local install is out of date. https://material-ui.com/
                                         npm install --save @material-ui/[email protected] to go from 4.11.4 to 4.12.3

apexcharts                  😍  UPDATE!   Your local install is out of date. https://apexcharts.com
                                         npm install --save [email protected] to go from 3.27.1 to 3.28.1

axios                       😎  NEW VER!  NonSemver update available. https://github.com/axios/axios
                                         npm install --save [email protected] to go from 0.19.2 to 0.21.1

css-vars-ponyfill           😍  UPDATE!   Your local install is out of date. https://jhildenbiddle.github.io/css-vars-ponyfill/
                                         npm install --save [email protected] to go from 2.4.5 to 2.4.6
                            😕  NOTUSED?  Still using css-vars-ponyfill?
                                         Depcheck did not find code similar to require('css-vars-ponyfill') or import from 'css-vars-ponyfill'.
                                         Check your code before removing as depcheck isn't able to foresee all ways dependencies can be used.
                                         Use --skip-unused to skip this check.
                                         To remove this package: npm uninstall --save css-vars-ponyfill

date-fns                    😍  UPDATE!   Your local install is out of date. https://github.com/date-fns/date-fns#readme
                                         npm install --save [email protected] to go from 2.22.1 to 2.23.0

echarts                     😎  MAJOR UP  Major update available. http://echarts.apache.org
                                         npm install --save [email protected] to go from 4.9.0 to 5.1.2

echarts-for-react           😎  MAJOR UP  Major update available. https://github.com/hustcc/echarts-for-react
                                         npm install --save [email protected] to go from 2.0.16 to 3.0.1

firebase                    😎  MAJOR UP  Major update available. https://firebase.google.com/
                                         npm install --save [email protected] to go from 8.6.7 to 9.0.1
                            😕  NOTUSED?  Still using firebase?
                                         Depcheck did not find code similar to require('firebase') or import from 'firebase'.
                                         Check your code before removing as depcheck isn't able to foresee all ways dependencies can be used.
                                         Use --skip-unused to skip this check.
                                         To remove this package: npm uninstall --save firebase

globalize                   😎  MAJOR UP  Major update available. https://github.com/globalizejs/globalize
                                         npm install --save [email protected] to go from 0.1.1 to 1.7.0
                            😕  NOTUSED?  Still using globalize?
                                         Depcheck did not find code similar to require('globalize') or import from 'globalize'.
                                         Check your code before removing as depcheck isn't able to foresee all ways dependencies can be used.
                                         Use --skip-unused to skip this check.
                                         To remove this package: npm uninstall --save globalize

history                     😎  MAJOR UP  Major update available. https://github.com/ReactTraining/history#readme
                                         npm install --save [email protected] to go from 4.10.1 to 5.0.1

mui-datatables              😍  UPDATE!   Your local install is out of date. https://github.com/gregnb/mui-datatables#readme
                                         npm install --save [email protected] to go from 3.7.7 to 3.7.8
                            😕  NOTUSED?  Still using mui-datatables?
                                         Depcheck did not find code similar to require('mui-datatables') or import from 'mui-datatables'.
                                         Check your code before removing as depcheck isn't able to foresee all ways dependencies can be used.
                                         Use --skip-unused to skip this check.
                                         To remove this package: npm uninstall --save mui-datatables

node-sass                   😕  NOTUSED?  Still using node-sass?
                                         Depcheck did not find code similar to require('node-sass') or import from 'node-sass'.
                                         Check your code before removing as depcheck isn't able to foresee all ways dependencies can be used.
                                         Use --skip-unused to skip this check.
                                         To remove this package: npm uninstall --save node-sass

notistack                   😎  MAJOR UP  Major update available. https://www.iamhosseindhv.com/notistack
                                         npm install --save [email protected] to go from 0.8.9 to 1.0.10

qwest                       😕  NOTUSED?  Still using qwest?
                                         Depcheck did not find code similar to require('qwest') or import from 'qwest'.
                                         Check your code before removing as depcheck isn't able to foresee all ways dependencies can be used.
                                         Use --skip-unused to skip this check.
                                         To remove this package: npm uninstall --save qwest

react                       😎  MAJOR UP  Major update available. https://reactjs.org/
                                         npm install --save [email protected] to go from 16.14.0 to 17.0.2

react-beautiful-dnd         😎  MAJOR UP  Major update available. https://github.com/atlassian/react-beautiful-dnd#readme
                                         npm install --save [email protected] to go from 11.0.5 to 13.1.0

react-big-calendar          😎  NEW VER!  NonSemver update available. https://github.com/jquense/react-big-calendar#readme
                                         npm install --save [email protected] to go from 0.24.6 to 0.35.0
                            😕  NOTUSED?  Still using react-big-calendar?
                                         Depcheck did not find code similar to require('react-big-calendar') or import from 'react-big-calendar'.
                                         Check your code before removing as depcheck isn't able to foresee all ways dependencies can be used.
                                         Use --skip-unused to skip this check.
                                         To remove this package: npm uninstall --save react-big-calendar

react-dom                   😎  MAJOR UP  Major update available. https://reactjs.org/
                                         npm install --save [email protected] to go from 16.14.0 to 17.0.2

react-dropzone              😍  UPDATE!   Your local install is out of date. https://github.com/react-dropzone/react-dropzone
                                         npm install --save [email protected] to go from 11.3.2 to 11.3.4
                            😕  NOTUSED?  Still using react-dropzone?
                                         Depcheck did not find code similar to require('react-dropzone') or import from 'react-dropzone'.
                                         Check your code before removing as depcheck isn't able to foresee all ways dependencies can be used.
                                         Use --skip-unused to skip this check.
                                         To remove this package: npm uninstall --save react-dropzone

react-highlight             😎  NEW VER!  NonSemver update available. https://github.com/akiran/react-highlight
                                         npm install --save [email protected] to go from 0.12.0 to 0.14.0

react-infinite-scroller     😕  NOTUSED?  Still using react-infinite-scroller?
                                         Depcheck did not find code similar to require('react-infinite-scroller') or import from 'react-infinite-scroller'.
                                         Check your code before removing as depcheck isn't able to foresee all ways dependencies can be used.
                                         Use --skip-unused to skip this check.
                                         To remove this package: npm uninstall --save react-infinite-scroller

react-router-dom            😍  UPDATE!   Your local install is out of date. https://github.com/ReactTraining/react-router#readme
                                         npm install --save [email protected] to go from 5.2.0 to 5.2.1

react-scripts               😎  MAJOR UP  Major update available. https://github.com/facebook/create-react-app#readme
                                         npm install --save [email protected] to go from 3.4.4 to 4.0.3

react-vis                   😕  NOTUSED?  Still using react-vis?
                                         Depcheck did not find code similar to require('react-vis') or import from 'react-vis'.
                                         Check your code before removing as depcheck isn't able to foresee all ways dependencies can be used.
                                         Use --skip-unused to skip this check.
                                         To remove this package: npm uninstall --save react-vis

recharts                    😎  MAJOR UP  Major update available. https://github.com/recharts/recharts
                                         npm install --save [email protected] to go from 1.8.5 to 2.1.2

redux                       😍  UPDATE!   Your local install is out of date. http://redux.js.org
                                         npm install --save [email protected] to go from 4.1.0 to 4.1.1

swiper                      😎  MAJOR UP  Major update available. https://swiperjs.com
                                         npm install --save [email protected] to go from 4.5.1 to 7.0.2
                            😕  NOTUSED?  Still using swiper?
                                         Depcheck did not find code similar to require('swiper') or import from 'swiper'.
                                         Check your code before removing as depcheck isn't able to foresee all ways dependencies can be used.
                                         Use --skip-unused to skip this check.
                                         To remove this package: npm uninstall --save swiper

uuid                        😕  NOTUSED?  Still using uuid?
                                         Depcheck did not find code similar to require('uuid') or import from 'uuid'.
                                         Check your code before removing as depcheck isn't able to foresee all ways dependencies can be used.
                                         Use --skip-unused to skip this check.
                                         To remove this package: npm uninstall --save uuid

victory                     😎  MAJOR UP  Major update available. https://formidable.com/open-source/victory
                                         npm install --save [email protected] to go from 32.3.7 to 35.11.2
                            😕  NOTUSED?  Still using victory?
                                         Depcheck did not find code similar to require('victory') or import from 'victory'.
                                         Check your code before removing as depcheck isn't able to foresee all ways dependencies can be used.
                                         Use --skip-unused to skip this check.
                                         To remove this package: npm uninstall --save victory

yup                         😎  NEW VER!  NonSemver update available. https://github.com/jquense/yup
                                         npm install --save [email protected] to go from 0.29.3 to 0.32.9
                            😕  NOTUSED?  Still using yup?
                                         Depcheck did not find code similar to require('yup') or import from 'yup'.
                                         Check your code before removing as depcheck isn't able to foresee all ways dependencies can be used.
                                         Use --skip-unused to skip this check.
                                         To remove this package: npm uninstall --save yup

@babel/runtime              😍  UPDATE!   Your local install is out of date. https://babel.dev/docs/en/next/babel-runtime
                                         npm install --save-dev @babel/[email protected] to go from 7.14.6 to 7.15.3
                            😕  NOTUSED?  Still using @babel/runtime?
                                         Depcheck did not find code similar to require('@babel/runtime') or import from '@babel/runtime'.
                                         Check your code before removing as depcheck isn't able to foresee all ways dependencies can be used.
                                         Use --skip-unused to skip this check.
                                         To remove this package: npm uninstall --save-dev @babel/runtime

axios-mock-adapter          😍  UPDATE!   Your local install is out of date. https://github.com/ctimmerm/axios-mock-adapter#readme
                                         npm install --save-dev [email protected] to go from 1.19.0 to 1.20.0

cross-env                   😎  MAJOR UP  Major update available. https://github.com/kentcdodds/cross-env#readme
                                         npm install --save-dev [email protected] to go from 5.2.1 to 7.0.3
                            😕  NOTUSED?  Still using cross-env?
                                         Depcheck did not find code similar to require('cross-env') or import from 'cross-env'.
                                         Check your code before removing as depcheck isn't able to foresee all ways dependencies can be used.
                                         Use --skip-unused to skip this check.
                                         To remove this package: npm uninstall --save-dev cross-env

customize-cra               😎  MAJOR UP  Major update available. https://github.com/arackaf/customize-cra#readme
                                         npm install --save-dev [email protected] to go from 0.9.1 to 1.0.0

eslint-plugin-react-hooks   😎  MAJOR UP  Major update available. https://reactjs.org/
                                         npm install --save-dev [email protected] to go from 0.0.0-8d7535e54 to 4.2.0

eslint-config-react-app     😟  PKG ERR!  Not in the package.json. Found in: /package.json
                            😎  MAJOR UP  Major update available. https://github.com/facebook/create-react-app#readme
                                         npm install --save [email protected] to go from 5.2.1 to 6.0.0

history.js                  😟  MISSING!  Not installed.
                            😟  PKG ERR!  Not in the package.json. Found in: /src/app/App.jsx, /src/app/views/sessions/login/JwtLogin.jsx, /src/app/views/sessions/register/JwtRegister.jsx

app                         😟  MISSING!  Not installed.
                            😟  PKG ERR!  Not in the package.json. Found in: /src/app/App.jsx, /src/app/auth/AuthGuard.jsx, /src/app/components/Brand/Brand.jsx, /src/app/components/Footer/Footer.jsx, /src/app/components/MatxCustomizer/MatxCustomizer.jsx, /src/app/components/MatxLayout/Layout1/Layout1.jsx, /src/app/components/MatxLayout/Layout1/Layout1Sidenav.jsx, /src/app/components/MatxLayout/Layout1/Layout1Topbar.jsx, /src/app/components/MatxLayout/MatxLayout.jsx, /src/app/components/MatxLogo/MatxLogo.jsx, /src/app/components/MatxMenu/MatxMenu.jsx, /src/app/components/MatxSuspense/MatxSuspense.jsx, /src/app/components/MatxTheme/MatxTheme.jsx, /src/app/components/MatxTheme/SidenavTheme/SidenavTheme.jsx, /src/app/components/MatxVerticalNav/MatxVerticalNav.jsx, /src/app/components/NotificationBar/NotificationBar.jsx, /src/app/components/NotificationBar2/NotificationBar2.jsx, /src/app/components/SecondarySidebar/SecondarySidebar.jsx, /src/app/components/SecondarySidebar/SecondarySidebarContent.jsx, /src/app/components/SecondarySidebar/SecondarySidebarToggle.jsx, /src/app/components/ShoppingCart/ShoppingCart.jsx, /src/app/components/Sidenav/Sidenav.jsx, /src/app/components/charts/EchartCreator.jsx, /src/app/components/chat-box-2/Chatbox.jsx, /src/app/contexts/JWTAuthContext.js, /src/app/contexts/SettingsContext.js, /src/app/hooks/useAuth.js, /src/app/hooks/useNotification.js, /src/app/hooks/useSettings.js, /src/app/redux/reducers/NavigationReducer.js, /src/app/views/Drag&Drop/AppDragAndDrop.jsx, /src/app/views/charts/echarts/AppEchart.jsx, /src/app/views/dashboard/shared/Campaigns.jsx, /src/app/views/forms/BasicForm.jsx, /src/app/views/forms/EditorForm.jsx, /src/app/views/forms/UploadForm.jsx, /src/app/views/forms/WizardForm.jsx, /src/app/views/map/AppMap.jsx, /src/app/views/material-kit/AppProgress.jsx, /src/app/views/material-kit/buttons/AppButton.jsx, /src/app/views/material-kit/auto-complete/AppAutoComplete.jsx, /src/app/views/material-kit/checkbox/AppCheckbox.jsx, /src/app/views/material-kit/expansion-panel/AppExpansionPanel.jsx, /src/app/views/material-kit/dialog/AppDialog.jsx, /src/app/views/material-kit/forms/AppForm.jsx, /src/app/views/material-kit/icons/AppIcon.jsx, /src/app/views/material-kit/menu/AppMenu.jsx, /src/app/views/material-kit/radio/AppRadio.jsx, /src/app/views/material-kit/snackbar/AppSnackbar.jsx, /src/app/views/material-kit/switch/AppSwitch.jsx, /src/app/views/material-kit/tables/AppTable.jsx, /src/app/views/material-kit/slider/AppSlider.jsx, /src/app/views/sessions/login/JwtLogin.jsx, /src/app/views/sessions/register/JwtRegister.jsx, /src/app/views/utilities/Color.jsx, /src/app/views/utilities/Display.jsx, /src/app/views/utilities/MiscClass.jsx, /src/app/views/utilities/HeightWidth.jsx, /src/app/views/utilities/Position.jsx, /src/app/views/utilities/Shadow.jsx, /src/app/views/utilities/Spacing.jsx, /src/app/views/utilities/Typography.jsx

utils                       😟  MISSING!  Not installed.
                            😟  PKG ERR!  Not in the package.json. Found in: /src/app/components/MatxLayout/Layout1/Layout1Sidenav.jsx, /src/app/components/NotificationBar2/NotificationCard.jsx, /src/app/components/cards/SimpleCard.jsx, /src/app/styles/_variables.js

@material-ui/styles         😟  PKG ERR!  Not in the package.json. Found in: /src/app/components/MatxMenu/MatxMenu.jsx, /src/app/components/MatxProgressBar/MatxProgressBar.jsx, /src/app/components/MatxTheme/MatxCssVars.jsx, /src/app/views/charts/echarts/AppEchart.jsx, /src/app/views/charts/echarts/Doughnut.jsx, /src/app/views/charts/echarts/LineChart.jsx, /src/app/views/dashboard/Analytics.jsx, /src/app/views/dashboard/shared/Doughnut.jsx

utils.js                    😟  MISSING!  Not installed.
                            😟  PKG ERR!  Not in the package.json. Found in: /src/app/components/NotificationBar/NotificationBar.jsx

Utils                       😟  MISSING!  Not installed.
                            😟  PKG ERR!  Not in the package.json. Found in: /src/app/components/TopbarMenu/TopbarMenu.jsx

axios.js                    😟  MISSING!  Not installed.
                            😟  PKG ERR!  Not in the package.json. Found in: /src/app/contexts/JWTAuthContext.js
                            ⛔  NPM ERR!  Registry error Package `axios.js` doesn't exist

perfect-scrollbar           😟  PKG ERR!  Not in the package.json. Found in: /src/app/styles/VendorCss.js
                            😎  PATCH UP  Patch update available. https://github.com/mdbootstrap/perfect-scrollbar#readme
                                         npm install --save [email protected] to go from 1.5.1 to 1.5.2

recompose                   😟  PKG ERR!  Not in the package.json. Found in: /src/app/views/map/MarkerMap.jsx, /src/app/views/map/BasicMap.jsx, /src/app/views/map/PolygonMap.jsx
                            😎  NEW VER!  NonSemver update available. https://github.com/acdlite/recompose
                                         npm install --save [email protected] to go from 0.26.0 to 0.30.0

Use npm-check -u for interactive update.

Does not compile on node 14.2 / macOS

node-pre-gyp ERR! build error
node-pre-gyp ERR! stack Error: Failed to execute '/usr/local/Cellar/node/14.2.0/bin/node /usr/local/lib/node_modules/npm/node_modules/node-gyp/bin/node-gyp.js build --fallback-to-build --library=static_library --module=/Users/h/dev/haf/matx-react/node_modules/grpc/src/node/extension_binary/node-v83-darwin-x64-unknown/grpc_node.node --module_name=grpc_node --module_path=/Users/h/dev/haf/matx-react/node_modules/grpc/src/node/extension_binary/node-v83-darwin-x64-unknown --napi_version=6 --node_abi_napi=napi --napi_build_version=0 --node_napi_label=node-v83' (1)
node-pre-gyp ERR! stack     at ChildProcess.<anonymous> (/Users/h/dev/haf/matx-react/node_modules/grpc/node_modules/node-pre-gyp/lib/util/compile.js:83:29)
node-pre-gyp ERR! stack     at ChildProcess.emit (events.js:315:20)
node-pre-gyp ERR! stack     at maybeClose (internal/child_process.js:1051:16)
node-pre-gyp ERR! stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:287:5)
node-pre-gyp ERR! System Darwin 19.4.0
node-pre-gyp ERR! command "/usr/local/Cellar/node/14.2.0/bin/node" "/Users/h/dev/haf/matx-react/node_modules/grpc/node_modules/.bin/node-pre-gyp" "install" "--fallback-to-build" "--library=static_library"
node-pre-gyp ERR! cwd /Users/h/dev/haf/matx-react/node_modules/grpc
node-pre-gyp ERR! node -v v14.2.0
node-pre-gyp ERR! node-pre-gyp -v v0.13.0
node-pre-gyp ERR! not ok

Last bit of compiler error:

  LIBTOOL-STATIC Release/libaddress_sorting.a
  CXX(target) Release/obj.target/grpc_node/ext/byte_buffer.o
  CXX(target) Release/obj.target/grpc_node/ext/call.o
../ext/call.cc:104:53: error: no matching member function for call to 'Get'
    Local<String> current_key(Nan::To<String>(keys->Get(i)).ToLocalChecked());
                                              ~~~~~~^~~

Repro

Clone repo
npm i

I have everything brew-installed, with latest versions at time of writing.

current version does not compile

It's throwing a library error - see attached.

build error

After build, it is not working.

Uncaught SyntaxError: Unexpected token '<'
react-dom.production.min.js:216 ChunkLoadError: Loading chunk 0 failed.
(missing: http://x.x.x.x/session/static/js/0.e4580c46.chunk.js)
at Function.c.e (VM97:1:3686)
at SessionRoutes.js:6:38
at A (react.production.min.js:18:52)
at Xs (react-dom.production.min.js:269:22)
at Iu (react-dom.production.min.js:250:347)
at Tu (react-dom.production.min.js:250:278)
at ju (react-dom.production.min.js:250:138)
at bu (react-dom.production.min.js:243:163)
at react-dom.production.min.js:123:115
at t.unstable_runWithPriority (scheduler.production.min.js:18:343)

error when it was built

Why is there an error when the application is already built? Here is the error message.

Navigation sidebar is not auto close when click the menu on mobile mode

Node-Gyp build error

While installing dependencies, Node-Gyp errors pops up, I have updated global node-gyp to latest version but still this errors pops up.

npm ERR! code 1 npm ERR! path /home/yasir/Desktop/Projects/mukabir/Client/node_modules/grpc npm ERR! command failed npm ERR! command sh -c node-gyp rebuild npm ERR! gyp info it worked if it ends with ok npm ERR! gyp info using [email protected] npm ERR! gyp info using [email protected] | linux | x64 npm ERR! gyp info find Python using Python version 3.8.5 found at "/usr/bin/python3" npm ERR! gyp info spawn /usr/bin/python3 npm ERR! gyp info spawn args [ npm ERR! gyp info spawn args '/home/yasir/.nvm/versions/node/v15.14.0/lib/node_modules/npm/node_modules/@npmcli/run-script/node_modules/node-gyp/gyp/gyp_main.py', npm ERR! gyp info spawn args 'binding.gyp', npm ERR! gyp info spawn args '-f', npm ERR! gyp info spawn args 'make', npm ERR! gyp info spawn args '-I', npm ERR! gyp info spawn args '/home/yasir/Desktop/Projects/mukabir/Client/node_modules/grpc/build/config.gypi', npm ERR! gyp info spawn args '-I', npm ERR! gyp info spawn args '/home/yasir/.nvm/versions/node/v15.14.0/lib/node_modules/npm/node_modules/@npmcli/run-script/node_modules/node-gyp/addon.gypi', npm ERR! gyp info spawn args '-I', npm ERR! gyp info spawn args '/home/yasir/.cache/node-gyp/15.14.0/include/node/common.gypi', npm ERR! gyp info spawn args '-Dlibrary=shared_library', npm ERR! gyp info spawn args '-Dvisibility=default', npm ERR! gyp info spawn args '-Dnode_root_dir=/home/yasir/.cache/node-gyp/15.14.0', npm ERR! gyp info spawn args '-Dnode_gyp_dir=/home/yasir/.nvm/versions/node/v15.14.0/lib/node_modules/npm/node_modules/@npmcli/run-script/node_modules/node-gyp', npm ERR! gyp info spawn args '-Dnode_lib_file=/home/yasir/.cache/node-gyp/15.14.0/<(target_arch)/node.lib', npm ERR! gyp info spawn args '-Dmodule_root_dir=/home/yasir/Desktop/Projects/mukabir/Client/node_modules/grpc', npm ERR! gyp info spawn args '-Dnode_engine=v8', npm ERR! gyp info spawn args '--depth=.', npm ERR! gyp info spawn args '--no-parallel', npm ERR! gyp info spawn args '--generator-output', npm ERR! gyp info spawn args 'build', npm ERR! gyp info spawn args '-Goutput_dir=.' npm ERR! gyp info spawn args ] npm ERR! gyp: Undefined variable module_name in binding.gyp while trying to load binding.gyp npm ERR! gyp ERR! configure error npm ERR! gyp ERR! stack Error: gyp` failed with exit code: 1
npm ERR! gyp ERR! stack at ChildProcess.onCpExit (/home/yasir/.nvm/versions/node/v15.14.0/lib/node_modules/npm/node_modules/@npmcli/run-script/node_modules/node-gyp/lib/configure.js:353:16)
npm ERR! gyp ERR! stack at ChildProcess.emit (node:events:369:20)
npm ERR! gyp ERR! stack at Process.ChildProcess._handle.onexit (node:internal/child_process:290:12)
npm ERR! gyp ERR! System Linux 5.8.0-55-generic
npm ERR! gyp ERR! command "/home/yasir/.nvm/versions/node/v15.14.0/bin/node" "/home/yasir/.nvm/versions/node/v15.14.0/lib/node_modules/npm/node_modules/@npmcli/run-script/node_modules/node-gyp/bin/node-gyp.js" "rebuild"
npm ERR! gyp ERR! cwd /home/yasir/Desktop/Projects/mukabir/Client/node_modules/grpc
npm ERR! gyp ERR! node -v v15.14.0
npm ERR! gyp ERR! node-gyp -v v8.1.0
npm ERR! gyp ERR! not ok

npm ERR! A complete log of this run can be found in:
npm ERR! /home/yasir/.npm/_logs/2021-06-08T07_35_43_494Z-debug.log`