From ad200cfcadca744fde1121e14f1efd5e98afe86a Mon Sep 17 00:00:00 2001
From: HF <hf@pixelplanet.fun>
Date: Wed, 24 Jan 2024 00:59:22 +0100
Subject: [PATCH] fix some eslint errors

---
 src/components/Captcha.jsx                      | 2 ++
 src/components/Converter.jsx                    | 7 ++++---
 src/components/HistorySelect.jsx                | 4 ++--
 src/components/LanguageSelect.jsx               | 7 +++----
 src/components/NotifyBox.jsx                    | 2 +-
 src/components/Rankings.jsx                     | 2 +-
 src/components/UIPopUp.jsx                      | 2 +-
 src/components/buttons/ChatButton.jsx           | 2 +-
 src/components/buttons/MovementControls.jsx     | 6 +++---
 src/components/contextmenus/ChannelDropDown.jsx | 4 ++--
 src/components/embeds/TikTok.jsx                | 2 +-
 src/components/hooks/clickOutside.js            | 4 ++--
 src/components/hooks/link.js                    | 2 +-
 src/components/hooks/postMessage.js             | 2 +-
 src/components/hooks/resize.js                  | 2 --
 src/components/windows/Settings.jsx             | 4 ++--
 src/components/windows/UserArea.jsx             | 2 +-
 src/controls/VoxelPainterControls.js            | 2 --
 src/controls/keypress.js                        | 8 ++------
 19 files changed, 30 insertions(+), 36 deletions(-)

diff --git a/src/components/Captcha.jsx b/src/components/Captcha.jsx
index dfd5337..e7c2c42 100644
--- a/src/components/Captcha.jsx
+++ b/src/components/Captcha.jsx
@@ -59,6 +59,8 @@ const Captcha = ({ autoload, width, setLegit }) => {
     if (autoload) {
       reloadCaptcha();
     }
+  // intentionally only executed on first render
+  // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
 
   const contWidth = width || 100;
diff --git a/src/components/Converter.jsx b/src/components/Converter.jsx
index d6f597a..f2cdce5 100644
--- a/src/components/Converter.jsx
+++ b/src/components/Converter.jsx
@@ -145,6 +145,7 @@ function Converter() {
     extraOpts,
     scaleData,
     gridData,
+    canvases,
   ]);
 
   const {
@@ -171,17 +172,17 @@ function Converter() {
     if (showExtraOptions) {
       setTimeout(() => setExtraRender(true), 10);
     }
-  }, [selectedStrategy]);
+  }, [showExtraOptions]);
   useEffect(() => {
     if (gridEnabled) {
       setTimeout(() => setGridRender(true), 10);
     }
-  }, [gridData.enabled]);
+  }, [gridEnabled]);
   useEffect(() => {
     if (scalingEnabled) {
       setTimeout(() => setScalingRender(true), 10);
     }
-  }, [scaleData.enabled]);
+  }, [scalingEnabled]);
 
   const gimpLink = <a href="https://www.gimp.org">GIMP</a>;
 
diff --git a/src/components/HistorySelect.jsx b/src/components/HistorySelect.jsx
index 22207db..5336403 100644
--- a/src/components/HistorySelect.jsx
+++ b/src/components/HistorySelect.jsx
@@ -65,7 +65,7 @@ const HistorySelect = () => {
       setTime(date, newTimes[0]);
     }
     setSubmitting(false);
-  }, [submitting, times]);
+  }, [submitting, canvasId, setTime]);
 
   const changeTime = useCallback(async (diff) => {
     if (!times.length
@@ -97,7 +97,7 @@ const HistorySelect = () => {
 
     setTimes(newTimes);
     setTime(newSelectedDate, newTimes[newPos]);
-  }, [historicalTime, times, submitting]);
+  }, [historicalTime, times, canvasId, setTime]);
 
   const selectedDate = stringToDate(historicalDate);
   const selectedTime = stringToTime(historicalTime);
