lint

replugged-org · Sep 20, 2023 · a1a96b9 · a1a96b9
1 parent 609468b
commit a1a96b9
Show file tree

Hide file tree

Showing 8 changed files with 85 additions and 49 deletions.
diff --git a/src/renderer/coremods/settings/icons/Pin.tsx b/src/renderer/coremods/settings/icons/Pin.tsx
@@ -1,10 +1,11 @@
 import { MouseEventHandler } from "react";
 
 export default (props: { onClick?: MouseEventHandler }): React.ReactElement => (
-  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" onClick={props.onClick}>
-    <path
-      fill="currentColor"
-      d="M19 3H5V5H7V12H5V14H11V22H13V14H19V12H17V5H19V3Z"
-    />
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    viewBox="0 0 24 24"
+    fill="currentColor"
+    onClick={props.onClick}>
+    <path fill="currentColor" d="M19 3H5V5H7V12H5V14H11V22H13V14H19V12H17V5H19V3Z" />
   </svg>
 );
diff --git a/src/renderer/coremods/settings/icons/Popout.tsx b/src/renderer/coremods/settings/icons/Popout.tsx
@@ -1,7 +1,11 @@
 import { MouseEventHandler } from "react";
 
 export default (props: { onClick?: MouseEventHandler }): React.ReactElement => (
-  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" onClick={props.onClick}>
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    viewBox="0 0 24 24"
+    fill="currentColor"
+    onClick={props.onClick}>
     <path d="M10 5V3H5.375C4.06519 3 3 4.06519 3 5.375V18.625C3 19.936 4.06519 21 5.375 21H18.625C19.936 21 21 19.936 21 18.625V14H19V19H5V5H10Z M21 2.99902H14V4.99902H17.586L9.29297 13.292L10.707 14.706L19 6.41302V9.99902H21V2.99902Z" />
   </svg>
 );
