3 files changed, 117 insertions, 13 deletions
diff --git a/front/odiparpack/app/components/Sidebar/MainMenuSimple.js b/front/odiparpack/app/components/Sidebar/MainMenuSimple.js
new file mode 100644
index 0000000..f7634ca
--- /dev/null
+++ b/front/odiparpack/app/components/Sidebar/MainMenuSimple.js
@@ -0,0 +1,98 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { withStyles } from '@material-ui/core/styles';
+import classNames from 'classnames';
+import { bindActionCreators } from 'redux';
+import { connect } from 'react-redux';
+import { NavLink } from 'react-router-dom';
+import ExpandLess from '@material-ui/icons/ExpandLess';
+import ExpandMore from '@material-ui/icons/ExpandMore';
+// Menu Object
+import MenuContent from 'ba-api/menu';
+import { List, ListItem, ListItemIcon, ListItemText, Collapse, Icon } from '@material-ui/core';
+import styles from './sidebar-jss';
+
+function sortByKey(array, key) {
+  return array.sort((a, b) => {
+    const x = a[key]; const y = b[key];
+    return ((x < y) ? -1 : ((x > y) ? 1 : 0));
+  });
+}
+
+const LinkBtn = React.forwardRef(function LinkBtn(props, ref) { // eslint-disable-line
+  return <NavLink to={props.to} {...props} innerRef={ref} />; // eslint-disable-line
+});
+
+function MainMenuSimple(props) {
+  const {
+    classes,
+    toggleDrawerOpen,
+    loadTransition,
+    openSubMenu,
+    open,
+  } = props;
+
+  const handleClick = () => {
+    //toggleDrawerOpen();
+    loadTransition(false);
+  };
+
+  const getMenus = menuArray => menuArray.map((item, index) => {
+      return (
+        <div key={index.toString()}>
+          <ListItem
+            button
+            exact
+            className={classNames(classes.head, open.indexOf(item.key) > -1 ? classes.opened : '')}
+            activeClassName={classes.active}
+            component={LinkBtn}
+            to={item.link}
+            onClick={handleClick}
+            timeout="auto"
+            unmountOnExit
+          >
+            {item.icon
+              && (
+                <ListItemIcon className={classes.iconWrapper}>
+                  <Icon className={classes.icon}>{item.icon}</Icon>
+                </ListItemIcon>
+              )
+            }
+            <ListItemText classes={{ primary: classes.primary }} variant="inset" primary={item.name} />
+          </ListItem>
+        </div>
+      );
+  });
+  return (
+    <div>
+      {getMenus(MenuContent)}
+    </div>
+  );
+}
+
+MainMenuSimple.propTypes = {
+  classes: PropTypes.object.isRequired,
+  open: PropTypes.object.isRequired,
+  openSubMenu: PropTypes.func.isRequired,
+  toggleDrawerOpen: PropTypes.func.isRequired,
+  loadTransition: PropTypes.func.isRequired,
+};
+
+const openAction = (key, keyParent) => ({ type: 'OPEN_SUBMENU', key, keyParent });
+const reducer = 'ui';
+
+const mapStateToProps = state => ({
+  force: state, // force active class for sidebar menu
+  open: state.getIn([reducer, 'subMenuOpen'])
+});
+
+const mapDispatchToProps = dispatch => ({
+  openSubMenu: bindActionCreators(openAction, dispatch)
+});
+
+const MainMenuMapped = connect(
+  mapStateToProps,
+  mapDispatchToProps
+)(MainMenuSimple);
+
+export default withStyles(styles)(MainMenuMapped);
diff --git a/front/odiparpack/app/components/Sidebar/Sidebar.js b/front/odiparpack/app/components/Sidebar/Sidebar.js
index 01de4ec..b4f5626 100644
--- a/front/odiparpack/app/components/Sidebar/Sidebar.js
+++ b/front/odiparpack/app/components/Sidebar/Sidebar.js
@@ -4,10 +4,10 @@ import { withStyles } from '@material-ui/core/styles';
 import classNames from 'classnames';
 import brand from 'ba-api/brand';
 import dummy from 'ba-api/dummyContents';
-import logo from 'ba-images/logo.svg';
-import { Hidden, Drawer, SwipeableDrawer, List, Divider, Avatar } from '@material-ui/core';
-import MainMenu from './MainMenu';
-import OtherMenu from './OtherMenu';
+import logo from 'ba-images/logo.png';
+import { Hidden, Drawer, SwipeableDrawer, Avatar } from '@material-ui/core';
+import MainMenuSimple from './MainMenuSimple';
+//import OtherMenu from './OtherMenu';
 import styles from './sidebar-jss';
 
 const MenuContent = props => {
@@ -38,11 +38,11 @@ const MenuContent = props => {
         </div>
       </div>
       <div className={classes.menuContainer}>
-        <MainMenu loadTransition={loadTransition} toggleDrawerOpen={toggleDrawerOpen} />
-        <Divider className={classes.divider} />
+        <MainMenuSimple loadTransition={loadTransition} toggleDrawerOpen={toggleDrawerOpen} />
+        {/* <Divider className={classes.divider} />
         <List>
           <OtherMenu toggleDrawerOpen={toggleDrawerOpen} />
-        </List>
+        </List> */}
       </div>
     </div>
   );
diff --git a/front/odiparpack/app/components/Sidebar/sidebar-jss.js b/front/odiparpack/app/components/Sidebar/sidebar-jss.js
index e9bf4f6..95fb2b2 100644
--- a/front/odiparpack/app/components/Sidebar/sidebar-jss.js
+++ b/front/odiparpack/app/components/Sidebar/sidebar-jss.js
@@ -76,11 +76,14 @@ const styles = theme => ({
     }
   },
   avatar: {
-    margin: 10,
+    marginBottom: 10,
+    marginTop: 10,
+    marginLeft: 6,
+    marginRight: 10
   },
   bigAvatar: {
-    width: 80,
-    height: 80,
+    width: 55,
+    height: 55,
   },
   brandBar: {
     transition: theme.transitions.create(['width', 'margin', 'background'], {
@@ -168,16 +171,19 @@ const styles = theme => ({
     fontSize: 14,
     padding: 10,
     alignItems: 'center',
+    justifyContent: 'flex-start',
     '& h4': {
-      fontSize: 18,
+      fontSize: 19,
       marginBottom: 0,
       textOverflow: 'ellipsis',
+      display: 'flex',
       overflow: 'hidden',
       whiteSpace: 'nowrap',
-      width: 110
+      wordBreak:'break-all',
+      width: 180,
     },
     '& span': {
-      fontSize: 12,
+      fontSize: 14,
       textOverflow: 'ellipsis',
       whiteSpace: 'nowrap',
       width: 110,