Merge pull request #41 from unelmacoin/up-58-expand-and-shrink-on-dou…

…ble-click up-58 expand and shrink on double click added
unelmacoin · Sep 28, 2023 · 97409be · 97409be
2 parents b064375 + f895bcb
commit 97409be
Show file tree

Hide file tree

Showing 2 changed files with 29 additions and 18 deletions.
diff --git a/src/renderer/components/Layout/layout.css b/src/renderer/components/Layout/layout.css
@@ -5,12 +5,11 @@
     90deg,
     var(--root-background) 0%,
     var(--root-background-grad-1) 52%,
-    var( --root-background-grad-2) 100%
+    var(--root-background-grad-2) 100%
   );
   border-radius: 7px;
   padding: 40px 10px 10px;
   -webkit-app-region: drag;
   -webkit-user-select: none;
   user-select: none;
-  transition: ease all 2s;
 }
diff --git a/src/renderer/components/TopBar.jsx b/src/renderer/components/TopBar.jsx
@@ -2,21 +2,26 @@ import React, { useEffect, useState } from "react";
 import { MdOutlineMinimize } from "react-icons/md";
 import { FiMinimize2, FiMaximize2 } from "react-icons/fi";
 import { IoClose } from "react-icons/io5";
-import { CLOSE_WINDOW, IS_MAXIMIZED, MAXIMIZE, MINIMIZE, UN_MAXIMIZE } from "../../constants/global/channels";
+import {
+  CLOSE_WINDOW,
+  IS_MAXIMIZED,
+  MAXIMIZE,
+  MINIMIZE,
+  UN_MAXIMIZE,
+} from "../../constants/global/channels";
 
-const TopBar = ({menu , setMenu}) => {
+const TopBar = ({ menu, setMenu }) => {
   const [maximize, setMaximize] = useState(true);
   const handleMaximize = () => {
     window.api.send(MAXIMIZE, window.id);
-     setMaximize(true);
+    setMaximize(true);
   };
   const handleUnMaximize = () => {
     window.api.send(UN_MAXIMIZE, window.id);
-     setMaximize(false);
+    setMaximize(false);
   };
   const handleMinimize = () => {
     window.api.send(MINIMIZE, window.id);
-
   };
   const handleClose = () => {
     window.api.send(CLOSE_WINDOW, window.id);
@@ -26,21 +31,28 @@ const TopBar = ({menu , setMenu}) => {
       setMaximize(isMaximized);
     });
   }, [maximize]);
-  const handle_CloseThreeButtonMenu =() =>{
-    if (menu === true)  setMenu(false)
-   
-  }
+  const handle_CloseThreeButtonMenu = () => {
+    if (menu === true) setMenu(false);
+  };
+
   return (
-    <div className="top-bar" onClick={handle_CloseThreeButtonMenu}>
+    <div
+      className="top-bar"
+      onClick={handle_CloseThreeButtonMenu}
+      onDoubleClick={maximize ? handleUnMaximize : handleMaximize}
+    >
       <button id="window-controls-minimize" onClick={handleMinimize}>
         <MdOutlineMinimize fontSize="8px" />
       </button>
-      {!maximize ?<button id="window-controls-maximize" onClick={handleMaximize}>
-        <FiMaximize2 fontSize="8px" />
-      </button>
-      :<button id="window-controls-unmaximize" onClick={handleUnMaximize}>
-        <FiMinimize2 fontSize="8px" />
-      </button>}
+      {!maximize ? (
+        <button id="window-controls-maximize" onClick={handleMaximize}>
+          <FiMaximize2 fontSize="8px" />
+        </button>
+      ) : (
+        <button id="window-controls-unmaximize" onClick={handleUnMaximize}>
+          <FiMinimize2 fontSize="8px" />
+        </button>
+      )}
       <button id="window-controls-close" onClick={handleClose}>
         <IoClose fontSize="8px" />
       </button>