Merge pull request #41 from CodeDead/feature/refactoring

feature/refactoring

Author: CodeDead

src/components/App/index.jsx

@@ -1,5 +1,9 @@
 import React, {
-  useContext, useEffect, useState, lazy, Suspense,
+  useContext,
+  useEffect,
+  useState,
+  lazy,
+  Suspense,
 } from 'react';
 import CssBaseline from '@mui/material/CssBaseline';
 import { createTheme, ThemeProvider } from '@mui/material/styles';
@@ -17,7 +21,11 @@ import TopBar from '../TopBar';
 import ClippedDrawer from '../ClippedDrawer';
 import UpdateDialog from '../UpdateDialog';
 import {
-  openWebSite, setCheckedForUpdates, setError, setLoading, setUpdate,
+  openWebSite,
+  setCheckedForUpdates,
+  setError,
+  setLoading,
+  setUpdate,
 } from '../../reducers/MainReducer/Actions';
 import Updater from '../../utils/Updater';
 import AlertDialog from '../AlertDialog';
@@ -176,7 +184,7 @@ const App = () => {
               {language.downloadApp}
             </Typography>
             <Button
-              onClick={() => window.open('https://codedead.com/software/advanced-passgen')}
+              onClick={() => openWebSite('https://codedead.com/software/advanced-passgen')}
               size="small"
               color="secondary"
             >

src/components/CreatePasswordDialog/index.jsx

@@ -42,6 +42,20 @@ const CreatePasswordDialog = ({ open, onCreate, onClose }) => {
   const [password, setPassword] = useState('');
   const [showPassword, setShowPassword] = useState(false);
 
+  const simpleCharacterSet = getFullCharacterSet(
+    characterSet,
+    useAdvanced,
+    smallLetters,
+    capitalLetters,
+    spaces,
+    numbers,
+    specialCharacters,
+    brackets,
+  );
+
+  const cannotGenerate = !simpleCharacterSet || simpleCharacterSet.length === 0
+    || min > max || max < min;
+
   /**
    * Close the dialog
    */
@@ -79,17 +93,7 @@ const CreatePasswordDialog = ({ open, onCreate, onClose }) => {
    * Generate passwords
    */
   const generatePassword = () => {
-    const simpleCharacterSet = getFullCharacterSet(
-      characterSet,
-      useAdvanced,
-      smallLetters,
-      capitalLetters,
-      spaces,
-      numbers,
-      specialCharacters,
-      brackets,
-    );
-    if (!simpleCharacterSet || simpleCharacterSet.length === 0 || min > max || max < min) {
+    if (cannotGenerate) {
       return;
     }
 
@@ -179,6 +183,7 @@ const CreatePasswordDialog = ({ open, onCreate, onClose }) => {
               color="primary"
               size="large"
               sx={{ width: '100%', height: '100%' }}
+              disabled={cannotGenerate}
               onClick={generatePassword}
             >
               <RefreshIcon fontSize="inherit" />

src/components/EditPasswordDialog/index.jsx

@@ -44,6 +44,20 @@ const EditPasswordDialog = ({
   const [password, setPassword] = useState(data && data.password ? data.password : '');
   const [showPassword, setShowPassword] = useState(false);
 
+  const simpleCharacterSet = getFullCharacterSet(
+    characterSet,
+    useAdvanced,
+    smallLetters,
+    capitalLetters,
+    spaces,
+    numbers,
+    specialCharacters,
+    brackets,
+  );
+
+  const cannotGenerate = !simpleCharacterSet || simpleCharacterSet.length === 0
+    || min > max || max < min;
+
   /**
    * Close the dialog
    */
@@ -77,17 +91,7 @@ const EditPasswordDialog = ({
    * Generate passwords
    */
   const generatePassword = () => {
-    const simpleCharacterSet = getFullCharacterSet(
-      characterSet,
-      useAdvanced,
-      smallLetters,
-      capitalLetters,
-      spaces,
-      numbers,
-      specialCharacters,
-      brackets,
-    );
-    if (!simpleCharacterSet || simpleCharacterSet.length === 0 || min > max || max < min) {
+    if (cannotGenerate) {
       return;
     }
 
@@ -177,6 +181,7 @@ const EditPasswordDialog = ({
               color="primary"
               size="large"
               sx={{ width: '100%', height: '100%' }}
+              disabled={cannotGenerate}
               onClick={generatePassword}
             >
               <RefreshIcon fontSize="inherit" />

src/components/LinearProgressWithLabel/index.jsx

@@ -8,6 +8,7 @@ const LinearProgressWithLabel = ({ value }) => (
     <Box sx={{ display: 'flex', alignItems: 'center' }}>
       <Box sx={{ width: '100%', mr: 1 }}>
         <LinearProgress
+          style={{ height: 10 }}
           variant="determinate"
           value={value}
         />

src/components/SelectFileDialog/index.jsx

@@ -21,6 +21,10 @@ const SelectFileDialog = ({
     }
   };
 
+  /**
+   * Accept and read the file
+   * @param e The event argument
+   */
   const handleFileChange = (e) => {
     e.preventDefault();
     const reader = new FileReader();

src/routes/About/index.jsx

@@ -14,6 +14,20 @@ const About = () => {
   const { languageIndex } = state;
   const language = state.languages[languageIndex];
 
+  /**
+   * Open the license page
+   */
+  const openLicense = () => {
+    openWebSite('https://codedead.com/Software/Advanced%20PassGen/gpl.pdf');
+  };
+
+  /**
+   * Open the home page
+   */
+  const openHomePage = () => {
+    openWebSite('https://codedead.com/');
+  };
+
   useEffect(() => {
     d1(setPageIndex(6));
   }, []);
@@ -34,15 +48,15 @@ const About = () => {
         variant="contained"
         style={{ float: 'left' }}
         sx={{ mt: 2 }}
-        onClick={() => openWebSite('https://codedead.com/Software/Advanced%20PassGen/gpl.pdf')}
+        onClick={openLicense}
       >
         {language.license}
       </Button>
       <Button
         variant="contained"
         style={{ float: 'right' }}
         sx={{ mt: 2 }}
-        onClick={() => openWebSite('https://codedead.com/')}
+        onClick={openHomePage}
       >
         {language.website}
       </Button>

src/routes/Advanced/index.jsx

@@ -14,9 +14,11 @@ import { setError, setLoading, setPageIndex } from '../../reducers/MainReducer/A
 import { MainContext } from '../../contexts/MainContextProvider';
 import { PasswordContext } from '../../contexts/PasswordContextProvider';
 import {
-  generatePasswordArray, getFullCharacterSet,
+  generatePasswordArray,
+  getFullCharacterSet,
   setAllowDuplicates,
-  setCharacterSet, setPasswords,
+  setCharacterSet,
+  setPasswords,
   setUseAdvanced,
 } from '../../reducers/PasswordReducer/Actions';
 import LoadingBar from '../../components/LoadingBar';
@@ -38,22 +40,25 @@ const Advanced = () => {
   const navigate = useNavigate();
   const worker = useWorker(createWorker);
 
+  const simpleCharacterSet = getFullCharacterSet(
+    characterSet,
+    useAdvanced,
+    smallLetters,
+    capitalLetters,
+    spaces,
+    numbers,
+    specialCharacters,
+    brackets,
+  );
+
+  const cannotGenerate = !simpleCharacterSet || simpleCharacterSet.length === 0
+    || min > max || max < min;
+
   /**
    * Generate passwords
    */
   const generatePasswords = () => {
-    const simpleCharacterSet = getFullCharacterSet(
-      characterSet,
-      useAdvanced,
-      smallLetters,
-      capitalLetters,
-      spaces,
-      numbers,
-      specialCharacters,
-      brackets,
-    );
-
-    if (!simpleCharacterSet || simpleCharacterSet.length === 0 || min > max || max < min) {
+    if (cannotGenerate) {
       return;
     }
 
@@ -71,6 +76,37 @@ const Advanced = () => {
       });
   };
 
+  /**
+   * Change whether duplicates are allowed or not
+   * @param event The event argument
+   */
+  const handleDuplicateChange = (event) => {
+    d2(setAllowDuplicates(event.target.checked));
+  };
+
+  /**
+   * Change wether advanced options are being used or not
+   * @param event The event argument
+   */
+  const handleAdvancedChange = (event) => {
+    d2(setUseAdvanced(event.target.checked));
+  };
+
+  /**
+   * Change the character set
+   * @param event The event argument
+   */
+  const handleCharacterSetChange = (event) => {
+    d2(setCharacterSet(event.target.value));
+  };
+
+  /**
+   * Go to the home page
+   */
+  const goHome = () => {
+    navigate('/');
+  };
+
   useEffect(() => {
     d1(setPageIndex(1));
   }, []);
@@ -92,7 +128,7 @@ const Advanced = () => {
                   control={(
                     <Checkbox
                       checked={allowDuplicates}
-                      onChange={(e) => d2(setAllowDuplicates(e.target.checked))}
+                      onChange={handleDuplicateChange}
                     />
                   )}
                   label={language.allowDuplicates}
@@ -101,7 +137,7 @@ const Advanced = () => {
                   control={(
                     <Checkbox
                       checked={useAdvanced}
-                      onChange={(e) => d2(setUseAdvanced(e.target.checked))}
+                      onChange={handleAdvancedChange}
                     />
                   )}
                   label={language.useCustomCharacterSet}
@@ -114,7 +150,7 @@ const Advanced = () => {
                 disabled={!useAdvanced}
                 value={characterSet}
                 fullWidth
-                onChange={(e) => d2(setCharacterSet(e.target.value))}
+                onChange={handleCharacterSetChange}
               />
             </Grid>
           </Grid>
@@ -125,7 +161,7 @@ const Advanced = () => {
         color="primary"
         style={{ float: 'left' }}
         sx={{ mt: 2 }}
-        onClick={() => navigate('/')}
+        onClick={goHome}
       >
         {language.general}
       </Button>
@@ -134,6 +170,7 @@ const Advanced = () => {
         color="primary"
         style={{ float: 'right' }}
         sx={{ mt: 2 }}
+        disabled={cannotGenerate}
         onClick={generatePasswords}
       >
         {language.generate}

src/routes/Advisor/index.jsx

@@ -18,6 +18,14 @@ const Advisor = () => {
 
   const [password, setPassword] = useState('');
 
+  /**
+   * Update the password
+   * @param event The event argument
+   */
+  const handlePasswordChange = (event) => {
+    setPassword(event.target.value);
+  };
+
   useEffect(() => {
     d1(setPageIndex(3));
   }, []);
@@ -33,7 +41,7 @@ const Advisor = () => {
             <Grid item xs={12} md={12} lg={12}>
               <TextField
                 value={password}
-                onChange={(e) => setPassword(e.target.value)}
+                onChange={handlePasswordChange}
                 label={language.password}
                 fullWidth
                 type="password"