improvements

JustJoostNL · Nov 15, 2023 · e9f2165 · e9f2165
1 parent 6543db7
commit e9f2165
Show file tree

Hide file tree

Showing 13 changed files with 123 additions and 161 deletions.
diff --git a/.github/workflows/main.yml b/.github/workflows/main.yml
@@ -4,6 +4,7 @@ on:
   push:
     branches:
       - master
+      - rebuild
 
 jobs:
   release:
@@ -49,4 +50,4 @@ jobs:
             out/linux-unpacked
             out/*.dmg
             out/*.AppImage
-            out/*.exe
+            out/*.exe
diff --git a/.gitignore b/.gitignore
@@ -7,6 +7,3 @@ output/*
 dist/*
 release/*
 dist-electron/*
-
-.prettierrc
-.prettierrc.json
diff --git a/.npmrc b/.npmrc
diff --git a/.prettierrc b/.prettierrc
@@ -0,0 +1,3 @@
+{
+  "endOfLine": "auto"
+}
diff --git a/...components/quick-access-buttons/index.tsx → ...er/components/home/QuickAccessButtons.tsx b/...components/quick-access-buttons/index.tsx → ...er/components/home/QuickAccessButtons.tsx
@@ -3,46 +3,45 @@ import OpenInNewIcon from "@mui/icons-material/OpenInNew";
 import GetAppIcon from "@mui/icons-material/GetApp";
 import DescriptionIcon from "@mui/icons-material/Description";
 import log from "electron-log/renderer";
-import React, { useState } from "react";
+import React, { useCallback, useState } from "react";
 import KeyboardArrowDownIcon from "@mui/icons-material/KeyboardArrowDown";
 import MenuItem from "@mui/material/MenuItem";
 import Typography from "@mui/material/Typography";
 import Menu from "@mui/material/Menu";
 import { enqueueSnackbar } from "notistack";
-
 import { font } from "../..";
 
 export function QuickAccessButtons() {
   const [anchorEl, setAnchorEl] = useState<null | HTMLElement>(null);
-
   const open = Boolean(anchorEl);
-  const handleClick = (event: React.MouseEvent<HTMLElement>) => {
+
+  const handleClick = useCallback((event: React.MouseEvent<HTMLElement>) => {
     setAnchorEl(event.currentTarget);
-  };
-  const handleClose = () => {
+  }, []);
+  const handleClose = useCallback(() => {
     setAnchorEl(null);
-  };
+  }, []);
 
-  const handleOpenConfig = () => {
+  const handleOpenConfig = useCallback(() => {
     log.info("Opening config file...");
     window.f1mvli.config.open();
-  };
-  const handleCheckForUpdates = async () => {
+  }, []);
+  const handleCheckForUpdates = useCallback(async () => {
     await window.f1mvli.updater.checkForUpdates();
     const updateInfo = await window.f1mvli.updater.getUpdateAvailable();
     if (updateInfo.updateAvailable) {
       enqueueSnackbar("Update available! Downloading...", { variant: "info" });
     } else {
       enqueueSnackbar("No update available.", { variant: "success" });
     }
-  };
-  const handleOpenLogFile = () => {
+  }, []);
+  const handleOpenLogFile = useCallback(() => {
     log.info("Opening log file...");
     window.f1mvli.logger.openLogFile();
-  };
-  const handleOpenLogViewer = () => {
+  }, []);
+  const handleOpenLogViewer = useCallback(() => {
     window.location.hash = "#/log-viewer";
-  };
+  }, []);
 
   const menuItemStyle = {
     fontSize: "1.0rem",
@@ -63,6 +62,7 @@ export function QuickAccessButtons() {
           Open Config
         </Button>
       </Tooltip>
+
       <Button
         variant="outlined"
         color="secondary"
@@ -71,6 +71,7 @@ export function QuickAccessButtons() {
       >
         Check for Updates
       </Button>
+
       <Button
         sx={{ ml: 2 }}
         startIcon={<DescriptionIcon />}
@@ -85,6 +86,7 @@ export function QuickAccessButtons() {
       >
         View Logs
       </Button>
+
       <Menu
         anchorEl={anchorEl}
         open={open}
@@ -103,6 +105,7 @@ export function QuickAccessButtons() {
             Open logs in app
           </Typography>
         </MenuItem>
+
         <MenuItem onClick={handleOpenLogFile}>
           <OpenInNewIcon
             sx={{

diff --git a/...renderer/components/simulations/index.tsx → ...nderer/components/home/SimulationMenu.tsx b/...renderer/components/simulations/index.tsx → ...nderer/components/home/SimulationMenu.tsx
@@ -1,4 +1,4 @@
-import React, { useState } from "react";
+import React, { useCallback, useState } from "react";
 import Button from "@mui/material/Button";
 import KeyboardArrowDownIcon from "@mui/icons-material/KeyboardArrowDown";
 import Menu from "@mui/material/Menu";
@@ -13,55 +13,30 @@ import TimerIcon from "@mui/icons-material/Timer";
 import FlashOff from "@mui/icons-material/FlashOff";
 import { ipcRenderer } from "electron";
 import { Tooltip } from "@mui/material";
-
 import { font } from "../..";
 
 export function SimulationMenu() {
   const [anchorEl, setAnchorEl] = useState<null | HTMLElement>(null);
   const open = Boolean(anchorEl);
-  const handleClick = (event: React.MouseEvent<HTMLElement>) => {
-    setAnchorEl(event.currentTarget);
-  };
-  const handleClose = () => {
+
+  const handleClick = useCallback(
+    (event: React.MouseEvent<HTMLElement>) => {
+      setAnchorEl(event.currentTarget);
+    },
+    [setAnchorEl],
+  );
+
+  const handleClose = useCallback(() => {
     setAnchorEl(null);
-  };
+  }, []);
 
-  const handleGreenFlag = () => {
-    ipcRenderer.send("flagSim", "Green");
-    handleClose();
-  };
-  const handleYellowFlag = () => {
-    ipcRenderer.send("flagSim", "Yellow");
-    handleClose();
-  };
-  const handleRedFlag = () => {
-    ipcRenderer.send("flagSim", "Red");
-    handleClose();
-  };
-  const handleSafetyCar = () => {
-    ipcRenderer.send("flagSim", "SC");
-    handleClose();
-  };
-  const handleVirtualSafetyCar = () => {
-    ipcRenderer.send("flagSim", "VSC");
-    handleClose();
-  };
-  const handleVirtualSafetyCarEnding = () => {
-    ipcRenderer.send("flagSim", "vscEnding");
-    handleClose();
-  };
-  const handleFastestLap = () => {
-    ipcRenderer.send("flagSim", "fastestLap");
-    handleClose();
-  };
-  const handleStaticColor = () => {
-    ipcRenderer.send("flagSim", "staticColor");
-    handleClose();
-  };
-  const handleAllOff = () => {
-    ipcRenderer.send("flagSim", "alloff");
-    handleClose();
-  };
+  const handleOnSimulateEvent = useCallback(
+    (event: string, arg: string) => {
+      ipcRenderer.send(event, arg);
+      handleClose();
+    },
+    [handleClose],
+  );
 
   const menuItemStyle = {
     fontSize: "1.0rem",
@@ -83,6 +58,7 @@ export function SimulationMenu() {
       >
         Simulate Event
       </Button>
+
       <Menu
         id="basic-menu"
         anchorEl={anchorEl}
@@ -92,7 +68,7 @@ export function SimulationMenu() {
           "aria-labelledby": "basic-button",
         }}
       >
-        <MenuItem onClick={handleGreenFlag}>
+        <MenuItem onClick={() => handleOnSimulateEvent("flagSim", "Green")}>
           <FlagIcon
             sx={{
               mr: 2,
@@ -103,7 +79,8 @@ export function SimulationMenu() {
             Green Flag
           </Typography>
         </MenuItem>
-        <MenuItem onClick={handleYellowFlag}>
+
+        <MenuItem onClick={() => handleOnSimulateEvent("flagSim", "Yellow")}>
           <FlagIcon
             sx={{
               mr: 2,
@@ -114,7 +91,8 @@ export function SimulationMenu() {
             Yellow Flag
           </Typography>
         </MenuItem>
-        <MenuItem onClick={handleRedFlag}>
+
+        <MenuItem onClick={() => handleOnSimulateEvent("flagSim", "Red")}>
           <FlagIcon
             sx={{
               mr: 2,
@@ -125,7 +103,8 @@ export function SimulationMenu() {
             Red Flag
           </Typography>
         </MenuItem>
-        <MenuItem onClick={handleSafetyCar}>
+
+        <MenuItem onClick={() => handleOnSimulateEvent("flagSim", "SC")}>
           <MinorCrashIcon
             sx={{
               mr: 2,
@@ -136,7 +115,8 @@ export function SimulationMenu() {
             Safety Car
           </Typography>
         </MenuItem>
-        <MenuItem onClick={handleVirtualSafetyCar}>
+
+        <MenuItem onClick={() => handleOnSimulateEvent("flagSim", "VSC")}>
           <DirectionsCar
             sx={{
               mr: 2,
@@ -147,7 +127,8 @@ export function SimulationMenu() {
             Virtual Safety Car
           </Typography>
         </MenuItem>
-        <MenuItem onClick={handleVirtualSafetyCarEnding}>
+
+        <MenuItem onClick={() => handleOnSimulateEvent("flagSim", "vscEnding")}>
           <NoCrash
             sx={{
               mr: 2,
@@ -158,8 +139,11 @@ export function SimulationMenu() {
             Virtual Safety Car Ending
           </Typography>
         </MenuItem>
+
         <Tooltip title="This will only work when you have a fastest lap effect created and enabled.">
-          <MenuItem onClick={handleFastestLap}>
+          <MenuItem
+            onClick={() => handleOnSimulateEvent("flagSim", "fastestLap")}
+          >
             <TimerIcon
               sx={{
                 mr: 2,
@@ -171,7 +155,9 @@ export function SimulationMenu() {
             </Typography>
           </MenuItem>
         </Tooltip>
-        <MenuItem onClick={handleStaticColor}>
+        <MenuItem
+          onClick={() => handleOnSimulateEvent("flagSim", "staticColor")}
+        >
           <SquareIcon
             sx={{
               mr: 2,
@@ -182,7 +168,8 @@ export function SimulationMenu() {
             Static Color
           </Typography>
         </MenuItem>
-        <MenuItem onClick={handleAllOff}>
+
+        <MenuItem onClick={() => handleOnSimulateEvent("flagSim", "alloff")}>
           <FlashOff
             sx={{
               mr: 2,

diff --git a/...r/components/integration-states/index.tsx → ...s/integrations/IntegrationStatesTable.tsx b/...r/components/integration-states/index.tsx → ...s/integrations/IntegrationStatesTable.tsx
@@ -60,7 +60,6 @@ export function IntegrationStatesTable() {
             .map((integrationState: IntegrationState) => (
               <TableRow key={integrationState.name}>
                 <TableCell>
-                  {/*@ts-ignore*/}
                   {integrationStateMap[integrationState.name]}
                 </TableCell>
                 <TableCell sx={{ alignItems: "center" }}>