diff --git a/src/renderer/coremods/settings/icons/Settings.tsx b/src/renderer/coremods/settings/icons/Settings.tsx
@@ -1,7 +1,11 @@
 import { MouseEventHandler } from "react";
 
 export default (props: { onClick?: MouseEventHandler }): React.ReactElement => (
-  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" fill="currentColor" onClick={props.onClick}>
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    viewBox="0 0 512 512"
+    fill="currentColor"
+    onClick={props.onClick}>
     {/* Font Awesome Pro 6.2.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. */}
     <path d="M495.9 166.6c3.2 8.7 .5 18.4-6.4 24.6l-43.3 39.4c1.1 8.3 1.7 16.8 1.7 25.4s-.6 17.1-1.7 25.4l43.3 39.4c6.9 6.2 9.6 15.9 6.4 24.6c-4.4 11.9-9.7 23.3-15.8 34.3l-4.7 8.1c-6.6 11-14 21.4-22.1 31.2c-5.9 7.2-15.7 9.6-24.5 6.8l-55.7-17.7c-13.4 10.3-28.2 18.9-44 25.4l-12.5 57.1c-2 9.1-9 16.3-18.2 17.8c-13.8 2.3-28 3.5-42.5 3.5s-28.7-1.2-42.5-3.5c-9.2-1.5-16.2-8.7-18.2-17.8l-12.5-57.1c-15.8-6.5-30.6-15.1-44-25.4L83.1 425.9c-8.8 2.8-18.6 .3-24.5-6.8c-8.1-9.8-15.5-20.2-22.1-31.2l-4.7-8.1c-6.1-11-11.4-22.4-15.8-34.3c-3.2-8.7-.5-18.4 6.4-24.6l43.3-39.4C64.6 273.1 64 264.6 64 256s.6-17.1 1.7-25.4L22.4 191.2c-6.9-6.2-9.6-15.9-6.4-24.6c4.4-11.9 9.7-23.3 15.8-34.3l4.7-8.1c6.6-11 14-21.4 22.1-31.2c5.9-7.2 15.7-9.6 24.5-6.8l55.7 17.7c13.4-10.3 28.2-18.9 44-25.4l12.5-57.1c2-9.1 9-16.3 18.2-17.8C227.3 1.2 241.5 0 256 0s28.7 1.2 42.5 3.5c9.2 1.5 16.2 8.7 18.2 17.8l12.5 57.1c15.8 6.5 30.6 15.1 44 25.4l55.7-17.7c8.8-2.8 18.6-.3 24.5 6.8c8.1 9.8 15.5 20.2 22.1 31.2l4.7 8.1c6.1 11 11.4 22.4 15.8 34.3zM256 336c44.2 0 80-35.8 80-80s-35.8-80-80-80s-80 35.8-80 80s35.8 80 80 80z" />
   </svg>

diff --git a/src/renderer/coremods/settings/icons/Unpin.tsx b/src/renderer/coremods/settings/icons/Unpin.tsx
@@ -1,14 +1,24 @@
 import { MouseEventHandler } from "react";
 
 export default (props: { onClick?: MouseEventHandler }): React.ReactElement => (
-  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" onClick={props.onClick}>
-    <g fill='none' fillRule='evenodd'>
-      <path fill='#f04747' d='M21.47,3.39,20.14,2.05,2.53,19.66,3.86,21l4.41-4.4,1.3-1.31,1.75-1.74,3.83-3.83Z' />
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    viewBox="0 0 24 24"
+    fill="currentColor"
+    onClick={props.onClick}>
+    <g fill="none" fillRule="evenodd">
+      <path
+        fill="#f04747"
+        d="M21.47,3.39,20.14,2.05,2.53,19.66,3.86,21l4.41-4.4,1.3-1.31,1.75-1.74,3.83-3.83Z"
+      />
     </g>
-    <g fill='none'>
-      <polygon points='17 11.14 16.55 11.59 14.14 14 19 14 19 12 17 12 17 11.14' fill='currentColor' />
-      <polygon points='16.91 3 5 3 5 5 7 5 7 12 5 12 5 14 5.91 14 16.91 3' fill='currentColor' />
-      <polygon points='12.72 15.42 11 17.14 11 22 13 22 13 15.14 12.72 15.42' fill='currentColor' />
+    <g fill="none">
+      <polygon
+        points="17 11.14 16.55 11.59 14.14 14 19 14 19 12 17 12 17 11.14"
+        fill="currentColor"
+      />
+      <polygon points="16.91 3 5 3 5 5 7 5 7 12 5 12 5 14 5.91 14 16.91 3" fill="currentColor" />
+      <polygon points="12.72 15.42 11 17.14 11 22 13 22 13 15.14 12.72 15.42" fill="currentColor" />
     </g>
   </svg>
 );
diff --git a/src/renderer/coremods/settings/icons/index.ts b/src/renderer/coremods/settings/icons/index.ts
@@ -17,5 +17,5 @@ export default {
   Trash,
   Popout,
   Pin,
-  Unpin
+  Unpin,
 };
diff --git a/src/renderer/coremods/settings/index.tsx b/src/renderer/coremods/settings/index.tsx
@@ -4,7 +4,7 @@ import { Injector } from "@replugged";
 import { filters, waitForModule } from "src/renderer/modules/webpack";
 import type { Section as SectionType } from "src/types/coremods/settings";
 import { Divider, Header, Section, insertSections, settingsTools } from "./lib";
-import { General, Plugins, ConnectedQuickCSS, Themes, Updater } from "./pages";
+import { ConnectedQuickCSS, General, Plugins, Themes, Updater } from "./pages";
 
 const injector = new Injector();
 

diff --git a/src/renderer/coremods/settings/pages/QuickCSS.css b/src/renderer/coremods/settings/pages/QuickCSS.css
@@ -2,7 +2,7 @@
   color: var(--text-normal);
 }
 
-#replugged-quickcss-wrapper[data-popout=true] {
+#replugged-quickcss-wrapper[data-popout="true"] {
   width: 100% !important;
 }
 
@@ -37,7 +37,7 @@
 }
 
 /* TODO: Fix the height not working in popout */
-#replugged-quickcss-wrapper[data-popout=true] .cm-scroller {
+#replugged-quickcss-wrapper[data-popout="true"] .cm-scroller {
   max-height: 95vh;
 }
 
@@ -63,7 +63,7 @@
   background-color: var(--background-secondary);
 }
 /* Why do these have to be different in different windows.. */
-#replugged-quickcss-wrapper[data-popout=true] .replugged-quickcss-header {
+#replugged-quickcss-wrapper[data-popout="true"] .replugged-quickcss-header {
   height: 16px;
 }
 

diff --git a/src/renderer/coremods/settings/pages/QuickCSS.tsx b/src/renderer/coremods/settings/pages/QuickCSS.tsx
@@ -43,10 +43,10 @@ const closePopout = webpack.getFunctionBySource(PopoutModule, "POPOUT_WINDOW_CLO
 ) => void;
 
 // eslint-disable-next-line @typescript-eslint/non-nullable-type-assertion-style
