Merge pull request #16 from CodeDead/release/2.0.1.0

Release/2.0.1.0

Author: CodeDead

README.md

@@ -1,7 +1,7 @@
-![DeadHash](https://codedead.com/wp-content/uploads/2019/12/deadhash.png)
+![DeadHash](https://codedead.com/wp-content/uploads/2020/01/deadhash-dark.png)
 
 # DeadHash
-DeadHash is a freeware utility to calculate file and text hashes. The following hash calculations are supported:
+DeadHash is a free and open-source utility to calculate file and text hashes. The following hash calculations are supported:
 * MD5
 * SHA1
 * SHA224
@@ -11,7 +11,7 @@ DeadHash is a freeware utility to calculate file and text hashes. The following
 * SHA512
 * RIPEMD160
 
-This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app) and [Electron](https://electronjs.org/).
+This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app) and built using [Electron](https://electronjs.org/).
 
 ## Learn More
 You can learn more in the [Create React App documentation](https://facebook.github.io/create-react-app/docs/getting-started).

package.json

@@ -1,6 +1,6 @@
 {
   "name": "deadhash",
-  "version": "2.0.0",
+  "version": "2.0.1",
   "description": "Hash calculator",
   "homepage": "./",
   "private": true,
@@ -35,9 +35,9 @@
   },
   "main": "public/electron.js",
   "dependencies": {
-    "@material-ui/core": "^4.8.2",
+    "@material-ui/core": "^4.9.0",
     "@material-ui/icons": "^4.5.1",
-    "axios": "^0.19.0",
+    "axios": "^0.19.2",
     "cross-env": "^6.0.3",
     "crypto-js": "^3.1.9-1",
     "electron-is-dev": "^1.1.0",
@@ -78,8 +78,8 @@
   },
   "devDependencies": {
     "concurrently": "^5.0.2",
-    "electron": "^7.1.7",
-    "electron-builder": "^21.2.0",
-    "wait-on": "^3.3.0"
+    "electron": "^7.1.10",
+    "electron-builder": "^22.2.0",
+    "wait-on": "^4.0.0"
   }
 }

src/components/AlertDialog/index.js

@@ -0,0 +1,44 @@
+import React, {useState} from "react";
+import DialogTitle from "@material-ui/core/DialogTitle";
+import DialogContent from "@material-ui/core/DialogContent";
+import DialogContentText from "@material-ui/core/DialogContentText";
+import DialogActions from "@material-ui/core/DialogActions";
+import Button from "@material-ui/core/Button";
+import Dialog from "@material-ui/core/Dialog";
+import {useSelector} from "react-redux";
+
+const AlertDialog = ({title, content}) => {
+
+    const language = useSelector(state => state.MainReducer.languages[state.MainReducer.languageIndex]);
+    const [open, setOpen] = useState(true);
+
+    /**
+     * Close the AlertDialog instance
+     */
+    const handleClose = () => {
+        setOpen(false);
+    };
+
+    return (
+        <Dialog
+            open={open}
+            onClose={handleClose}
+            aria-labelledby="alert-dialog-title"
+            aria-describedby="alert-dialog-description"
+        >
+            <DialogTitle id="alert-dialog-title">{title}</DialogTitle>
+            <DialogContent>
+                <DialogContentText id="alert-dialog-description">
+                    {content}
+                </DialogContentText>
+            </DialogContent>
+            <DialogActions>
+                <Button onClick={handleClose} color="primary" autoFocus>
+                    {language.ok}
+                </Button>
+            </DialogActions>
+        </Dialog>
+    );
+};
+
+export default AlertDialog;

src/components/AlertModal/index.js

@@ -9,23 +9,35 @@ import Topbar from "../Topbar";
 import About from "../../routes/About";
 import File from "../../routes/File";
 import Text from "../../routes/Text";
+import Drawerbar from "../Drawerbar";
+import {CssBaseline} from "@material-ui/core";
+import DropZone from "../DropZone";
 
 function App() {
 
-    const themeIndex = useSelector(state => state.MainReducer.themeIndex);
+    let themeIndex = useSelector(state => state.MainReducer.themeIndex);
+
+    let themeType = "light";
+    if (themeIndex === 8) {
+        themeType = "dark";
+        themeIndex = 2;
+    }
     const color = ThemeSelector(themeIndex);
 
     const theme = createMuiTheme({
         palette: {
             primary: color,
+            type: themeType
         }
     });
 
     return (
         <ThemeProvider theme={theme}>
             <BrowserRouter>
-                <div className="App">
+                <DropZone>
                     <Topbar/>
+                    <Drawerbar/>
+                    <CssBaseline/>
                     <Switch>
                         <Route path={"/settings"}>
                             <Settings/>
@@ -43,7 +55,7 @@ function App() {
                             <Home/>
                         </Route>
                     </Switch>
-                </div>
+                </DropZone>
             </BrowserRouter>
         </ThemeProvider>
     );

src/components/App/index.js

@@ -34,8 +34,8 @@ const CryptographyMenu = ({handleIndexChange, selectedIndex}) => {
             <ListItem button selected={selectedIndex === 0}>
                 <ListItemIcon onClick={() => handleIndexChange(0)}><KeyIcon/></ListItemIcon>
                 <ListItemText onClick={() => handleIndexChange(0)} primary={language.cryptography}/>
-                {openCollapse ? <ExpandLessIcon onClick={handleOpenMenu}/> :
-                    <ExpandMoreIcon onClick={handleOpenMenu}/>}
+                {openCollapse ? <ExpandLessIcon color="inherit" onClick={handleOpenMenu}/> :
+                    <ExpandMoreIcon color="inherit" onClick={handleOpenMenu}/>}
             </ListItem>
             <Collapse in={openCollapse} timeout="auto" unmountOnExit>
                 <List component="div" disablePadding>

src/components/CryptographyMenu/index.js

@@ -0,0 +1,26 @@
+import React from "react";
+
+const CsvExport = ({children, data, fileName}) => {
+
+    let href = null;
+    if (data) {
+        let csvContent = "";
+        data.forEach(element => {
+            csvContent += element.type + "," + element.hash + "\n";
+        });
+
+        const blob = new Blob([csvContent], {type: 'text/csv;charset=utf-8;'});
+        href = URL.createObjectURL(blob);
+    }
+
+    return (
+        data ? (
+                <a href={href} download={fileName} target={"_self"}
+                   style={{textDecoration: "none"}}>
+                    {children}
+                </a>
+            ) : {children}
+    );
+};
+
+export default CsvExport;

src/components/CsvExport/index.js

@@ -13,10 +13,11 @@ import {useSelector, useDispatch} from "react-redux";
 import InfoIcon from '@material-ui/icons/Info';
 import BuildIcon from "@material-ui/icons/Build";
 import HelpIcon from "@material-ui/icons/Help";
+import CloseIcon from "@material-ui/icons/Close";
 import {useHistory} from "react-router-dom";
 import CryptographyMenu from "../CryptographyMenu";
 
-const drawerWidth = 220;
+const drawerWidth = 240;
 const useStyles = makeStyles(theme => ({
     drawer: {
         width: drawerWidth,
@@ -34,6 +35,8 @@ const useStyles = makeStyles(theme => ({
     }
 }));
 
+const remote = window.require('electron').remote;
+
 const Drawerbar = () => {
 
     const language = useSelector(state => state.MainReducer.languages[state.MainReducer.languageIndex]);
@@ -108,7 +111,7 @@ const Drawerbar = () => {
 
             <List>
                 <ListItem onClick={() => handleIndexChange(3)} selected={selectedItem === 3} button>
-                    <ListItemIcon><BuildIcon/></ListItemIcon>
+                    <ListItemIcon><BuildIcon color="inherit"/></ListItemIcon>
                     <ListItemText primary={language.settings}/>
                 </ListItem>
             </List>
@@ -117,15 +120,25 @@ const Drawerbar = () => {
 
             <List>
                 <ListItem onClick={() => handleIndexChange(4)} button>
-                    <ListItemIcon><HelpIcon/></ListItemIcon>
+                    <ListItemIcon><HelpIcon color="inherit" /></ListItemIcon>
                     <ListItemText primary={language.help}/>
                 </ListItem>
 
                 <ListItem onClick={() => handleIndexChange(5)} selected={selectedItem === 5} button>
-                    <ListItemIcon><InfoIcon/></ListItemIcon>
+                    <ListItemIcon><InfoIcon color="inherit"/></ListItemIcon>
                     <ListItemText primary={language.about}/>
                 </ListItem>
             </List>
+
+            <Divider />
+
+            <List>
+                <ListItem onClick={() => remote.getGlobal("mainWindow").close()} button>
+                    <ListItemIcon><CloseIcon color="inherit" /></ListItemIcon>
+                    <ListItemText primary={language.exit} />
+                </ListItem>
+            </List>
+
         </Drawer>
     );
 };

src/components/Drawerbar/index.js

@@ -0,0 +1,41 @@
+import React from "react";
+import {useHistory} from "react-router-dom";
+import {useDispatch, useSelector} from "react-redux";
+
+const DropZone = ({children}) => {
+
+    const history = useHistory();
+    const enabled = useSelector(state => state.MainReducer.canDragDrop);
+    const dispatch = useDispatch();
+
+    /**
+     * Event that is fired when one or more files are dropped
+     * @param event The event that contains the drop details
+     */
+    const onDrop = (event) => {
+        event.preventDefault();
+        if (!enabled) return;
+
+        dispatch({type: 'SET_CURRENT_FILE', payload: event.dataTransfer.files[0]});
+        history.push("/file");
+    };
+
+    /**
+     * Event that is fired when a drag over event is detected
+     * @param event The event that contains the drag over details
+     */
+    const onDragOver = (event) => {
+        event.preventDefault();
+    };
+
+    return (
+        <div
+            onDragOver={onDragOver}
+            onDrop={onDrop}>
+            {children}
+        </div>
+    );
+
+};
+
+export default DropZone;