Skip to content

Commit bc57c6e

Browse files
authored
Merge pull request #52 from CodeDead/feature/refactoring
Feature/refactoring
2 parents b939906 + d9860d8 commit bc57c6e

File tree

18 files changed

+483
-622
lines changed

18 files changed

+483
-622
lines changed

package.json

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -38,7 +38,7 @@
3838
"@emotion/react": "^11.4.1",
3939
"@emotion/styled": "^11.3.0",
4040
"@mui/icons-material": "^5.0.1",
41-
"@mui/material": "^5.0.1",
41+
"@mui/material": "^5.0.2",
4242
"crc": "^3.8.0",
4343
"cross-env": "^7.0.3",
4444
"electron-is-dev": "^2.0.0",
@@ -72,14 +72,14 @@
7272
]
7373
},
7474
"devDependencies": {
75-
"concurrently": "^6.2.1",
75+
"concurrently": "^6.2.2",
7676
"electron": "^15.0.0",
7777
"electron-builder": "^22.11.7",
7878
"eslint": "^7.32.0",
7979
"eslint-config-airbnb": "^18.2.1",
8080
"eslint-plugin-import": "^2.24.2",
8181
"eslint-plugin-jsx-a11y": "^6.4.1",
82-
"eslint-plugin-react": "^7.26.0",
82+
"eslint-plugin-react": "^7.26.1",
8383
"eslint-plugin-react-hooks": "^4.2.0",
8484
"wait-on": "^6.0.0"
8585
}

src/components/BackButton/index.jsx

Lines changed: 8 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,24 @@
11
import React from 'react';
22
import Button from '@mui/material/Button';
33
import ArrowLeftIcon from '@mui/icons-material/KeyboardArrowLeft';
4+
import { useHistory } from 'react-router-dom';
45

