Verified Commit e5fadf3f authored by reprograma's avatar reprograma
Browse files

fix: logout route broken after react-router upgrade

parent 9b881e61
......@@ -12,34 +12,36 @@
"dependencies": {
"@material-ui/core": "^3.9.2",
"@material-ui/icons": "^3.0.2",
"axios": "^0.19.0",
"chart.js": "^2.7.3",
"chartist": "^0.11.0",
"axios": "^0.19.2",
"babel-eslint": "^10.0.3",
"chart.js": "^2.9.3",
"chartist": "^0.11.4",
"classnames": "^2.2.6",
"eslint": "^6.6.0",
"eslint": "^6.8.0",
"eslint-config-airbnb": "^18.0.1",
"eslint-config-prettier": "^6.6.0",
"eslint-plugin-import": "^2.18.2",
"eslint-config-prettier": "^6.10.0",
"eslint-plugin-import": "^2.20.1",
"eslint-plugin-jsx-a11y": "^6.2.3",
"eslint-plugin-prettier": "^3.1.1",
"eslint-plugin-react": "^7.14.3",
"eslint-plugin-react-hooks": "^1.7.0",
"eslint-plugin-prettier": "^3.1.2",
"eslint-plugin-react": "^7.18.3",
"eslint-plugin-react-hooks": "^2.3.0",
"history": "^4.10.1",
"perfect-scrollbar": "^1.4.0",
"perfect-scrollbar": "^1.5.0",
"prettier": "^1.19.1",
"prop-types": "^15.7.2",
"qrcode.react": "^0.9.3",
"react": "^16.11.0",
"react": "^16.12.0",
"react-bootstrap-sweetalert": "^4.4.1",
"react-chartist": "^0.13.3",
"react-chartjs-2": "^2.8.0",
"react-dom": "^16.11.0",
"react-chartist": "^0.14.3",
"react-chartjs-2": "^2.9.0",
"react-dom": "^16.12.0",
"react-redux": "^6.0.1",
"react-router-dom": "^4.3.1",
"react-scripts": "3.2.0",
"react-router": "^5.1.2",
"react-router-dom": "^5.1.2",
"react-scripts": "3.4.0",
"react-table": "^6.9.2",
"redux": "^4.0.1",
"redux-actions": "^2.6.4",
"redux": "^4.0.5",
"redux-actions": "^2.6.5",
"redux-thunk": "^2.3.0"
},
"browserslist": [
......@@ -49,7 +51,7 @@
"not op_mini all"
],
"devDependencies": {
"husky": "^4.2.1",
"husky": "^4.2.3",
"lint-staged": "^10.0.7",
"redux-devtools-extension": "^2.13.8"
},
......@@ -63,4 +65,4 @@
"eslint --fix"
]
}
}
\ No newline at end of file
}
import React from "react";
import PropTypes from "prop-types";
import cx from "classnames";
import React from 'react';
import PropTypes from 'prop-types';
import cx from 'classnames';
// @material-ui/core components
import withStyles from "@material-ui/core/styles/withStyles";
import AppBar from "@material-ui/core/AppBar";
import Toolbar from "@material-ui/core/Toolbar";
import Hidden from "@material-ui/core/Hidden";
import withStyles from '@material-ui/core/styles/withStyles';
import AppBar from '@material-ui/core/AppBar';
import Toolbar from '@material-ui/core/Toolbar';
import Hidden from '@material-ui/core/Hidden';
// material-ui icons
import Menu from "@material-ui/icons/Menu";
import MoreVert from "@material-ui/icons/MoreVert";
import ViewList from "@material-ui/icons/ViewList";
import Menu from '@material-ui/icons/Menu';
import MoreVert from '@material-ui/icons/MoreVert';
import ViewList from '@material-ui/icons/ViewList';
// core components
import HeaderLinks from "./HeaderLinks";
import Button from "components/atoms/CustomButtons/Button.jsx";
import Button from 'components/atoms/CustomButtons/Button';
import headerStyle from "assets/jss/material-dashboard-pro-react/components/headerStyle.jsx";
import headerStyle from 'assets/jss/material-dashboard-pro-react/components/headerStyle';
import HeaderLinks from './HeaderLinks';
function Header({ ...props }) {
function makeBrand() {
var name;
props.routes.map((prop, key) => {
let name;
props.routes.map(prop => {
if (prop.collapse) {
prop.views.map((prop, key) => {
prop.views.map(prop => {
if (prop.path === props.location.pathname) {
name = prop.name;
}
......@@ -36,22 +36,22 @@ function Header({ ...props }) {
}
return null;
});
if(name){
if (name) {
return name;
} else {
return "Default Brand Name";
}
return 'Default Brand Name';
}
const { classes, color, rtlActive } = props;
const appBarClasses = cx({
[" " + classes[color]]: color
[` ${classes[color]}`]: color
});
const sidebarMinimize =
classes.sidebarMinimize +
" " +
cx({
[classes.sidebarMinimizeRTL]: rtlActive
});
const sidebarMinimize = `${classes.sidebarMinimize} ${cx({
[classes.sidebarMinimizeRTL]: rtlActive
})}`;
return (
<AppBar className={classes.appBar + appBarClasses}>
<Toolbar className={classes.container}>
......@@ -105,8 +105,11 @@ function Header({ ...props }) {
Header.propTypes = {
classes: PropTypes.object.isRequired,
color: PropTypes.oneOf(["primary", "info", "success", "warning", "danger"]),
rtlActive: PropTypes.bool
};
Header.defaultProps = {
rtlActive: false
};
export default withStyles(headerStyle)(Header);
import React from "react";
import classNames from "classnames";
import PropTypes from "prop-types";
// import { Manager, Target, Popper } from "react-popper";
import React from 'react';
import classNames from 'classnames';
import PropTypes from 'prop-types';
import { withRouter } from 'react-router';
// import { Manager, Target, Popper } from 'react-popper';
// @material-ui/core components
import withStyles from "@material-ui/core/styles/withStyles";
import MenuItem from "@material-ui/core/MenuItem";
import MenuList from "@material-ui/core/MenuList";
import Paper from "@material-ui/core/Paper";
import Grow from "@material-ui/core/Grow";
import Hidden from "@material-ui/core/Hidden";
import Popper from "@material-ui/core/Popper";
import withStyles from '@material-ui/core/styles/withStyles';
import MenuItem from '@material-ui/core/MenuItem';
import MenuList from '@material-ui/core/MenuList';
import Paper from '@material-ui/core/Paper';
import Grow from '@material-ui/core/Grow';
import Hidden from '@material-ui/core/Hidden';
import Popper from '@material-ui/core/Popper';
// @material-ui/icons
import Person from "@material-ui/icons/Person";
import Button from "components/atoms/CustomButtons/Button.jsx";
import Person from '@material-ui/icons/Person';
import Button from 'components/atoms/CustomButtons/Button';
import { logOut } from 'utils';
import headerLinksStyle from "assets/jss/material-dashboard-pro-react/components/headerLinksStyle";
import headerLinksStyle from 'assets/jss/material-dashboard-pro-react/components/headerLinksStyle';
class HeaderLinks extends React.Component {
state = {
open: false
};
static contextTypes = {
router: PropTypes.object.isRequired,
};
handleClick = () => {
this.setState({ open: !this.state.open });
this.setState(prevState => ({ open: !prevState.open }));
};
handleLogOut = () => {
this.setState({ open: false });
logOut()
this.context.router.history.push('/login')
logOut();
this.props.history.push('/login');
};
render() {
const { classes, rtlActive } = this.props;
const { open } = this.state;
......@@ -42,12 +43,15 @@ class HeaderLinks extends React.Component {
classes.primaryHover,
{ [classes.dropdownItemRTL]: rtlActive }
);
const wrapper = classNames({
[classes.wrapperRTL]: rtlActive
});
const managerClasses = classNames({
[classes.managerClasses]: true
});
return (
<div className={wrapper}>
<div className={managerClasses}>
......@@ -58,24 +62,22 @@ class HeaderLinks extends React.Component {
onClick={this.handleClick}
className={rtlActive ? classes.buttonLinkRTL : classes.buttonLink}
muiClasses={{
label: rtlActive ? classes.labelRTL : ""
label: rtlActive ? classes.labelRTL : ''
}}
buttonRef={node => {
this.anchorEl = node;
}}
>
<Person
className={
classes.headerLinksSvg +
" " +
(rtlActive
? classes.links + " " + classes.linksRTL
: classes.links)
}
className={`${classes.headerLinksSvg} ${
rtlActive
? `${classes.links} ${classes.linksRTL}`
: classes.links
}`}
/>
<Hidden mdUp implementation="css">
<span className={classes.linkText}>
{rtlActive ? "الملف الشخصي" : "Profile"}
{rtlActive ? 'الملف الشخصي' : 'Profile'}
</span>
</Hidden>
</Button>
......@@ -91,21 +93,21 @@ class HeaderLinks extends React.Component {
[classes.pooperNav]: true
})}
>
{({ TransitionProps, placement }) => (
{({ TransitionProps }) => (
<Grow
{...TransitionProps}
id="menu-list"
style={{ transformOrigin: "0 0 0" }}
style={{ transformOrigin: '0 0 0' }}
>
<Paper className={classes.dropdown}>
<MenuList role="menu">
<MenuItem
onClick={this.handleLogOut}
className={dropdownItem}
>
Log out
</MenuItem>
</MenuList>
<MenuList role="menu">
<MenuItem
onClick={this.handleLogOut}
className={dropdownItem}
>
Log out
</MenuItem>
</MenuList>
</Paper>
</Grow>
)}
......@@ -118,7 +120,12 @@ class HeaderLinks extends React.Component {
HeaderLinks.propTypes = {
classes: PropTypes.object.isRequired,
rtlActive: PropTypes.bool
rtlActive: PropTypes.bool,
history: PropTypes.object.isRequired
};
HeaderLinks.defaultProps = {
rtlActive: false
};
export default withStyles(headerLinksStyle)(HeaderLinks);
\ No newline at end of file
export default withStyles(headerLinksStyle)(withRouter(HeaderLinks));
This diff is collapsed.
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment