* Simplified drawerbar

Author: CodeDead

.gitignore

@@ -24,3 +24,4 @@ yarn-error.log*
 
 .idea
 .idea/*
+dist/*

src/components/App/index.js

@@ -36,7 +36,6 @@ function App() {
             <BrowserRouter>
                 <DropZone>
                     <Topbar/>
-                    <Drawerbar/>
                     <CssBaseline/>
                     <Switch>
                         <Route path={"/settings"}>

src/components/Drawerbar/index.js

@@ -9,7 +9,7 @@ import ChevronRightIcon from '@material-ui/icons/ChevronRight';
 import ListItem from '@material-ui/core/ListItem';
 import ListItemIcon from '@material-ui/core/ListItemIcon';
 import ListItemText from '@material-ui/core/ListItemText';
-import {useSelector, useDispatch} from "react-redux";
+import {useSelector} from "react-redux";
 import InfoIcon from '@material-ui/icons/Info';
 import BuildIcon from "@material-ui/icons/Build";
 import HelpIcon from "@material-ui/icons/Help";
@@ -37,31 +37,29 @@ const useStyles = makeStyles(theme => ({
 
 const ipcRenderer = window.require('electron').ipcRenderer;
 
-const Drawerbar = () => {
+const Drawerbar = ({open, onClose}) => {
 
     const language = useSelector(state => state.MainReducer.languages[state.MainReducer.languageIndex]);
-    const open = useSelector(state => state.MainReducer.drawerOpen);
     const selectedItem = useSelector(state => state.MainReducer.selectedListItem);
 
     const history = useHistory();
 
     const classes = useStyles();
     const theme = useTheme();
-    const dispatch = useDispatch();
 
     /**
      * Function that is called when the drawer should close
      */
     const handleDrawerClose = () => {
-        dispatch({type: "SET_DRAWEROPEN", drawerOpen: false});
+        onClose();
     };
 
     /**
      * Handle a page change
      * @param index The index of the page
      */
     const handleIndexChange = (index) => {
-        dispatch({type: "SET_DRAWEROPEN", drawerOpen: false});
+        onClose();
         if (selectedItem === index) return;
 
         switch (index) {
@@ -138,7 +136,6 @@ const Drawerbar = () => {
                     <ListItemText primary={language.exit}/>
                 </ListItem>
             </List>
-
         </Drawer>
     );
 };

src/components/Topbar/index.js

@@ -13,6 +13,7 @@ import CloseIcon from '@material-ui/icons/Close';
 import MinimizeIcon from "@material-ui/icons/Minimize";
 import FullScreenIcon from "@material-ui/icons/Fullscreen";
 import FullscreenExitIcon from "@material-ui/icons/FullscreenExit";
+import Drawerbar from "../Drawerbar";
 
 const drawerWidth = 220;
 const useStyles = makeStyles(theme => ({
@@ -46,7 +47,6 @@ const ipcRenderer = window.require('electron').ipcRenderer;
 const Topbar = () => {
 
     const classes = useStyles();
-    const open = useSelector(state => state.MainReducer.drawerOpen);
     const languageIndex = useSelector(state => state.MainReducer.languageIndex);
     const language = useSelector(state => state.MainReducer.languages[state.MainReducer.languageIndex]);
     const minimizeEnabled = useSelector(state => state.MainReducer.minimizeEnabled);
@@ -56,6 +56,7 @@ const Topbar = () => {
 
     const [anchorEl, setAnchorEl] = useState(null);
     const [fullScreen, setFullScreen] = useState(false);
+    const [drawerOpen, setDrawerOpen] = useState(false);
     const languageOpen = Boolean(anchorEl);
 
     ipcRenderer.on("window-maximized", () => {
@@ -70,7 +71,7 @@ const Topbar = () => {
      * Open the drawer
      */
     const openDrawer = () => {
-        dispatch({type: "SET_DRAWEROPEN", drawerOpen: true});
+        setDrawerOpen(true);
     };
 
     /**
@@ -114,9 +115,9 @@ const Topbar = () => {
     return (
         <div className={classes.root}>
             <AppBar position="fixed" color={"primary"}
-                    className={open ? classes.appBarShift + ' ' + classes.appBar : classes.appBar}>
+                    className={drawerOpen ? classes.appBarShift + ' ' + classes.appBar : classes.appBar}>
                 <Toolbar>
-                    <IconButton edge="start" className={open ? classes.hide : null} color="inherit"
+                    <IconButton edge="start" className={drawerOpen ? classes.hide : null} color="inherit"
                                 aria-label="menu" onClick={openDrawer}>
                         <MenuIcon/>
                     </IconButton>
@@ -194,6 +195,7 @@ const Topbar = () => {
                     </IconButton>
                 </Toolbar>
             </AppBar>
+            <Drawerbar open={drawerOpen} onClose={() => setDrawerOpen(false)}/>
             <Toolbar/>
         </div>
     );

src/reducers/MainReducer/Actions/MainActions.js

@@ -1,7 +1,6 @@
 import {createAction} from 'redux-actions';
 
 export const setLanguageIndex = createAction("SET_LANGUAGEINDEX");
-export const setDrawerOpen = createAction("SET_DRAWEROPEN");
 export const setActiveListItem = createAction("SET_ACTIVE_LISTITEM");
 export const setThemeIndex = createAction("SET_THEME_INDEX");
 export const setAutoUpdate = createAction("SET_AUTO_UPDATE");

src/reducers/MainReducer/index.js

@@ -3,7 +3,6 @@ import en_US from "../../languages/en_US";
 import {
     setLanguageIndex,
     setActiveListItem,
-    setDrawerOpen,
     setThemeIndex,
     setAutoUpdate,
     setUpdateChecked,
@@ -88,12 +87,6 @@ const MainReducer = handleActions({
             selectedListItem: action.index
         }
     },
-    [setDrawerOpen](state, action) {
-        return {
-            ...state,
-            drawerOpen: action.drawerOpen
-        }
-    },
     [setThemeIndex](state, action) {
         localStorage['themeIndex'] = action.payload;
         return {

src/routes/About/index.js

@@ -40,7 +40,6 @@ const About = () => {
 
     ipcRenderer.on('get-version-reply', (e, version) => {
         setAppVersion(version);
-        console.log(version);
     });
     ipcRenderer.send('get-version');