diff --git a/src/components/LanguageSelect.jsx b/src/components/LanguageSelect.jsx
index d4738d9..1075cdd 100644
--- a/src/components/LanguageSelect.jsx
+++ b/src/components/LanguageSelect.jsx
@@ -11,12 +11,11 @@ import { t } from 'ttag';
 import { MONTH } from '../core/constants';
 
 function LanguageSelect() {
-  const { lang, langs } = window.ssv;
-
-  const [langSel, setLangSel] = useState(lang);
+  const [langSel, setLangSel] = useState(window.ssv.lang);
   const [ccSel, setCCSel] = useState('xx');
 
   useEffect(() => {
+    const { langs } = window.ssv;
     for (let i = 0; i < langs.length; i += 1) {
       const [lc, cc] = langs[i];
       if (lc === langSel) {
@@ -41,7 +40,7 @@ function LanguageSelect() {
           }}
         >
           {
-            langs.map(([l]) => (
+            window.ssv.langs.map(([l]) => (
               <option
                 key={l}
                 value={l}
diff --git a/src/components/NotifyBox.jsx b/src/components/NotifyBox.jsx
index 7c8319d..a83babd 100644
--- a/src/components/NotifyBox.jsx
+++ b/src/components/NotifyBox.jsx
@@ -17,7 +17,7 @@ const NotifyBox = () => {
         setClassName(newClassName);
       }
     }
-  }, [notification]);
+  }, [notification, className]);
 
   return (
     <div
diff --git a/src/components/Rankings.jsx b/src/components/Rankings.jsx
index c2c5f16..bd7fbde 100644
--- a/src/components/Rankings.jsx
+++ b/src/components/Rankings.jsx
@@ -83,7 +83,7 @@ const Rankings = () => {
       return null;
     }
     return getOnlineStatsData(onlineStats, pHourlyStats);
-  }, [area, onlineStats]);
+  }, [area, onlineStats, pHourlyStats]);
 
   const onlineOpts = useMemo(() => {
     if (area !== 'charts') {
diff --git a/src/components/UIPopUp.jsx b/src/components/UIPopUp.jsx
index a8500f3..61add33 100644
--- a/src/components/UIPopUp.jsx
+++ b/src/components/UIPopUp.jsx
@@ -28,7 +28,7 @@ const UIPopUp = () => {
     setTitle: (title) => dispatch(setWindowTitle(title)),
     // eslint-disable-next-line max-len
     changeType: (newType, newTitle, newArgs) => dispatch(changeWindowType(newType, newTitle, newArgs)),
-  }), [args]);
+  }), [args, dispatch]);
 
   return (
     <div
diff --git a/src/components/buttons/ChatButton.jsx b/src/components/buttons/ChatButton.jsx
index 533c7e0..8baaa62 100644
--- a/src/components/buttons/ChatButton.jsx
+++ b/src/components/buttons/ChatButton.jsx
@@ -69,7 +69,7 @@ const ChatButton = () => {
     if (i === cids.length) {
       setUnreadAny(false);
     }
-  });
+  }, [chatNotify, chatOpen, channels, unread, mute]);
 
   return (
     <div
diff --git a/src/components/buttons/MovementControls.jsx b/src/components/buttons/MovementControls.jsx
index 4447266..a7055a8 100644
--- a/src/components/buttons/MovementControls.jsx
+++ b/src/components/buttons/MovementControls.jsx
@@ -59,7 +59,7 @@ const MovementControls = () => {
         break;
       default:
     }
-  }, []);
+  }, [dispatch]);
 
   const onPressStop = useCallback((event) => {
     event.preventDefault();
@@ -84,12 +84,12 @@ const MovementControls = () => {
         break;
       default:
     }
-  }, []);
+  }, [dispatch]);
 
   const onCancel = useCallback((event) => {
     event.preventDefault();
     dispatch(cancelMove());
-  }, []);
+  }, [dispatch]);
 
   const refCallBack = useCallback((node) => {
     if (!node) {
diff --git a/src/components/contextmenus/ChannelDropDown.jsx b/src/components/contextmenus/ChannelDropDown.jsx
index 6a9ee5e..4b9db01 100644
--- a/src/components/contextmenus/ChannelDropDown.jsx
+++ b/src/components/contextmenus/ChannelDropDown.jsx
@@ -51,7 +51,7 @@ const ChannelDropDown = ({
         setType(chType);
       }
     }
-  }, [show]);
+  }, [show, channels, chatChannel]);
 
   useEffect(() => {
     const cids = Object.keys(channels);
@@ -90,7 +90,7 @@ const ChannelDropDown = ({
     if (i === cids.length) {
       setUnreadAny(false);
     }
-  }, [channels, unread]);
+  }, [channels, unread, mute, unreadAny]);
 
   useEffect(() => {
     const cids = Object.keys(channels);
diff --git a/src/components/embeds/TikTok.jsx b/src/components/embeds/TikTok.jsx
index babf27c..19d2016 100644
--- a/src/components/embeds/TikTok.jsx
+++ b/src/components/embeds/TikTok.jsx
@@ -27,7 +27,7 @@ const TikTok = ({ url }) => {
       }
     }
     fetchData();
-  }, []);
+  }, [url]);
 
   if (!embedCode) {
     return <div>LOADING</div>;
diff --git a/src/components/hooks/clickOutside.js b/src/components/hooks/clickOutside.js
index 35c4684..4acf11b 100644
--- a/src/components/hooks/clickOutside.js
+++ b/src/components/hooks/clickOutside.js
@@ -19,7 +19,7 @@ export function useConditionalClickOutside(insideRefs, active, callback) {
       || !ref.current.contains(event.target))) {
       callback();
     }
