chore(lint): small clean up of lint errors wip on #312

src/components/ArchivesSidebar/index.tsx

@@ -4,7 +4,7 @@ import React, { FC, HTMLAttributes } from "react"
 import useBuildTree from "../../hooks/useBuildTree"
 import { useLockBodyScroll } from "../../hooks/useLockBodyScroll"
 import useSidebar from "../../hooks/useSidebar"
-import { IAllArchivesQuery, IFileOrFolder } from "../../types"
+import { IFileOrFolder } from "../../types"
 import { humanize } from "../../utils"
 import { Sidebar } from "../Sidebar"
 import * as SC from "./styles"
@@ -50,7 +50,7 @@ export const ArchivesSidebar: FC<HTMLAttributes<HTMLDivElement>> = (props) => {
   return (
     <Sidebar {...props}>
       {sortedTree.map((node) => (
-        <Tree item={node} />
+        <Tree item={node} key={node.path} />
       ))}
     </Sidebar>
   )

src/components/FourZeroFour/index.tsx

@@ -1,4 +1,4 @@
-import React, { FC, Fragment } from "react"
+import React, { FC } from "react"
 import * as SC from "./styles"
 
 interface IPossibleCorrections {

src/components/FourZeroFourHint/index.tsx

@@ -100,7 +100,7 @@ export const FourZeroFourHint: FC<IFourZeroFourHint> = ({
   return (
     <Fragment>
       <SC.StyledDiv>
-        <h3>Based off of "{search}" you may have meant:</h3>
+        <h3>Based off of &quot;{search}&quot; you may have meant:</h3>
         {found}
       </SC.StyledDiv>
       <ul>

src/components/Home/index.tsx

@@ -4,6 +4,7 @@ import { DiscordButton } from "../DiscordButton"
 import { HomePartner } from "../HomePartner"
 import { WavesBottom, WavesTop } from "../Waves"
 import * as SC from "./styles"
+import { OutMode, MoveDirection } from "react-particles-js"
 
 interface IMenuItemProps {
   to: string
@@ -33,6 +34,7 @@ export const Home: FC = () => {
       <SC.StyledParticles
         params={{
           particles: {
+            /* eslint-disable-next-line id-blacklist */
             number: { value: 5, density: { enable: true, value_area: 500 } },
             color: { value: "#ffffff" },
             opacity: {
@@ -51,10 +53,10 @@ export const Home: FC = () => {
             move: {
               enable: true,
               speed: 1.5,
-              direction: "top",
+              direction: MoveDirection.top,
               random: false,
               straight: false,
-              out_mode: "out",
+              out_mode: OutMode.out,
               bounce: false,
               attract: { enable: false },
             },
@@ -67,7 +69,7 @@ export const Home: FC = () => {
           <Link to="/">
             <SC.Logo />
           </Link>
-          <SC.Title>The Programmer's Hangout</SC.Title>
+          <SC.Title>The Programmer&apos;s Hangout</SC.Title>
         </SC.TitleWrapper>
         <SC.Menu>
           <MenuItem to="/about">about</MenuItem>

src/components/ResourcesList/index.tsx

@@ -67,6 +67,8 @@ const Language = memo(
   }
 )
 
+Language.displayName = "Language"
+
 function sortTree(tree: IFileOrFolder[]) {
   return sort((a, b) => a.title.localeCompare(b.title), tree)
 }

src/components/ResourcesSidebar/index.tsx

@@ -141,6 +141,8 @@ const FirstLevelFolder = memo(({ item }: { item: IFolder }) => {
   )
 })
 
+FirstLevelFolder.displayName = "FirstLevelFolder"
+
 const ResourceList: FC<{
   items: IFileOrFolder[]
   setExpanded: React.Dispatch<React.SetStateAction<boolean>>

src/components/ResourcesSidebar/useMatchingPath.tsx

@@ -8,5 +8,5 @@ export default function useMatchingPath(path: string, callback: () => void) {
     if (isMatchingPath(path)) {
       callback()
     }
-  }, [])
+  }, [path, isMatchingPath, callback])
 }

src/components/Sidebar/index.tsx

@@ -28,7 +28,7 @@ export const Sidebar: FC<PropsWithChildren<HTMLAttributes<HTMLDivElement>>> = (
         <SC.Title to="/">
           The
           <br />
-          Programmer's
+          Programmer&apos;s
           <br />
           Hangout
         </SC.Title>

src/components/Toc/index.tsx

@@ -11,7 +11,7 @@ interface ITocProps {
 }
 
 interface ITitle {
-  prefix?: string
+  prefix: string | null
   title: string
 }
 
@@ -20,7 +20,7 @@ function extractTitle(title: string): ITitle {
   const rest = maybePrefix ? title.replace(maybePrefix[0], "") : title
 
   return {
-    prefix: maybePrefix ? `${maybePrefix[0]} ` : undefined,
+    prefix: maybePrefix ? `${maybePrefix[0]} ` : null,
     title: rest.trim(),
   }
 }