From 96dc2e12d030ac6d725bdfc58f1c47d35aae67a8 Mon Sep 17 00:00:00 2001
From: Nuckyz <61953774+Nuckyz@users.noreply.github.com>
Date: Tue, 4 Apr 2023 10:26:53 -0300
Subject: Fix Web & Game Activity Toggle (#777)

---
 src/plugins/gameActivityToggle/index.tsx | 45 +++++++++++++++++---------------
 src/plugins/gameActivityToggle/style.css | 16 ------------
 2 files changed, 24 insertions(+), 37 deletions(-)

(limited to 'src/plugins/gameActivityToggle')

diff --git a/src/plugins/gameActivityToggle/index.tsx b/src/plugins/gameActivityToggle/index.tsx
index 6926505..c656f3c 100644
--- a/src/plugins/gameActivityToggle/index.tsx
+++ b/src/plugins/gameActivityToggle/index.tsx
@@ -21,36 +21,39 @@ import { disableStyle, enableStyle } from "@api/Styles";
 import ErrorBoundary from "@components/ErrorBoundary";
 import { Devs } from "@utils/constants";
 import definePlugin from "@utils/types";
-import { Tooltip } from "@webpack/common";
+import { findByCodeLazy } from "@webpack";
 
 import style from "./style.css?managed";
 
 const ShowCurrentGame = getSettingStoreLazy<boolean>("status", "showCurrentGame");
+const Button = findByCodeLazy("Button.Sizes.NONE,disabled:");
+
+function makeIcon(showCurrentGame?: boolean) {
+    return function () {
+        return (
+            <svg
+                width="24"
+                height="24"
+                viewBox="0 96 960 960"
+            >
+                <path fill="currentColor" d="M182 856q-51 0-79-35.5T82 734l42-300q9-60 53.5-99T282 296h396q60 0 104.5 39t53.5 99l42 300q7 51-21 86.5T778 856q-21 0-39-7.5T706 826l-90-90H344l-90 90q-15 15-33 22.5t-39 7.5Zm498-240q17 0 28.5-11.5T720 576q0-17-11.5-28.5T680 536q-17 0-28.5 11.5T640 576q0 17 11.5 28.5T680 616Zm-80-120q17 0 28.5-11.5T640 456q0-17-11.5-28.5T600 416q-17 0-28.5 11.5T560 456q0 17 11.5 28.5T600 496ZM310 616h60v-70h70v-60h-70v-70h-60v70h-70v60h70v70Z" />
+                {!showCurrentGame && <line x1="920" y1="280" x2="40" y2="880" stroke="var(--status-danger)" stroke-width="80" />}
+            </svg>
+        );
+    };
+}
 
 function GameActivityToggleButton() {
     const showCurrentGame = ShowCurrentGame?.useSetting();
 
     return (
-        <Tooltip text="Toggle Game Activity">
-            {tooltipProps => (
-                <button
-                    {...tooltipProps}
-                    className="game-activity-toggle-btn"
-                    onClick={() => ShowCurrentGame?.updateSetting(old => !old)}
-                >
-                    <svg
-                        width="24"
-                        height="24"
-                        viewBox="0 96 960 960"
-                    >
-                        <g fill="currentColor">
-                            <path d="M182 856q-51 0-79-35.5T82 734l42-300q9-60 53.5-99T282 296h396q60 0 104.5 39t53.5 99l42 300q7 51-21 86.5T778 856q-21 0-39-7.5T706 826l-90-90H344l-90 90q-15 15-33 22.5t-39 7.5Zm498-240q17 0 28.5-11.5T720 576q0-17-11.5-28.5T680 536q-17 0-28.5 11.5T640 576q0 17 11.5 28.5T680 616Zm-80-120q17 0 28.5-11.5T640 456q0-17-11.5-28.5T600 416q-17 0-28.5 11.5T560 456q0 17 11.5 28.5T600 496ZM310 616h60v-70h70v-60h-70v-70h-60v70h-70v60h70v70Z" />
-                            {!showCurrentGame && <line x1="920" y1="280" x2="40" y2="880" stroke="var(--status-danger)" stroke-width="80" />}
-                        </g>
-                    </svg>
-                </button>
-            )}
-        </Tooltip>
+        <Button
+            tooltipText="Toggle Game Activity"
+            icon={makeIcon(showCurrentGame)}
+            role="switch"
+            aria-checked={!showCurrentGame}
+            onClick={() => ShowCurrentGame?.updateSetting(old => !old)}
+        />
     );
 }
 
diff --git a/src/plugins/gameActivityToggle/style.css b/src/plugins/gameActivityToggle/style.css
index b6abf47..c25b366 100644
--- a/src/plugins/gameActivityToggle/style.css
+++ b/src/plugins/gameActivityToggle/style.css
@@ -1,19 +1,3 @@
 [class*="withTagAsButton"] {
     min-width: 88px;
 }
-
-.game-activity-toggle-btn {
-    all: unset;
-    color: var(--interactive-normal);
-    width: 32px;
-    height: 32px;
-    border-radius: 4px;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-}
-
-.game-activity-toggle-btn:hover {
-    color: var(--interactive-hover);
-    background-color: var(--background-modifier-selected);
-}
-- 
cgit