fix:fix eslint errors

mate-academy · Nov 13, 2024 · 7a65fa3 · 7a65fa3
1 parent bbd9e39
commit 7a65fa3
Show file tree

Hide file tree

Showing 6 changed files with 55 additions and 37 deletions.
diff --git a/src/components/ErrorBoundary/ErrorBoundry.tsx b/src/components/ErrorBoundary/ErrorBoundry.tsx
@@ -11,9 +11,10 @@ interface State {
 class ErrorBoundary extends Component<Props, State> {
   constructor(props: Props) {
     super(props);
-    this.state = { hasError: false };
   }
 
+  state = { hasError: false };
+
   componentDidCatch(): void {
     this.setState({ hasError: true });
   }

diff --git a/src/components/Posts/PostList/PostList.tsx b/src/components/Posts/PostList/PostList.tsx
@@ -6,29 +6,29 @@ interface PostsListProps {
   posts: Post[];
 }
 
-export const PostList: FC<PostsListProps> = memo(({ posts }) => {
-  return (
-    <div data-cy="PostsList">
-      <p className="title">Posts:</p>
+export const PostList: FC<PostsListProps> = memo(({ posts }) => (
+  <div data-cy="PostsList">
+    <p className="title">Posts:</p>
 
-      <table className="table is-fullwidth is-striped is-hoverable is-narrow">
-        <thead>
-          <tr className="has-background-link-light">
-            <th>#</th>
-            <th>Title</th>
-            {/* eslint-disable-next-line jsx-a11y/control-has-associated-label */}
-            <th> </th>
+    <table className="table is-fullwidth is-striped is-hoverable is-narrow">
+      <thead>
+        <tr className="has-background-link-light">
+          <th>#</th>
+          <th>Title</th>
+          {/* eslint-disable-next-line jsx-a11y/control-has-associated-label */}
+          <th> </th>
+        </tr>
+      </thead>
+
+      <tbody>
+        {posts.map(post => (
+          <tr data-cy="Post" key={post.id}>
+            <PostListItem post={post} />
           </tr>
-        </thead>
+        ))}
+      </tbody>
+    </table>
+  </div>
+));
 
-        <tbody>
-          {posts.map(post => (
-            <tr data-cy="Post" key={post.id}>
-              <PostListItem post={post} />
-            </tr>
-          ))}
-        </tbody>
-      </table>
-    </div>
-  );
-});
+PostList.displayName = 'PostList';
diff --git a/src/hooks/useCommentForm.ts b/src/hooks/useCommentForm.ts
@@ -46,7 +46,9 @@ export const useCommentForm = (
     (event: ChangeEvent<HTMLInputElement>) => {
       setName(event.target.value);
 
-      nameError && setNameError('');
+      if (nameError) {
+        setNameError('');
+      }
     },
     [nameError],
   );
@@ -55,7 +57,9 @@ export const useCommentForm = (
     (event: ChangeEvent<HTMLInputElement>) => {
       setEmail(event.target.value);
 
-      emailError && setEmailError('');
+      if (emailError) {
+        setEmailError('');
+      }
     },
     [emailError],
   );
@@ -64,7 +68,9 @@ export const useCommentForm = (
     (event: ChangeEvent<HTMLTextAreaElement>) => {
       setBody(event.target.value);
 
-      bodyError && setBodyError('');
+      if (bodyError) {
+        setBodyError('');
+      }
     },
     [bodyError],
   );

diff --git a/src/hooks/useComments.ts b/src/hooks/useComments.ts
@@ -6,6 +6,7 @@ import { getCommentsByPostId } from '../api/posts';
 export const useComments = (postId: number) => {
   const [comments, setComments] = useState<Comment[]>([]);
   const [isLoading, setLoading] = useState(false);
+  const [isError, setError] = useState('');
 
   const fetchComments = () => {
     setLoading(true);
@@ -21,10 +22,12 @@ export const useComments = (postId: number) => {
         if (res.postId) {
           setComments(prevState => [...prevState, res]);
         } else {
-          throw res;
+          setError('Fetch comments with error');
         }
       })
-      .catch(error => console.log(error));
+      .catch((error: Error) => {
+        setError(error.message);
+      });
   };
 
   const handleDeleteComment = async (id: number) => {
@@ -34,10 +37,12 @@ export const useComments = (postId: number) => {
   };
 
   return {
+    isLoading,
+    isError,
+    comments,
+
     handleAddComment,
     handleDeleteComment,
-    comments,
     fetchComments,
-    isLoading,
   };
 };
diff --git a/src/hooks/usePost.ts b/src/hooks/usePost.ts
@@ -13,12 +13,14 @@ export const usePosts = (selectedUser: User | null) => {
       setLoadingPosts(true);
       getUserPosts(selectedUser.id)
         .then(res => {
-          Array.isArray(res)
-            ? setPosts(res)
-            : setPostsError('Fetch post with error');
+          if (Array.isArray(res)) {
+            setPosts(res);
+          } else {
+            setPostsError('Fetch post with error');
+          }
         })
-        .catch(() => {
-          setTimeout(() => setPostsError(null), 3000);
+        .catch((error: Error) => {
+          setPostsError(error.message);
         })
         .finally(() => setLoadingPosts(false));
     }

diff --git a/src/hooks/useUsers.ts b/src/hooks/useUsers.ts
@@ -6,15 +6,19 @@ export const useUsers = () => {
   const [users, setUsers] = useState<User[]>([]);
   const [selectedUser, setSelectedUser] = useState<User | null>(null);
   const [isUserMenuOpen, setUserMenuOpen] = useState(false);
+  const [isUserError, setUserError] = useState('');
 
   useLayoutEffect(() => {
-    getUsers().then(setUsers);
+    getUsers()
+      .then(setUsers)
+      .catch((error: Error) => setUserError(error.message));
   }, []);
 
   return {
     users,
     selectedUser,
     isUserMenuOpen,
+    isUserError,
 
     setSelectedUser,
     setUserMenuOpen,