fix: run eslint

allbertuu · Mar 5, 2024 · 9beb702 · 9beb702
1 parent 3e48e83
commit 9beb702
Show file tree

Hide file tree

Showing 5 changed files with 51 additions and 53 deletions.
diff --git a/src/components/PostBody/index.tsx b/src/components/PostBody/index.tsx
@@ -15,29 +15,29 @@ export const PostBody: React.FC = () => {
   const [loading, setLoading] = useState(true);
   const router = useRouter();
 
-  const handleFetchIssue = async () => {
-    const query = router.query.postTitle;
-    if (!query) return;
+  useEffect(() => {
+    const handleFetchIssue = async () => {
+      const query = router.query.postTitle;
+      if (!query) return;
 
-    const issueNumber = query[1];
+      const issueNumber = query[1];
 
-    try {
-      const data = await fetchIssue(issueNumber);
-      setPost(data);
-    } catch (e: any) {
-      toast.error(
-        <>
-          Ish! Não deu pra acessar esse! 😞
-          <br />
-          <small>{e.message}</small>
-        </>
-      );
-    } finally {
-      setLoading(false);
-    }
-  };
+      try {
+        const data = await fetchIssue(issueNumber);
+        setPost(data);
+      } catch (e: any) {
+        toast.error(
+          <>
+            Ish! Não deu pra acessar esse! 😞
+            <br />
+            <small>{e.message}</small>
+          </>
+        );
+      } finally {
+        setLoading(false);
+      }
+    };
 
-  useEffect(() => {
     handleFetchIssue();
   }, [router.query.postTitle]);
 

diff --git a/src/components/PostHeader/index.tsx b/src/components/PostHeader/index.tsx
@@ -22,33 +22,32 @@ export const PostHeader: React.FC = () => {
   const [loading, setLoading] = useState(true);
   const router = useRouter();
 
-  const handleFetchIssue = async () => {
-    const query = router.query.postTitle;
-    if (!query) return;
+  useEffect(() => {
+    const handleFetchIssue = async () => {
+      const query = router.query.postTitle;
+      if (!query) return;
 
-    const issueNumber = query[1];
+      const issueNumber = query[1];
 
-    try {
-      const data = await fetchIssue(issueNumber);
-      setPost(data);
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    } catch (e: any) {
-      toast.error(
-        <>
-          Ish! Não deu pra acessar esse! 😞
-          <br />
-          <small>{e.message}</small>
-        </>
-      );
-    } finally {
-      setLoading(false);
-    }
-  };
+      try {
+        const data = await fetchIssue(issueNumber);
+        setPost(data);
+      } catch (e: any) {
+        toast.error(
+          <>
+            Ish! Não deu pra acessar esse! 😞
+            <br />
+            <small>{e.message}</small>
+          </>
+        );
+      } finally {
+        setLoading(false);
+      }
+    };
 
-  useEffect(() => {
     handleFetchIssue();
   }, [router.query.postTitle]);
-  
+
   /**
    * Retorna para a página anterior na history do navegador.
    */

diff --git a/src/components/SearchInput/index.tsx b/src/components/SearchInput/index.tsx
@@ -1,6 +1,6 @@
 import { useDebounce, usePosts } from '@hooks/index';
 import { GitHubAPI } from '@services/github.api';
-import { useEffect, useRef, useState } from 'react';
+import { useCallback, useEffect, useRef, useState } from 'react';
 import { toast } from 'react-toastify';
 import { SearchInputProps } from './types';
 
@@ -14,7 +14,7 @@ const SearchInput: React.FC<SearchInputProps> = ({ ...props }) => {
   const SEARCH_MIN_LENGTH = 3;
   const inputElement = useRef<HTMLInputElement>(null);
 
-  const getFilteredPosts = async () => {
+  const getFilteredPosts = useCallback(async () => {
     try {
       const res = await GitHubAPI.get('/search/issues', {
         params: {
@@ -38,7 +38,7 @@ const SearchInput: React.FC<SearchInputProps> = ({ ...props }) => {
         </>
       );
     }
-  };
+  }, [inputValue, setPosts]);
 
   const debouncedCallback = useDebounce(
     getFilteredPosts,
@@ -53,7 +53,7 @@ const SearchInput: React.FC<SearchInputProps> = ({ ...props }) => {
     if (inputValue.length === 0) {
       getPosts();
     }
-  }, [inputValue]);
+  }, [debouncedCallback, getPosts, inputValue]);
 
   // That's a way to autoFocus that respect React way of doing things
   // https://blog.maisie.ink/react-ref-autofocus/#time-for-react

diff --git a/src/contexts/PostsContext/index.tsx b/src/contexts/PostsContext/index.tsx
@@ -1,5 +1,5 @@
 import { GitHubAPI, GitHubIssue } from '@services/github.api';
-import { createContext, useCallback, useEffect, useState } from 'react';
+import { createContext, useCallback, useState } from 'react';
 import { toast } from 'react-toastify';
 import { IPostsContext, IPostsProvider } from './types';
 
@@ -25,10 +25,6 @@ export function PostsProvider({ children }: IPostsProvider) {
     }
   }, []);
 
-  useEffect(() => {
-    getPosts();
-  }, []);
-
   return (
     <PostsContext.Provider
       value={{

diff --git a/src/pages/_document.tsx b/src/pages/_document.tsx
@@ -18,8 +18,11 @@ export default function Document() {
           rel="stylesheet"
           href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/styles/github-dark-dimmed.min.css"
         />
-        <script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/highlight.min.js"></script>
-        <script>hljs.highlightAll();</script>
+        <script
+          src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/highlight.min.js"
+          async={true}
+        ></script>
+        <script async={true}>hljs.highlightAll();</script>
       </Head>
       <body className="bg-blue-700">
         <Main />