-  }, [callback]);
+  }, [callback, insideRefs]);
 
   const handleWindowResize = useCallback(() => {
     callback();
@@ -37,7 +37,7 @@ export function useConditionalClickOutside(insideRefs, active, callback) {
       });
       window.removeEventListener('resize', handleWindowResize);
     }
-  }, [active, callback]);
+  }, [active, handleClickOutside, handleWindowResize]);
 }
 
 /*
diff --git a/src/components/hooks/link.js b/src/components/hooks/link.js
index aacd608..21614c8 100644
--- a/src/components/hooks/link.js
+++ b/src/components/hooks/link.js
@@ -126,7 +126,7 @@ function useLink() {
 
     // open within window
     contextData.changeType(windowType, title, args);
-  }, [contextData]);
+  }, [contextData, dispatch]);
 }
 
 export default useLink;
diff --git a/src/components/hooks/postMessage.js b/src/components/hooks/postMessage.js
index 8068a4c..0c3a035 100644
--- a/src/components/hooks/postMessage.js
+++ b/src/components/hooks/postMessage.js
@@ -19,7 +19,7 @@ function usePostMessage(iFrameRef, callback) {
     window.addEventListener('message', handleMessage, false);
 
     return () => window.removeEventListener('message', handleMessage);
-  }, []);
+  }, [iFrameRef]);
 }
 
 export default usePostMessage;
diff --git a/src/components/hooks/resize.js b/src/components/hooks/resize.js
index 0c40f3c..67726b7 100644
--- a/src/components/hooks/resize.js
+++ b/src/components/hooks/resize.js
@@ -1,6 +1,4 @@
 /*
- * @flex
- *
  * can be used in react components
  * to trigger on window resize
  */
diff --git a/src/components/windows/Settings.jsx b/src/components/windows/Settings.jsx
index cb40d29..64327e0 100644
--- a/src/components/windows/Settings.jsx
+++ b/src/components/windows/Settings.jsx
@@ -53,7 +53,7 @@ const SettingsItemSelect = ({
   </div>
 );
 
-function Settings() {
+const Settings = () => {
   const [
     isGridShown,
     isPixelNotifyShown,
@@ -194,6 +194,6 @@ function Settings() {
       )}
     </div>
   );
-}
+};
 
 export default React.memo(Settings);
diff --git a/src/components/windows/UserArea.jsx b/src/components/windows/UserArea.jsx
index 2a2bec8..68fb38c 100644
--- a/src/components/windows/UserArea.jsx
+++ b/src/components/windows/UserArea.jsx
@@ -42,7 +42,7 @@ const UserArea = () => {
       activeTab: label,
     });
     setTitle(label);
-  }, [setArgs]);
+  }, [setArgs, setTitle]);
 
   useInterval(() => {
     if (Date.now() - 300000 > lastStatsFetch) {
diff --git a/src/controls/VoxelPainterControls.js b/src/controls/VoxelPainterControls.js
index 5872e61..1811b61 100644
--- a/src/controls/VoxelPainterControls.js
+++ b/src/controls/VoxelPainterControls.js
@@ -122,7 +122,6 @@ class VoxelPainterControls {
   storeViewInStateTime = Date.now();
   prevTime = Date.now();
   offset = new Vector3();
-  direction = new Vector3();
   velocity = new Vector3();
   vec = new Vector3();
   // forcing next update
@@ -622,7 +621,6 @@ class VoxelPainterControls {
       camera,
       target,
       velocity,
-      direction,
       offset,
       vec,
       spherical,
diff --git a/src/controls/keypress.js b/src/controls/keypress.js
index 7ed3513..26bd178 100644
--- a/src/controls/keypress.js
+++ b/src/controls/keypress.js
@@ -17,12 +17,8 @@ import {
   setMoveV,
   setMoveW,
 } from '../store/actions';
-import {
-  HOLD_PAINT,
-} from '../core/constants';
-import {
-  notify,
-} from '../store/actions/thunks';
+import { HOLD_PAINT } from '../core/constants';
+import { notify } from '../store/actions/thunks';
 
 const charKeys = ['g', 'h', 'x', 'm', 'r', 'p', '+', '-'];