-const setAlwaysOnTop = webpack.getFunctionBySource(PopoutModule, "POPOUT_WINDOW_SET_ALWAYS_ON_TOP") as (
-  key: string,
-  alwaysOnTop: boolean,
-) => void;
+const setAlwaysOnTop = webpack.getFunctionBySource(
+  PopoutModule,
+  "POPOUT_WINDOW_SET_ALWAYS_ON_TOP",
+) as (key: string, alwaysOnTop: boolean) => void;
 
 // eslint-disable-next-line @typescript-eslint/non-nullable-type-assertion-style
 const PopoutWindowStore = webpack.getByStoreName("PopoutWindowStore") as Store & {
@@ -219,7 +219,7 @@ const QuickCSS = (props: { popout: boolean } & Record<string, boolean>): React.R
     }, []);
   }
 
-  const [ alwaysOnTop, setAlwaysOnTop_ ] = React.useState(props.popoutOnTop);
+  const [alwaysOnTop, setAlwaysOnTop_] = React.useState(props.popoutOnTop);
 
   return (
     <>
@@ -260,28 +260,42 @@ const QuickCSS = (props: { popout: boolean } & Record<string, boolean>): React.R
               <Settings />
             </Tooltip>
 
-            {props.popout ? <Tooltip text={alwaysOnTop ? Messages.POPOUT_REMOVE_FROM_TOP : Messages.POPOUT_STAY_ON_TOP}>
-              {alwaysOnTop ? <Unpin onClick={() => {
-                setAlwaysOnTop('DISCORD_REPLUGGED_QUICKCSS', false);
-                setAlwaysOnTop_(false);
-              }} /> : <Pin onClick={() => {
-                setAlwaysOnTop('DISCORD_REPLUGGED_QUICKCSS', true);
-                setAlwaysOnTop_(true);
-              }} />
-              }
-            </Tooltip> : <Tooltip text={Messages.POPOUT_PLAYER}>
-              <Popout onClick={() => {
-                openPopout(
-                  "DISCORD_REPLUGGED_QUICKCSS",
-                  () => (
-                    <DnDProvider windowKey="DISCORD_REPLUGGED_QUICKCSS">
-                      <QuickCSS popout={true}></QuickCSS>
-                    </DnDProvider>
-                  ),
-                  {},
-                );
-              }} />
-            </Tooltip>}
+            {props.popout ? (
+              <Tooltip
+                text={alwaysOnTop ? Messages.POPOUT_REMOVE_FROM_TOP : Messages.POPOUT_STAY_ON_TOP}>
+                {alwaysOnTop ? (
+                  <Unpin
+                    onClick={() => {
+                      setAlwaysOnTop("DISCORD_REPLUGGED_QUICKCSS", false);
+                      setAlwaysOnTop_(false);
+                    }}
+                  />
+                ) : (
+                  <Pin
+                    onClick={() => {
+                      setAlwaysOnTop("DISCORD_REPLUGGED_QUICKCSS", true);
+                      setAlwaysOnTop_(true);
+                    }}
+                  />
+                )}
+              </Tooltip>
+            ) : (
+              <Tooltip text={Messages.POPOUT_PLAYER}>
+                <Popout
+                  onClick={() => {
+                    openPopout(
+                      "DISCORD_REPLUGGED_QUICKCSS",
+                      () => (
+                        <DnDProvider windowKey="DISCORD_REPLUGGED_QUICKCSS">
+                          <QuickCSS popout={true}></QuickCSS>
+                        </DnDProvider>
+                      ),
+                      {},
+                    );
+                  }}
+                />
+              </Tooltip>
+            )}
           </div>
           <div ref={ref}></div>
         </div>
@@ -290,10 +304,13 @@ const QuickCSS = (props: { popout: boolean } & Record<string, boolean>): React.R
   );
 };
 
-export const ConnectedQuickCSS = flux.connectStores<{ popout: boolean }, { popout: boolean; isPopoutOpen: boolean }>([PopoutWindowStore], (props) => {
+export const ConnectedQuickCSS = flux.connectStores<
+  { popout: boolean },
+  { popout: boolean; isPopoutOpen: boolean }
+>([PopoutWindowStore], (props) => {
   return {
     isPopoutOpen: PopoutWindowStore.getWindowOpen("DISCORD_REPLUGGED_QUICKCSS"),
     popoutOnTop: PopoutWindowStore.getIsAlwaysOnTop("DISCORD_REPLUGGED_QUICKCSS"),
-    ...props
-  }
+    ...props,
+  };
 })(QuickCSS);
-Original file line number
+Diff line change
@@ Expand Up / @@ -17,5 +17,5 @@ export default { @@
       Trash,
       Popout,
       Pin,
-      Unpin
+      Unpin,
     };