5-
const BackButton = ({ goBack }) => {
6+
const BackButton = () => {
7+
const history = useHistory();
68
/**
79
* Call the goBack event
810
* @param e The event argument
911
*/
1012
const back = (e) => {
1113
if (e) e.preventDefault();
12-
if (goBack) goBack();
14+
history.goBack();
1315
};
1416

1517
return (
16-
<Button color="primary" onClick={back}>
18+
<Button
19+
onClick={back}
20+
size="small"
21+
>
1722
<ArrowLeftIcon />
1823
</Button>
1924
);
Lines changed: 45 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,45 @@
1+
import React from 'react';
2+
import TextField from '@mui/material/TextField';
3+
import CopyPasteMenu from '../CopyPasteMenu';
4+
5+
const CompareField = ({
6+
copyLabel, pasteLabel, onPaste, compareLabel, value, onChange,
7+
}) => {
8+
/**
9+
* Paste data
10+
*/
11+
const paste = () => {
12+
if (onPaste) {
13+
onPaste();
14+
}
15+
};
16+
17+
/**
18+
* Change the value
19+
* @param e The event argument
20+
*/
21+
const changeValue = (e) => {
22+
if (onChange) {
23+
onChange(e.target.value);
24+
}
25+
};
26+
27+
return (
28+
<CopyPasteMenu
29+
id={1}
30+
copyData={() => navigator.clipboard.writeText(value)}
31+
copy={copyLabel}
32+
paste={pasteLabel}
33+
pasteData={paste}
34+
>
35+
<TextField
36+
fullWidth
37+
value={value}
38+
onChange={changeValue}
39+
label={compareLabel}
40+
/>
41+
</CopyPasteMenu>
42+
);
43+
};
44+
45+
export default CompareField;

src/components/ConfirmationDialog/index.jsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -46,10 +46,10 @@ const ConfirmationDialog = ({
4646
</DialogContentText>
4747
</DialogContent>
4848
<DialogActions>
49-
<Button onClick={cancel} color="primary">
49+
<Button onClick={cancel}>
5050
{no}
5151
</Button>
52-
<Button onClick={accept} color="primary" autoFocus>
52+
<Button onClick={accept} autoFocus>
5353
{yes}
5454
</Button>
5555
</DialogActions>

src/components/DrawerBar/index.jsx

Lines changed: 41 additions & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -60,7 +60,6 @@ const DrawerBar = ({ open, onClose }) => {
6060
history.push('/about');
6161
break;
6262
default:
63-
case 0:
6463
history.push('/');
6564
break;
6665
}
@@ -71,10 +70,6 @@ const DrawerBar = ({ open, onClose }) => {
7170
anchor="left"
7271
open={open}
7372
onClose={handleDrawerClose}
74-
sx={{
75-
width: 240,
76-
flexShrink: 0,
77-
}}
7873
>
7974
<Box
8075
sx={{
@@ -92,45 +87,47 @@ const DrawerBar = ({ open, onClose }) => {
9287

9388
<Divider />
9489

95-
<CryptographyMenu
96-
handleIndexChange={handleIndexChange}
97-
selectedIndex={selectedItem}
98-
cryptography={language.cryptography}
99-
file={language.file}
100-
text={language.text}
101-
/>
102-
103-
<Divider />
104-
105-
<List>
106-
<ListItem onClick={() => handleIndexChange(3)} selected={selectedItem === 3} button>
107-
<ListItemIcon><BuildIcon color="inherit" /></ListItemIcon>
108-
<ListItemText primary={language.settings} />
109-
</ListItem>
110-
</List>
111-
112-
<Divider />
113-
114-
<List>
115-
<ListItem onClick={() => handleIndexChange(4)} button>
116-
<ListItemIcon><HelpIcon color="inherit" /></ListItemIcon>
117-
<ListItemText primary={language.help} />
118-
</ListItem>
119-
120-
<ListItem onClick={() => handleIndexChange(5)} selected={selectedItem === 5} button>
121-
<ListItemIcon><InfoIcon color="inherit" /></ListItemIcon>
122-
<ListItemText primary={language.about} />
123-
</ListItem>
124-
</List>
125-
126-
<Divider />
127-
128-
<List>
129-
<ListItem onClick={() => ipcRenderer.send('handle-close')} button>
130-
<ListItemIcon><CloseIcon color="inherit" /></ListItemIcon>
131-
<ListItemText primary={language.exit} />
132-
</ListItem>
133-
</List>
90+
<Box style={{ width: 240 }}>
91+
<CryptographyMenu
92+
handleIndexChange={handleIndexChange}
93+
selectedIndex={selectedItem}
94+
cryptography={language.cryptography}
95+
file={language.file}
96+
text={language.text}
97+
/>
98+
99+
<Divider />
100+
101+
<List>
102+
<ListItem onClick={() => handleIndexChange(3)} selected={selectedItem === 3} button>
103+
<ListItemIcon><BuildIcon color="inherit" /></ListItemIcon>
104+
<ListItemText primary={language.settings} />
105+
</ListItem>
106+
</List>
107+
108+
<Divider />
109+
110+
<List>
111+
<ListItem onClick={() => handleIndexChange(4)} button>
112+
<ListItemIcon><HelpIcon color="inherit" /></ListItemIcon>
113+
<ListItemText primary={language.help} />
114+
</ListItem>
115+
116+
<ListItem onClick={() => handleIndexChange(5)} selected={selectedItem === 5} button>
117+
<ListItemIcon><InfoIcon color="inherit" /></ListItemIcon>
118+
<ListItemText primary={language.about} />
119+
</ListItem>
120+
</List>
121+
122+
<Divider />
123+
124+
<List>
125+
<ListItem onClick={() => ipcRenderer.send('handle-close')} button>
126+
<ListItemIcon><CloseIcon color="inherit" /></ListItemIcon>
127+
<ListItemText primary={language.exit} />
128+
</ListItem>
129+
</List>
130+
</Box>
134131
</Drawer>
135132
);
136133
};

src/components/Hash/index.jsx

Lines changed: 20 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,15 @@
11
import React from 'react';
2-
import Paper from '@mui/material/Paper';
32
import Typography from '@mui/material/Typography';
43
import CheckIcon from '@mui/icons-material/Check';
54
import CopyIcon from '@mui/icons-material/FileCopy';
65
import { Menu, Item, useContextMenu } from 'react-contexify';
76
import 'react-contexify/dist/ReactContexify.min.css';
8-
import { useTheme } from '@mui/material/styles';
7+
import Card from '@mui/material/Card';
8+
import CardContent from '@mui/material/CardContent';
99

1010
const Hash = ({
1111
hashType, content, compareString, id, copy,
1212
}) => {
13-
const theme = useTheme();
1413
const MENU_ID = `hashMenu${id}`;
1514

1615
let compareColor = null;
@@ -38,29 +37,24 @@ const Hash = ({
3837
};
3938

4039
return (
41-
<Paper
42-
sx={{
43-
padding: theme.spacing(2),
44-
overflow: 'auto',
45-
flex: 'auto',
46-
flexDirection: 'column',
47-
}}
48-
>
49-
<Typography variant="subtitle1" color="primary" gutterBottom>
50-
{hashType}
51-
{compareIcon}
52-
</Typography>
53-
<div onContextMenu={handleContextMenu}>
54-
<span style={compareColor}>{content}</span>
55-
</div>
56-
<Menu id={`hashMenu${id}`}>
57-
<Item onClick={() => navigator.clipboard.writeText(content)}>
58-
<CopyIcon />
59-
{' '}
60-
{copy}
61-
</Item>
62-
</Menu>
63-
</Paper>
40+
<Card>
41+
<CardContent>
42+
<Typography variant="subtitle1" color="primary" gutterBottom>
43+
{hashType}
44+
{compareIcon}
45+
</Typography>
46+
<div onContextMenu={handleContextMenu}>
47+
<span style={compareColor}>{content}</span>
48+
</div>
49+
<Menu id={`hashMenu${id}`}>
50+
<Item onClick={() => navigator.clipboard.writeText(content)}>
51+
<CopyIcon />
52+
{' '}
53+
{copy}
54+
</Item>
55+
</Menu>
56+
</CardContent>
57+
</Card>
6458
);
6559
};
6660

src/components/HashList/index.jsx

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
import React from 'react';
2+
import Typography from '@mui/material/Typography';
3+
import Box from '@mui/material/Box';
4+
import GridList from '../GridList';
5+
import Hash from '../Hash';
6+
7+
const HashList = ({
8+
outputLabel, hashes, marginTop, copyLabel, compareHash,
9+
}) => (
10+
<Box style={{ marginTop }}>
11+
<Typography component="h2" variant="h5" color="primary" gutterBottom>
12+
{outputLabel}
13+
</Typography>
14+
<GridList md={12} lg={12} xs={12} spacing={2}>
15+
{hashes.map((e, i) => (
16+
<Hash
17+
id={i}
18+
key={e.hash}
19+
content={e.hash}
20+
hashType={e.type}
21+
copy={copyLabel}
22+
compareString={compareHash}
23+
/>
24+
))}
25+
</GridList>
26+
</Box>
27+
);
28+
29+
export default HashList;

src/components/LoadingBar/index.jsx

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,11 @@
11
import React from 'react';
22
import CircularProgress from '@mui/material/CircularProgress';
33

4-
const LoadingBar = () => (
4+
const LoadingBar = ({ marginTop }) => (
55
<div style={{
66
display: 'flex',
77
justifyContent: 'center',
8+
marginTop,
89
}}
910
>
1011
<CircularProgress />

src/components/PageHeader/index.jsx

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,8 +3,9 @@ import Container from '@mui/material/Container';
33
import Typography from '@mui/material/Typography';
44
import Box from '@mui/material/Box';
55
import { useTheme } from '@mui/material/styles';
6+
import BackButton from '../BackButton';
67

7-
const PageHeader = ({ title, subtitle }) => {
8+
const PageHeader = ({ title, subtitle, backButton }) => {
89
const theme = useTheme();
910

1011
return (
@@ -16,6 +17,7 @@ const PageHeader = ({ title, subtitle }) => {
1617
>
1718
<Container maxWidth="sm">
1819
<Typography variant="h4" align="center" color="textPrimary" gutterBottom>
20+
{backButton ? <BackButton /> : null}
1921
{title}
2022
</Typography>
2123
<Typography variant="h6" align="center" color="textSecondary" paragraph>

src/components/Theme/index.jsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@ const Theme = ({
1515
<Card raised={!selected}>
1616
<CardActionArea onClick={action}>
1717
<CardMedia
18-
sx={{
18+
style={{
1919
height: 60,
2020
backgroundColor: color,
2121
}}

0 commit comments

Comments
 (0)