⌥G (#118)

Author: filiptronicek

package.json

@@ -24,6 +24,7 @@
         "plasmo": "^0.84.2",
         "react": "^18.2.0",
         "react-dom": "^18.2.0",
+        "react-hotkeys-hook": "^4.5.0",
         "validator": "^13.11.0",
         "webext-additional-permissions": "^2.4.0",
         "webext-content-scripts": "^2.5.5",

pnpm-lock.yaml

@@ -1,5 +1,6 @@
 import classNames from "classnames";
-import React, { useEffect, useMemo, useRef, useState } from "react";
+import { useEffect, useMemo, useRef, useState } from "react";
+import { useHotkeys } from "react-hotkeys-hook";
 import Logo from "react:./logo-mark.svg";
 
 import { useStorage } from "@plasmohq/storage/hook";
@@ -21,6 +22,8 @@ export const GitpodButton = ({ application, additionalClassNames }: GitpodButton
     const [showDropdown, setShowDropdown] = useState(false);
     const [currentHref, setCurrentHref] = useState(window.location.href);
 
+    const linkRef = useRef<HTMLAnchorElement | null>(null);
+
     useEffect(() => {
         const handleUrlChange = () => {
             setCurrentHref(window.location.href);
@@ -72,6 +75,10 @@ export const GitpodButton = ({ application, additionalClassNames }: GitpodButton
         }
     }, [showDropdown]);
 
+    const target = openInNewTab ? "_blank" : "_self";
+
+    useHotkeys("alt+g", () => linkRef.current?.click(), [linkRef.current]);
+
     return (
         <div
             id="gitpod-btn-nav"
@@ -82,8 +89,9 @@ export const GitpodButton = ({ application, additionalClassNames }: GitpodButton
                 <a
                     className={classNames("button-part", disableAutostart ? "action-no-options" : "action")}
                     href={actions[0].href}
-                    target={openInNewTab ? "_blank" : "_self"}
+                    target={target}
                     rel="noreferrer"
+                    ref={linkRef}
                 >
                     <span className={classNames("action-label")}>
                         <Logo className={classNames("action-logo")} width={14} height={14} />
@@ -121,7 +129,7 @@ export const GitpodButton = ({ application, additionalClassNames }: GitpodButton
                             ref={action === actions[1] ? firstActionRef : null}
                             className={classNames("drop-down-action", "button-part")}
                             href={action.href}
-                            target={openInNewTab ? "_blank" : "_self"}
+                            target={target}
                             rel="noreferrer"
                         >
                             <span className={classNames("drop-down-label")}>{action.label}</span>