lint-fix: make eslint happy

Author: Handiwork

.editorconfig

@@ -6,6 +6,7 @@ indent_style = space
 indent_size = 2
 insert_final_newline = true
 trim_trailing_whitespace = true
+end_of_line = lf
 
 [*.{js,ts,jsx,tsx,css,json,md,mdx,yml,yaml}]
 indent_size = 2

.vscode/extensions.json

@@ -0,0 +1,5 @@
+{
+  "recommendations": [
+    "dbaeumer.vscode-eslint"
+  ]
+}

src/components/FactItem.tsx

@@ -19,8 +19,12 @@ export const FactItem: FCC<{
       className,
     )}
   >
-    {icon && <Icon icon={icon} className="mr-2 text-zinc-500 dark:text-slate-100" />}
-    <div className="text-sm mr-2 text-zinc-500 dark:text-slate-100">{title}</div>
+    {icon && (
+      <Icon icon={icon} className="mr-2 text-zinc-500 dark:text-slate-100" />
+    )}
+    <div className="text-sm mr-2 text-zinc-500 dark:text-slate-100">
+      {title}
+    </div>
     {children}
   </div>
 )

src/components/HelperText.tsx

@@ -22,7 +22,12 @@ export const HelperText: FCC<{
   }
 
   return (
-    <div className={clsx('flex text-gray-600 dark:text-zinc-400 text-xs items-center', className)}>
+    <div
+      className={clsx(
+        'flex text-gray-600 dark:text-zinc-400 text-xs items-center',
+        className,
+      )}
+    >
       <Icon icon="info-sign" size={12} className="mr-1.5" />
       <div>{child()}</div>
     </div>

src/components/OperationCard.tsx

@@ -20,12 +20,11 @@ export const NeoOperationCard = ({ operation }: { operation: Operation }) => {
   const { data: levels } = useLevels()
 
   return (
-    <Card
-      interactive={true}
-      elevation={Elevation.TWO}
-      className="relative"
-    >
-      <ReLink search={{ op: operation.id }} className="no-underline h-full flex flex-col gap-2">
+    <Card interactive={true} elevation={Elevation.TWO} className="relative">
+      <ReLink
+        search={{ op: operation.id }}
+        className="no-underline h-full flex flex-col gap-2"
+      >
         <div className="flex">
           <Tooltip2
             content={operation.parsedContent.doc.title}

src/components/Paragraphs.tsx

@@ -20,7 +20,7 @@ export const Paragraphs: FC<{
     const { height } = paragraphElementRef.current.getBoundingClientRect()
 
     setExceededLimitHeight(height > limitHeight)
-  }, [paragraphElementRef.current, limitHeight])
+  }, [limitHeight])
 
   const mask = exceededLimitHeight
     ? 'linear-gradient(to bottom, rgba(0,0,0,1) 0%, rgba(0,0,0,1) calc(100% - 2rem), rgba(0,0,0,0) 100%)'
@@ -40,9 +40,7 @@ export const Paragraphs: FC<{
       }}
     >
       <div ref={paragraphElementRef}>
-        {paragraphs?.map((paragraph, index) => (
-          <p key={index}>{paragraph}</p>
-        ))}
+        {paragraphs?.map((paragraph, index) => <p key={index}>{paragraph}</p>)}
       </div>
     </div>
   )

src/components/Suspensable.tsx

@@ -24,6 +24,7 @@ export const Suspensable: FCC<SuspensableProps> = ({
   useEffect(() => {
     resetError.current?.()
     resetError.current = undefined
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, retryDeps)
 
   return (

src/components/ThemeSwitchButton.tsx

@@ -1,16 +1,16 @@
 import { Button } from '@blueprintjs/core'
 
-import { useEffect, useState } from 'react'
+import { useCallback, useEffect, useState } from 'react'
 
 const themeMedia = window.matchMedia('(prefers-color-scheme: light)')
 
 export const ThemeSwitchButton = () => {
   const [theme, setTheme] = useState(localStorage.getItem('theme') || '')
-  const handleThemeSwitch = () => {
+  const handleThemeSwitch = useCallback(() => {
     const isCurrentDark = theme === 'dark'
     setTheme(isCurrentDark ? 'light' : 'dark')
     localStorage.setItem('theme', isCurrentDark ? 'light' : 'dark')
-  }
+  }, [theme])
   useEffect(() => {
     if (!themeMedia.matches && !localStorage.getItem('theme')) {
       handleThemeSwitch()
@@ -23,7 +23,7 @@ export const ThemeSwitchButton = () => {
       document.body.classList.remove('bp4-dark')
       document.body.classList.remove('dark')
     }
-  }, [theme])
+  }, [theme, handleThemeSwitch])
   return (
     <Button
       onClick={handleThemeSwitch}

src/components/account/EditDialog.tsx

@@ -92,7 +92,7 @@ const InfoPanel = ({ onClose }) => {
 
   useEffect(() => {
     reset(auth)
-  }, [auth])
+  }, [auth, reset])
 
   const globalError = (errors as FieldErrors<{ global: void }>).global?.message
 

src/components/announcement/AnnPanel.tsx

@@ -43,7 +43,7 @@ export const AnnPanel: FC<AnnPanelProps> = ({ className }) => {
       setDisplaySections(freshSections)
       setLastNoticed(Date.now())
     }
-  }, [announcement])
+  }, [announcement, lastNoticed, setLastNoticed])
 
   return (
     <>
@@ -60,9 +60,9 @@ export const AnnPanel: FC<AnnPanelProps> = ({ className }) => {
         <div className="flex">
           {announcement && (
             <ul className="grow list-disc pl-4">
-              {announcement?.sections.slice(0, 3).map(({ title }) => (
-                <li key={title}>{title}</li>
-              ))}
+              {announcement?.sections
+                .slice(0, 3)
+                .map(({ title }) => <li key={title}>{title}</li>)}
             </ul>
           )}
           {!announcement && error && (