Merge pull request #9 from CodeDead/feature/extra-features

feat: added theme toggle button, dependency upgrades, added ability t…

Author: CodeDead

README.md

@@ -1,11 +1,12 @@
 # Advanced PortChecker
 
-![Advanced PortChecker](https://i.imgur.com/yoWDImn.png)
+![Advanced PortChecker](https://i.imgur.com/vdt1sXZ.png)
 
 ![GitHub](https://img.shields.io/badge/language-JavaScript+Rust-green)
 ![GitHub](https://img.shields.io/github/license/CodeDead/Advanced-PortChecker)
 ![GitHub release (latest by date)](https://img.shields.io/github/v/release/CodeDead/Advanced-PortChecker)
 [![Test](https://github.com/CodeDead/Advanced-PortChecker/actions/workflows/test.yml/badge.svg)](https://github.com/CodeDead/Advanced-PortChecker/actions/workflows/test.yml)
+[![Release](https://github.com/CodeDead/Advanced-PortChecker/actions/workflows/release.yml/badge.svg)](https://github.com/CodeDead/Advanced-PortChecker/actions/workflows/release.yml)
 
 Advanced PortChecker is a free and open-source application that can help you check if ports are open or closed on a certain host. You can check multiple ports at once and export the results in plain text, CSV or JSON format!
 

src-tauri/Cargo.lock

@@ -1,7 +1,7 @@
 [package]
 name = "advanced-portchecker"
 version = "2.0.0"
-description = "A lightweight TCP port checker with an intuitive UI."
+description = "A lightweight TCP/IP port scanner with an intuitive UI."
 authors = ["CodeDead <admin@codedead.com>"]
 license = "GPL-3.0-only"
 repository = "https://github.com/CodeDead/Advanced-PortChecker"

src-tauri/Cargo.toml

@@ -37,7 +37,7 @@
  "icons/icon.ico"
  ],
  "identifier": "com.codedead.advancedportchecker",
- "longDescription": "Advanced PortChecker is a TCP port checker that allows you to check if a port is open or not",
+ "longDescription": "Advanced PortChecker is a TCP/IP port scanner that allows you to check if a port is open or not",
  "macOS": {
  "entitlements": null,
  "exceptionDomain": "",
@@ -46,7 +46,7 @@
  "signingIdentity": null
  },
  "resources": [],
- "shortDescription": "A TCP Port Checker",
+ "shortDescription": "A TCP/IP Port scanner",
  "targets": "all",
  "windows": {
  "certificateThumbprint": null,

src-tauri/tauri.conf.json

@@ -14,14 +14,16 @@ import ListItem from '@mui/material/ListItem';
 import ListItemButton from '@mui/material/ListItemButton';
 import ListItemIcon from '@mui/material/ListItemIcon';
 import ListItemText from '@mui/material/ListItemText';
+import Brightness5Icon from '@mui/icons-material/Brightness5';
+import Brightness7Icon from '@mui/icons-material/Brightness7';
 import TravelExploreIcon from '@mui/icons-material/TravelExplore';
 import SettingsIcon from '@mui/icons-material/Settings';
 import AttachMoneyIcon from '@mui/icons-material/AttachMoney';
 import InfoIcon from '@mui/icons-material/Info';
 import { useNavigate } from 'react-router-dom';
 import DrawerHeader from '../DrawerHeader';
 import { MainContext } from '../../contexts/MainContextProvider';
-import { openWebSite } from '../../reducers/MainReducer/Actions';
+import { openWebSite, setThemeType } from '../../reducers/MainReducer/Actions';
 
 const drawerWidth = 240;
 
@@ -82,7 +84,8 @@ const Drawer = styled(MuiDrawer, { shouldForwardProp: (prop) => prop !== 'open'
 );
 
 const TopBar = () => {
- const [state] = useContext(MainContext);
+ const [state, d1] = useContext(MainContext);
+ const { themeType, themeToggle } = state;
 
  const [open, setOpen] = useState(false);
 
@@ -132,6 +135,13 @@ const TopBar = () => {
  handleDrawerClose();
  };
 
+ /**
+ * Change the theme style
+ */
+ const changeThemeStyle = () => {
+ d1(setThemeType(themeType === 'dark' ? 'light' : 'dark'));
+ };
+
  return (
  <>
  <AppBar
@@ -161,6 +171,16 @@ const TopBar = () => {
  >
  {language.applicationName}
  </Typography>
+ <div style={{ flexGrow: 1 }} />
+ {themeToggle ? (
+ <IconButton
+ aria-label={language.theme}
+ color="inherit"
+ onClick={changeThemeStyle}
+ >
+ {themeType === 'dark' ? <Brightness5Icon /> : <Brightness7Icon />}
+ </IconButton>
+ ) : null}
  </Toolbar>
  </AppBar>
  <Drawer variant="permanent" open={open}>

src/components/TopBar/index.jsx

@@ -16,6 +16,7 @@ const threads = localStorage.threads ? parseFloat(localStorage.threads) : 1;
 const timeout = localStorage.timeout ? parseFloat(localStorage.timeout) : 250;
 const noClosed = localStorage.noClosed ? (localStorage.noClosed === 'true') : false;
 const sort = localStorage.sort ? (localStorage.sort === 'true') : true;
+const themeToggle = localStorage.themeToggle ? (localStorage.themeToggle === 'true') : true;
 
 const initState = {
  autoUpdate,
@@ -44,6 +45,7 @@ const initState = {
  noClosed,
  sort,
  scanResults: null,
+ themeToggle,
 };
 
 export const MainContext = createContext(initState);

src/contexts/MainContextProvider/index.jsx

@@ -80,5 +80,6 @@
  "exportType": "Export type",
  "export": "Export",
  "exportSuccessful": "Export successful",
- "runningLatestVersion": "You are running the latest version."
+ "runningLatestVersion": "You are running the latest version.",
+ "themeToggleInTopBar": "Toggle theme in top bar"
 }

src/languages/en_us.json

@@ -80,5 +80,6 @@
  "exportType": "Tipo de exportación",
  "export": "Exportar",
  "exportSuccessful": "Exportación exitosa",
- "runningLatestVersion": "Estás ejecutando la última versión."
+ "runningLatestVersion": "Estás ejecutando la última versión.",
+ "themeToggleInTopBar": "Alternar tema en la barra superior"
 }

src/languages/es_es.json

@@ -80,5 +80,6 @@
  "exportType": "Type d'exportation",
  "export": "Exporter",
  "exportSuccessful": "Exportation réussie",
- "runningLatestVersion": "Vous utilisez la dernière version."
+ "runningLatestVersion": "Vous utilisez la dernière version.",
+ "themeToggleInTopBar": "Basculer le thème dans la barre supérieure"
 }

src/languages/fr_fr.json

@@ -80,5 +80,6 @@
  "exportType": "Export type",
  "export": "Exporteren",
  "exportSuccessful": "Exporteren succesvol",
- "runningLatestVersion": "U gebruikt de laatste versie."
+ "runningLatestVersion": "U gebruikt de laatste versie.",
+ "themeToggleInTopBar": "Thema toggle in de bovenste balk"
 }