Mutex for focus (#538)

* fix: used semaphore to block unwanted BatteryStatus behaviour Signed-off-by: alexpargon <alexpargon@gmail.com> * chore: upped RC version to 3 Signed-off-by: alexpargon <alexpargon@gmail.com> * fix: solved props issues in ts compilation check Signed-off-by: alexpargon <alexpargon@gmail.com> --------- Signed-off-by: alexpargon <alexpargon@gmail.com> Co-authored-by: alexpargon <alexpargon@gmail.com>
Dygmalab · Oct 20, 2023 · 716b1be · 716b1be
1 parent 61e38a4
commit 716b1be
Show file tree

Hide file tree

Showing 12 changed files with 145 additions and 84 deletions.
diff --git a/package.json b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "Bazecor",
   "productName": "Bazecor",
-  "version": "1.3.6-rc.2",
+  "version": "1.3.6-rc.3",
   "description": "Bazecor desktop app",
   "private": true,
   "repository": {

diff --git a/src/renderer/App.jsx b/src/renderer/App.jsx
@@ -84,6 +84,7 @@ class App extends React.Component {
       pages: {},
       contextBar: false,
       fwUpdate: false,
+      loading: false,
       allowBeta,
     };
     localStorage.clear();
@@ -253,6 +254,12 @@ class App extends React.Component {
     });
   };
 
