- Fix issues
- Update dependencies
- Migrate to React 18
- Fix vulnerabilities issues
- Fix installation issues
- Momoized the context provider values
- Fix the conditionally used of useContext for MDPagination component
- Fix the import/no-anonymouse-default-export
"@emotion/cache" 11.4.0 -> 11.7.1
"@emotion/react" 11.4.1 -> 11.7.1
"@emotion/styled" 11.3.0 -> 11.6.0
"@mui/icons-material" 5.2.0 -> 5.4.1
"@mui/material" 5.2.0 -> 5.4.1
"@mui/styled-engine" 5.2.0 -> 5.4.1
"@testing-library/jest-dom" 5.11.4 -> 5.16.2
"@testing-library/react" 12.1.0 -> 12.1.2
"@testing-library/user-event" 12.1.10 -> 13.5.0
"chroma-js" 2.1.2 -> 2.4.2
"prop-types" 15.7.2 -> 15.8.1
"react-router-dom" 6.0.2 -> 6.2.1
"react-scripts" 4.0.3 -> 5.0.0
"stylis" 4.0.10 -> 4.0.13
"stylis-plugin-rtl" 2.1.0 -> 2.1.1
"web-vitals" 1.0.1 -> 2.1.4
"yup" 0.32.9 -> 0.32.11
- Migration from Material-UI to MUI v5.
- Migration from JSS to
styled
api, emotion andsx
prop. - Product folders and files structured are updated: README
- New components are added
- New example blocks are added
- Components are Example Blocks are now totally customizable and reusable
- Product now uses the react context api for global configurations
- AdminNavbar.js
- ChartBar.js
- ChartLine.js
- Footer.js
- MapExample.js
- PageVisitsCard.js
- ProfileCard.js
- SettingsForm.js
- Sidebar.js
- StatusCard.js
- TableCard.js
- TrafficCard.js
- MDAlert
- MDAvatar
- MDBadge
- MDBox
- MDButton
- MDInput
- MDPagination
- MDProgress
- MDSnackbar
- MDTypography
- Breadcrumbs
- Cards
- BlogCards
- SimpleBlogCard
- InfoCards
- DefaultInfoCard
- ProfileInfoCard
- MasterCard
- ProjectCards
- DefaultProjectCard
- StatisticsCards
- ComplexStatisticsCard
- BlogCards
- Charts
- BarCharts
- HorizontalBarChart
- VerticalBarChart
- ReportsBarChart
- BubbleChart
- DoughnutCharts
- DefaultDoughnutChart
- LineCharts
- DefaultLineChart
- GradientLineChart
- ProgressLineChart
- ReportsLineChart
- MixedChart
- PieChart
- PolarChart
- RadarChart
- BarCharts
- Configurator
- Footer
- Items
- NotificationItem
- LayoutContainers
- DashboardLayout
- PageLayout
- Lists
- ProfilesList
- Navbars
- DashboardNavbar
- DefaultNavbar
- Sidenav
- Tables
- DataTable
- Timeline
- TimelineList
- TimelineItem
@material-ui/core
@material-ui/icons
chartist
classnames
match-sorter
moment
node-sass
react-chartist
@mui/material
@mui/icons-material
@mui/styled-engine
@emotion/cache
@emotion/react
@emotion/styled
@testing-library/jest-dom
@testing-library/react":
@testing-library/user-event
chart.js
chroma-js
prop-types
react-chartjs-2
stylis
stylis-plugin-rtl
uuid
web-vitals
- #145 (this was solved since we've changed react-google-maps with simple Google Maps API)
- #140 (this was solved since we've changed react-google-maps with simple Google Maps API)
- #138 (can be closed since it was help wanted)
- #137 (user did not respond)
- #133 (fixed it by using
useLocation
fromreact-router-dom
) - #16 (please check the following page: https://demos.creative-tim.com/material-dashboard-react/#/rtl/rtl-page)
react-google-maps
(we've replaced this with simple Google Maps API)@types/googlemaps
(we've replaced this with simple Google Maps API)@types/markerclustererplus
(we've replaced this with simple Google Maps API)ajv
(this was only installed to stop some install warnings)history
(we'll useBrowserRouter
fromreact-router-dom
package instead)
@babel/[email protected]
(to stop install warnings)
@material-ui/core 4.10.0 → 4.11.4
@material-ui/icons 4.9.1 → 4.11.2
classnames 2.2.6 → 2.3.1
perfect-scrollbar 1.5.0 → 1.5.1
react 16.13.1 → 17.0.2
react-chartist 0.14.3 → 0.14.4
react-dom 16.13.1 → 17.0.2
react-scripts 3.4.1 → 4.0.3
eslint-config-prettier 6.11.0 → 8.3.0
eslint-plugin-prettier 3.1.3 → 3.4.0
gulp-append-prepend 1.0.8 → 1.0.9
prettier 2.0.5 → 2.2.1
typescript 3.9.3 → 4.2.4
Warnings might appear while doing an npm install - they do not affect the UI or the functionality of the product, and they appear because of NodeJS and not from the product itself.
npm WARN [email protected] requires a peer of react@^15.3.0 || ^16.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of react@^16.3.0 but none is installed. You must install peer dependencies yourself.
You will also have the following message: found 88 vulnerabilities (1 low, 87 moderate) in 2207 scanned packages
. This comes from react-scripts, and will be fixed in the next version. NOTE: the product works as expected with these vulnerabilities
.
@material-ui/core 4.3.2 → 4.10.0
@material-ui/icons 4.2.1 → 4.9.1
history 4.9.0 → 4.10.1
perfect-scrollbar 1.4.0 → 1.5.0
react 16.9.0 → 16.13.1
react-chartist 0.13.3 → 0.14.3
react-dom 16.9.0 → 16.13.1
react-router-dom 5.0.1 → 5.2.0
react-scripts 3.1.0 → 3.4.1
react-swipeable-views 0.13.3 → 0.13.9
eslint-config-prettier 6.0.0 → 6.11.0
eslint-plugin-prettier 3.1.0 → 3.1.3
prettier 1.18.2 → 2.0.5
@types/googlemaps 3.37.3 → 3.39.6
ajv 6.10.2 → 6.12.2
typescript 3.5.3 → 3.9.3
While in development some of the plugins that were used for this product will throw some warnings - note, this only happens in development, the UI or the functionality of the product is not affected, also, if the issues will persist in React 17, we'll drop usage of those plugins, and replace them with other ones. Warnings might appear while doing an npm install - they do not affect the UI or the functionality of the product, and they appear because of NodeJS and not from the product itself.
- Rewrote the ISSUE_TEMPLATE
- Deleted the copyright comments from all files, we only need to keep them inside our index.js and index.html
- Added script that adds copyrights to the built app
- Renamed all the files from
.jsx
to.js
- Changed the
withStyles
function from Material-UI with themakeStyles
function (integration with other frameworks should now be easy) - React Hooks is now supported
- Renamed
assets/jss/material-dashboard-react/layouts/dashboardStyle.js
toassets/jss/material-dashboard-react/layouts/adminStyle.js
@material-ui/core 4.1.0 → 4.3.2
@material-ui/icons 4.1.0 → 4.2.1
react 16.8.6 → 16.9.0
react-dom 16.8.6 → 16.9.0
react-scripts 3.0.1 → 3.1.0
eslint-config-prettier 4.3.0 → 6.0.0
@types/googlemaps 3.36.4 → 3.37.3
ajv 6.10.0 → 6.10.2
typescript 3.5.1 → 3.5.3
All React Material products have now the same version, i.e. 1.7.0.
- All linting errors are solved now, but due to google analytics stuff, we've needed to add target="_blank" to our links, so this lint error still exists.
- Bugs from updated dependencies
- Removed
.env
file, and replaced it with thejsconfig.json
file - Changes caused by running the prettier command for .jsx, .js, .html and .css files
- Changed all string refs to
React.createRef()
- Added types validation in each component
- Solved linting issues
- Solved #83
- [email protected] (To stop console warnings on install)
@material-ui/core 3.9.2 → 4.1.0
@material-ui/icons 3.0.2 → 4.1.0
chartist 0.10.1 → 0.11.2
history 4.7.2 → 4.9.0
prettier 1.16.4 → 1.18.2
prop-types 15.7.1 → 15.7.2
react 16.8.1 → 16.8.6
react-dom 16.8.1 → 16.8.6
react-router-dom 4.3.1 → 5.0.1
react-scripts 2.1.5 → 3.0.1
react-swipeable-views 0.13.1 → 0.13.3
eslint-config-prettier 4.0.0 → 4.3.0
eslint-plugin-prettier 3.0.1 → 3.1.0
@types/googlemaps 3.30.16 → 3.36.4
ajv 6.9.1 → 6.10.0
- Added new script for npm
- Changed our buggy routing system, now it should work flawlessly, for more info, please refer to our live docs here
- #67
- #68
- #66
- Almost all styles have been changed due to new components, solved issues or the prettier command
- Changes caused by running the prettier command for .jsx, .js, .html and .css files
- src/index.js
- src/components/CustomTabs/CustomTabs.jsx
- src/components/Header/Header.jsx
- src/components/Sidebar/Sidebar.jsx
- src/components/Snackbar/Snackbar.jsx
- src/components/Snackbar/SnackbarContent.jsx
- src/components/Tasks/Tasks.jsx
- src/views/Notifications/Notifications.jsx
- src/components/FixedPlugin/FixedPlugin.jsx(Left menu used by us for customization - due to this, we've had to add a link for the fonts awesome cdn)
- src/components/Header/RTLHeaderLinks.jsx
- src/layouts/Admin.jsx (instead of Dashboard)
- src/layouts/RTL.jsx
- src/views/RTLPage/RTLPage.jsx
- src/layouts/Dashboard/Dashboard.jsx (renamed to Admin)
- src/routes/dashboard.jsx
- src/routes/index.jsx
babel-plugin-module-resolver
(because of the upgrade ofreact-scripts
)babel-eslint
(because of the upgrade ofreact-scripts
)eslint
(because of the upgrade ofreact-scripts
)eslint-plugin-react
(because of the upgrade ofreact-scripts
)npm-run-all
history4.7.2
[email protected]
[email protected]
@material-ui/core
3.1.0 → 3.9.2@material-ui/icons
3.0.1 → 3.0.2@types/googlemaps
3.30.13 → 3.30.16ajv
^5.0.0 → 6.9.1prop-types
15.6.2 → 15.7.1react
16.5.2 → 16.8.1react-chartist
0.13.1 → 0.13.3react-dom
16.5.2 → 16.8.1react-scripts
1.1.5 → 2.1.5react-swipeable-views
0.12.17 → 0.13.1eslint-config-prettier
3.0.1 → 4.0.0eslint-plugin-prettier
2.6.2 → 3.0.1
- Added
install:clean
command (deletesnode_modules
andpackage-lock.json
and runsnpm install
)
src/assets/jss/material-dashboard-react/components/tasksStyle.jsx
src/assets/jss/material-dashboard-react/checkboxAdnRadioStyle.jsx
src/assets/jss/material-dashboard-react/components/customTabsStyle.jsx
src/assets/jss/material-dashboard-react/components/snackbarContentStyle.jsx
@babel/runtime v7.0.0-beta.55
@material-ui/core
1.4.3 → 3.1.0@material-ui/icons
2.0.1 → 3.0.1@types/googlemaps
3.30.11 → 3.30.13ajv
6.5.2 → 5.0.0 (to stop some warnings)react
16.4.1 → 16.5.2react-dom
16.4.1 → 16.5.2react-scripts
1.1.4 → 1.1.5react-swipeable-views
0.12.15 → 0.12.17eslint-config-prettier
^2.9.0 → 3.0.1eslint-plugin-react
^7.10.0 → 7.11.1prettier
^1.13.7 → 1.14.3
- Github solved issues:
https://github.com/creativetimofficial/material-dashboard-react/issues/58
- Changed the
GridContainer
component
src/assets/jss/material-dashboard-react/components/footerStyle.jsx
src/assets/jss/material-dashboard-react/components/headerStyle.jsx
@babel/runtime v7.0.0-beta.55
@material-ui/core v1.4.1
to@material-ui/core v1.4.3
@material-ui/icons v2.0.0
to@material-ui/icons v2.0.1
- Added resize event listener for window (see this issue here)
- Added issues template file
- Github solved issues:
- Github enhancement issues:
- #47 (read the ./README.md file)
- Added styles for
svg
's, font-awesome classes and.material-icons
class insidesrc/assets/jss/material-dashboard-react/views/dashboardStyle.jsx
src/assets/jss/material-dashboard-react/components/buttonStyle.jsx
src/assets/jss/material-dashboard-react/components/cardFooterStyle.jsx
src/assets/jss/material-dashboard-react/components/cardHeaderStyle.jsx
src/assets/jss/material-dashboard-react/components/headerLinksStyle.jsx
src/assets/jss/material-dashboard-react/components/customTabsStyle.jsx
- Others
src/assets/jss/material-dashboard-react/tooltipStyle.jsx
src/assets/jss/material-dashboard-react/dropdownStyle.jsx
- Dropped popper usage in favour of
@material-ui/core/Popper
(Changes insrc/components/Header/HeaderLinks.jsx
)
src/components/Grid/GridContainer.jsx
(instead of MUI's<Grid container...
component)
@material-ui/core v1.2.1
to@material-ui/core v1.4.1
@material-ui/icons v1.1.0
to@material-ui/icons v2.0.0
@types/googlemaps v3.30.9
to@types/googlemaps v3.30.11
ajv v6.5.1
toajv v6.5.2
react v16.4.0
toreact v16.4.1
react-dom v16.4.0
toreact-dom v16.4.1
react-swipeable-views v0.12.13
toreact-swipeable-views v0.12.15
- Changed import from
material-ui
to@material-ui/core
- Droped
src/components/index.js
, and changed all the imports to separate ones - Renamed
ItemGrid
toGridItem
- Moved the styles of
src/components/
insidesrc/assets/jss/material-dashboard-react/components/
- Moved the styles of
src/layouts/
insidesrc/assets/jss/material-dashboard-react/layouts/
- Moved the styles of
src/views/
insidesrc/assets/jss/material-dashboard-react/views/
- Almost all styles have been changed more or less
src/components/CustomButtons/IconButton.jsx
(instead usesrc/components/CustomButtons/Button.jsx
withjustIcon
prop)- Some components from
src/components/Typography
(instead of these we've added some css to style the normal HTML tags)src/components/Typography/A.jsx
src/components/Typography/P.jsx
src/components/Typography/Small.jsx
- All the cards from
src/components/Cards
src/components/Cards/ChartCard.jsx
src/components/Cards/ProfileCard.jsx
src/components/Cards/RegularCard.jsx
src/components/Cards/StatsCard.jsx
src/components/Cards/TasksCard.jsx
- New card components (
src/components/Card/*
) instead ofsrc/components/Cards/*
src/components/Card/Card.jsx
src/components/Card/CardAvatar.jsx
src/components/Card/CardBody.jsx
src/components/Card/CardFooter.jsx
src/components/Card/CardHeader.jsx
src/components/Card/CardIcon.jsx
src/components/CustomTabs/CustomTabs.jsx
(instead ofsrc/components/Cards/TasksCard.jsx
)
@material-ui/[email protected]
(instead of[email protected]
)@types/[email protected]
to stop the warning: npm WARN [email protected] requires a peer of @types/googlemaps@^3.0.0 but none is installed. You must install peer dependencies yourself.@types/[email protected]
to stop the warning: npm WARN [email protected] requires a peer of @types/markerclustererplus@^2.1.29 but none is installed. You must install peer dependencies yourself.[email protected]
to stop the warning: npm WARN [email protected] requires a peer of ajv@^6.0.0 but none is installed. You must install peer dependencies yourself.
@material-ui/[email protected]
to@material-ui/[email protected]
[email protected]
to[email protected]
[email protected]
to[email protected]
[email protected]
to[email protected]
[email protected]
to[email protected]
[email protected]
to[email protected]
[email protected]
to[email protected]
[email protected]
to[email protected]
[email protected]
to[email protected]
- Renamed
src/containers/App/App.jsx
tosrc/layouts/Dashboard/Dashboard.jsx
- Renamed
src/variables/styles.jsx
tosrc/assets/jss/material-dashboard-react.jsx
- Moved all the files from
src/variables/styles/
tosrc/assets/jss/material-dashboard-react/
- Changes caused by the upgrade of
material-ui
- Small bug fixing
@material-ui/[email protected]
- PerfectScrollbar renders only on windows
- Used pretier to make the code more readable
- Optimized images sizes
- Changed
classes={root:...}
toclassNames={...}
only where it hadclasses={root:...}
and not likeclasses={root:..., something:... ,...}
- Added
classnames()
to avoid doing brittle class name manipulation - Classes that do not need states were converted to functions
- Moved the style variables in
src/variables/styles.jsx
and all the components styles insrc/variables/styles/{$componentNameStyle}.jsx
files - Added
-webkit-overflow-scrolling: touch
css for nice scrolling on mobile devices - Updated to latest
Material-UI
version (fromv1.0.0.beta30
tov1.0.0.beta34
)
- Added Material-UI as base framework
- Added design from Material Dashboard by Creative Tim