diff --git a/.../components/integration-states/status.css → ...nderer/components/integrations/status.css b/.../components/integration-states/status.css → ...nderer/components/integrations/status.css
diff --git a/...er/components/integration-states/types.ts → ...renderer/components/integrations/types.ts b/...er/components/integration-states/types.ts → ...renderer/components/integrations/types.ts
diff --git a/src/renderer/components/navbar/index.tsx → src/renderer/components/layouts/Navbar.tsx b/src/renderer/components/navbar/index.tsx → src/renderer/components/layouts/Navbar.tsx
@@ -1,29 +1,21 @@
-import React from "react";
+import React, { useCallback } from "react";
 import { AppBar, Toolbar, Typography, IconButton } from "@mui/material";
 import ArrowBackIcon from "@mui/icons-material/ArrowBack";
-import { ThreeDotMenu } from "./menu";
+import { ThreeDotMenu } from "./NavbarMenu";
 
 interface NavBarProps {
-  showBackButton: boolean;
-  backButtonLocationHash?: string;
+  hideBackButton?: boolean;
 }
 
-export function Navbar({
-  showBackButton,
-  backButtonLocationHash,
-}: NavBarProps) {
-  const handleBackButton = () => {
-    if (backButtonLocationHash) {
-      window.location.hash = backButtonLocationHash;
-    } else {
-      window.location.hash = "/home";
-    }
-  };
+export function Navbar({ hideBackButton = false }: NavBarProps) {
+  const handleBackButton = useCallback(() => {
+    window.history.back();
+  }, []);
 
   return (
     <AppBar position="fixed">
       <Toolbar sx={{ display: "flex", justifyContent: "space-between" }}>
-        {showBackButton && (
+        {!hideBackButton && (
           <IconButton
             edge="start"
             color="inherit"