+  setLoading = loading => {
+    this.setState({
+      loading,
+    });
+  };
+
   async updateStorageSchema() {
     // Update stored settings schema
     console.log("Retrieving settings: ", store.get("settings"));
@@ -291,12 +298,20 @@ class App extends React.Component {
   }
 
   render() {
-    const { connected, pages, contextBar, darkMode, fwUpdate, allowBeta, device } = this.state;
+    const { connected, pages, contextBar, darkMode, fwUpdate, allowBeta, device, loading } = this.state;
 
     return (
       <ThemeProvider theme={darkMode ? Dark : Light}>
         <GlobalStyles />
-        <Header connected={connected} pages={pages} flashing={!connected} fwUpdate={fwUpdate} allowBeta={allowBeta} />
+        <Header
+          connected={connected}
+          pages={pages}
+          flashing={!connected}
+          fwUpdate={fwUpdate}
+          allowBeta={allowBeta}
+          loading={loading}
+          setLoading={this.setLoading}
+        />
         <div className="main-container">
           <Routes>
             <Route exact path="/" element={<Navigate to="/keyboard-select" />} />
@@ -322,6 +337,8 @@ class App extends React.Component {
                   titleElement={() => document.querySelector("#page-title")}
                   device={device}
                   darkMode={darkMode}
+                  loading={loading}
+                  setLoading={this.setLoading}
                 />
               }
             />
@@ -337,6 +354,8 @@ class App extends React.Component {
                   titleElement={() => document.querySelector("#page-title")}
                   appBarElement={() => document.querySelector("#appbar")}
                   darkMode={darkMode}
+                  loading={loading}
+                  setLoading={this.setLoading}
                 />
               }
             />
@@ -350,6 +369,8 @@ class App extends React.Component {
                   cancelContext={this.cancelContext}
                   inContext={contextBar}
                   titleElement={() => document.querySelector("#page-title")}
+                  loading={loading}
+                  setLoading={this.setLoading}
                 />
               }
             />
@@ -363,6 +384,8 @@ class App extends React.Component {
                   cancelContext={this.cancelContext}
                   inContext={contextBar}
                   titleElement={() => document.querySelector("#page-title")}
+                  loading={loading}
+                  setLoading={this.setLoading}
                 />
               }
             />
@@ -395,6 +418,8 @@ class App extends React.Component {
                   updateAllowBeta={this.updateAllowBeta}
                   allowBeta={allowBeta}
                   inContext={contextBar}
+                  loading={loading}
+                  setLoading={this.setLoading}
                 />
               }
             />
@@ -412,6 +437,8 @@ class App extends React.Component {
                   updateAllowBeta={this.updateAllowBeta}
                   allowBeta={allowBeta}
                   inContext={contextBar}
+                  loading={loading}
+                  setLoading={this.setLoading}
                 />
               }
             />

diff --git a/src/renderer/modules/Battery/BatteryStatus.tsx b/src/renderer/modules/Battery/BatteryStatus.tsx
@@ -141,31 +141,6 @@ const BatteryStatus = ({ disable }: BatteryStatusProps) => {
     // console.log("R Status focus: ", rightStatus);
   }, []);
 
-  // async function getBatteryStatus() {
-  //   const focus = new Focus();
-  //   const left = await focus.command("wireless.battery.left.level");
-  //   const right = await focus.command("wireless.battery.right.level");
-  //   const leftStatus = await focus.command("wireless.battery.left.status");
-  //   const rightStatus = await focus.command("wireless.battery.right.status");
-  //   const savingMode = await focus.command("wireless.battery.savingMode");
-  //   setbLeft(parseInt(left, 10));
-  //   setbRight(parseInt(right, 10));
-  //   setsLeft(leftStatus.includes("0x") ? 255 : parseInt(leftStatus, 10));
-  //   setsRight(rightStatus.includes("0x") ? 255 : parseInt(rightStatus, 10));
-  //   setIsSavingMode(parseInt(savingMode, 10) > 0);
-
-  //   console.log("L Status internal: ", sLeft);
-  //   console.log("L Status focus: ", leftStatus);
-  //   console.log("L Level internal: ", bLeft);
-
-  //   console.log("R Status: ", sRight);
-  //   console.log("R Status focus: ", rightStatus);
-  // }
-
-  if (!disable) {
-    getBatteryStatus();
-  }
-
   useEffect(() => {
     if (!disable) {
       intervalIdRef.current = setInterval(() => {

diff --git a/src/renderer/modules/NavigationMenu/NavigationMenu.tsx b/src/renderer/modules/NavigationMenu/NavigationMenu.tsx
@@ -102,13 +102,14 @@ interface NavigationMenuProps {
   pages: Pages;
   fwUpdate: boolean;
   allowBeta: boolean;
+  loading: boolean;
 }
 
 interface Device {
   vendor: any;
   product: any;
-  keyboardType: any;
-  displayName: any;
+  keyboardType: string;
+  displayName: string;
   urls: any;
 }
 
@@ -120,7 +121,7 @@ function NavigationMenu(props: NavigationMenuProps): React.JSX.Element {
   const [virtual, setVirtual] = useState(false);
   const location = useLocation();
   const currentPage = location.pathname;
-  const { connected, pages, fwUpdate, flashing, allowBeta } = props;
+  const { connected, pages, fwUpdate, flashing, allowBeta, loading } = props;
 
   const getGitHubFW = async (product: any) => {
     const releases: any[] = [];
@@ -258,7 +259,7 @@ function NavigationMenu(props: NavigationMenuProps): React.JSX.Element {
                     disabled={fwUpdate}
                   />
                 </Link>
-                <BatteryStatus disable={fwUpdate || virtual} />
+                <BatteryStatus disable={fwUpdate || virtual || loading} />
               </>
             ) : (
               <></>

diff --git a/src/renderer/modules/NavigationMenu/NavigationMenuWrapper.js b/src/renderer/modules/NavigationMenu/NavigationMenuWrapper.js
@@ -20,16 +20,28 @@ import PropTypes from "prop-types";
 import NavigationMenu from "./NavigationMenu";
 
 function Header(props) {
-  const { connected, pages, flashing, fwUpdate, allowBeta } = props;
+  const { connected, pages, flashing, fwUpdate, allowBeta, loading, setLoading } = props;
 
-  return <NavigationMenu connected={connected} pages={pages} flashing={flashing} fwUpdate={fwUpdate} allowBeta={allowBeta} />;
+  return (
+    <NavigationMenu
+      connected={connected}
+      pages={pages}
+      flashing={flashing}
+      fwUpdate={fwUpdate}
+      allowBeta={allowBeta}
+      loading={loading}
+      setLoading={setLoading}
+    />
+  );
 }
 Header.propTypes = {
   connected: PropTypes.bool.isRequired,
   pages: PropTypes.object.isRequired,
   flashing: PropTypes.bool.isRequired,
   fwUpdate: PropTypes.bool.isRequired,
   allowBeta: PropTypes.any.isRequired,
+  loading: PropTypes.bool.isRequired,
+  setLoading: PropTypes.func.isRequired,
 };
 
 export default Header;
diff --git a/src/renderer/types/wireless.ts b/src/renderer/types/wireless.ts
@@ -9,6 +9,8 @@ export interface WirelessPropsInterface {
   updateAllowBeta: () => void;
   allowBeta: boolean;
   inContext: boolean;
+  loading: boolean;
+  setLoading: (loading: boolean) => unknown;
 }
 
 export interface WirelessInterface {

diff --git a/src/renderer/views/LayoutEditor.js b/src/renderer/views/LayoutEditor.js
@@ -93,8 +93,8 @@ const Styles = Styled.div`
   border-radius: 6px;
   button.btn {
     background: transparent;
-  } 
-  button.btn + button.btn {   
+  }
+  button.btn + button.btn {
     margin-left: 4px;
   }
 }
@@ -228,7 +228,7 @@ const Styles = Styled.div`
     filter: blur(18px);
     opacity: 0.4;
   }
-  &.keyOnFocus { 
+  &.keyOnFocus {
     .baseShape {
       filter: drop-shadow(0px 4px 0px ${({ theme }) => theme.styles.raiseKeyboard.keyShadow});
     }
@@ -267,7 +267,7 @@ const Styles = Styled.div`
     margin: 0;
     margin-left: 6px;
     margin-right: -1px;
-    &.extraBottom { 
+    &.extraBottom {
       margin-left: 1px;
       li {
         margin-left: 1px;
@@ -277,7 +277,7 @@ const Styles = Styled.div`
     li {
       padding: 0px 3px;
       border-radius: 3px;
-      
+
       display: inline-block;
       margin: 1px;
 
@@ -590,6 +590,8 @@ class LayoutEditor extends React.Component {
   }
 
   scanKeyboard = async lang => {
+    const { setLoading, onDisconnect } = this.props;
+    setLoading(true);
     const focus = new Focus();
     try {
       /**
@@ -606,7 +608,7 @@ class LayoutEditor extends React.Component {
       }
 
       let defLayer = await focus.command("settings.defaultLayer");
-      defLayer = parseInt(defLayer) || 0;
+      defLayer = parseInt(defLayer, 10) || 0;
 
       const keymap = await focus.command("keymap");
       const onlyC = await focus.command("keymap.onlyCustom");
@@ -680,10 +682,12 @@ class LayoutEditor extends React.Component {
           }
         }
       }
+      setLoading(false);
     } catch (e) {
       console.error(e);
       toast.error(e);
-      this.props.onDisconnect();
+      setLoading(false);
+      onDisconnect();
     }
   };
 
@@ -886,6 +890,8 @@ class LayoutEditor extends React.Component {
   };
 
   onApply = async () => {
+    const { setLoading } = this.props;
+    setLoading(true);
     this.setState({ saving: true });
     const focus = new Focus();
     await focus.command("keymap", this.state.keymap);
@@ -903,6 +909,7 @@ class LayoutEditor extends React.Component {
     console.log("Changes saved.");
     const commands = await this.bkp.Commands();
     const backup = await this.bkp.DoBackup(commands, this.state.neurons[this.state.neuronID].id);
+    setLoading(false);
     this.bkp.SaveBackup(backup);
     this.props.cancelContext();
   };

diff --git a/src/renderer/views/MacroEditor.jsx b/src/renderer/views/MacroEditor.jsx
@@ -301,6 +301,8 @@ class MacroEditor extends React.Component {
 
   async writeMacros() {
     const { macros, neurons, neuronID, keymap } = this.state;
+    const { setLoading } = this.props;
+    setLoading(true);
     const focus = new Focus();
     const newMacros = macros;
     this.setState({
@@ -321,8 +323,10 @@ class MacroEditor extends React.Component {
         autoClose: 2000,
         icon: "",
       });
+      setLoading(false);
     } catch (error) {
       toast.error(<ToastMessage title={error} icon={<IconFloppyDisk />} />, { icon: "" });
+      setLoading(false);
     }
   }
 
@@ -466,7 +470,8 @@ class MacroEditor extends React.Component {
   }
 
   async loadMacros() {
-    const { onDisconnect } = this.props;
+    const { onDisconnect, setLoading } = this.props;
+    setLoading(true);
     const focus = new Focus();
     try {
       /**
@@ -507,9 +512,11 @@ class MacroEditor extends React.Component {
         totalMemory: tMem,
         loading: false,
       });
+      setLoading(false);
       return true;
     } catch (e) {
       toast.error(<ToastMessage title={e} icon={<IconFloppyDisk />} />, { icon: "" });
+      setLoading(false);
       onDisconnect();
       return false;
     }