add task second solution

mate-academy · Nov 16, 2024 · 67a558a · 67a558a
1 parent 0a8bc53
commit 67a558a
Show file tree

Hide file tree

Showing 4 changed files with 24 additions and 29 deletions.
diff --git a/src/App.tsx b/src/App.tsx
@@ -27,7 +27,7 @@ export const App = () => {
   const [comments, setComments] = useState<Comment[]>([]);
   const [loadingComments, setLoadingComments] = useState(false);
   const [errorLoadComments, setErrorLoadComments] = useState<boolean>(false);
-  const [writeCommen, setWriteCommen] = useState<boolean>(false);
+  const [writeComment, setWriteComment] = useState<boolean>(false);
 
   useEffect(() => {
     getUsers().then(setUsers);
@@ -39,9 +39,6 @@ export const App = () => {
       .then(setPosts)
       .catch(() => {
         setErrorLoadPosts(true);
-        setInterval(() => {
-          setErrorLoadPosts(false);
-        }, 3000);
       })
       .finally(() => setLoadingPosts(false));
   }
@@ -52,9 +49,6 @@ export const App = () => {
       .then(setComments)
       .catch(() => {
         setErrorLoadComments(true);
-        setInterval(() => {
-          setErrorLoadComments(false);
-        }, 3000);
       })
       .finally(() => setLoadingComments(false));
   }
@@ -78,7 +72,7 @@ export const App = () => {
                   setUserSelected={setUserSelected}
                   getPostUser={getPostsUser}
                   setOpenPostDetails={setOpenPostDetails}
-                  setWriteCommen={setWriteCommen}
+                  setWriteComment={setWriteComment}
                   setPosts={setPosts}
                   setPost={setPost}
                 />
@@ -113,7 +107,7 @@ export const App = () => {
                     openPostDetails={openPostDetails}
                     setOpenPostDetails={setOpenPostDetails}
                     getCommentsPost={getCommentsPost}
-                    setWriteCommen={setWriteCommen}
+                    setWriteComment={setWriteComment}
                   />
                 )}
               </div>
@@ -138,8 +132,8 @@ export const App = () => {
                   setComments={setComments}
                   loadingComments={loadingComments}
                   errorLoadComments={errorLoadComments}
-                  writeCommen={writeCommen}
-                  setWriteCommen={setWriteCommen}
+                  writeComment={writeComment}
+                  setWriteComment={setWriteComment}
                 />
               )}
             </div>

diff --git a/src/components/PostDetails.tsx b/src/components/PostDetails.tsx
@@ -11,8 +11,8 @@ type Props = {
   setComments: (comments: Comment[]) => void;
   loadingComments: boolean;
   errorLoadComments: boolean;
-  writeCommen: boolean;
-  setWriteCommen: (writeCommen: boolean) => void;
+  writeComment: boolean;
+  setWriteComment: (writeCommen: boolean) => void;
 };
 
 export const PostDetails: React.FC<Props> = ({
@@ -21,10 +21,10 @@ export const PostDetails: React.FC<Props> = ({
   setComments,
   loadingComments,
   errorLoadComments,
-  writeCommen,
-  setWriteCommen,
+  writeComment,
+  setWriteComment,
 }) => {
-  function removeDelete(comment: Comment) {
+  function removeComment(comment: Comment) {
     setComments([...comments.filter(commentary => commentary !== comment)]);
     deleteComment(comment.id).catch(() => setComments([...comments]));
   }
@@ -79,7 +79,7 @@ export const PostDetails: React.FC<Props> = ({
                       type="button"
                       className="delete is-small"
                       aria-label="delete"
-                      onClick={() => removeDelete(comment)}
+                      onClick={() => removeComment(comment)}
                     />
                   </div>
 
@@ -90,19 +90,19 @@ export const PostDetails: React.FC<Props> = ({
               );
             })}
 
-          {!writeCommen && !errorLoadComments && !loadingComments && (
+          {!writeComment && !errorLoadComments && !loadingComments && (
             <button
               data-cy="WriteCommentButton"
               type="button"
               className="button is-link"
-              onClick={() => setWriteCommen(true)}
+              onClick={() => setWriteComment(true)}
             >
               Write a comment
             </button>
           )}
         </div>
 
-        {writeCommen && (
+        {writeComment && (
           <NewCommentForm
             postId={post?.id}
             comments={comments}

diff --git a/src/components/PostsList.tsx b/src/components/PostsList.tsx
@@ -6,7 +6,7 @@ type Props = {
   openPostDetails: number;
   setOpenPostDetails: (openPostDetails: number) => void;
   getCommentsPost: (post: Post) => void;
-  setWriteCommen: (writeCommen: boolean) => void;
+  setWriteComment: (writeComment: boolean) => void;
 };
 
 export const PostsList: React.FC<Props> = ({
@@ -15,7 +15,7 @@ export const PostsList: React.FC<Props> = ({
   openPostDetails,
   setOpenPostDetails,
   getCommentsPost,
-  setWriteCommen,
+  setWriteComment,
 }) => (
   <div data-cy="PostsList">
     <p className="title">Posts:</p>
@@ -48,7 +48,7 @@ export const PostsList: React.FC<Props> = ({
                     className="button is-link"
                     onClick={() => {
                       setOpenPostDetails(0);
-                      setWriteCommen(false);
+                      setWriteComment(false);
                     }}
                   >
                     Close
@@ -62,7 +62,7 @@ export const PostsList: React.FC<Props> = ({
                       setOpenPostDetails(id);
                       getCommentsPost(post);
                       setPost(post);
-                      setWriteCommen(false);
+                      setWriteComment(false);
                     }}
                   >
                     Open

diff --git a/src/components/UserSelector.tsx b/src/components/UserSelector.tsx
@@ -1,16 +1,17 @@
 import React, { useState } from 'react';
 import { User } from '../types/User';
 import classNames from 'classnames';
+import { Post } from '../types/Post';
 
 type Props = {
   users: User[];
   userSelected: User | null;
   setUserSelected: (userSelected: User) => void;
   getPostUser: (user: User) => void;
   setOpenPostDetails: (openPostDetails: number) => void;
-  setWriteCommen: (writeCommen: boolean) => void;
-  setPosts: ([]) => void;
-  setPost: (post: null) => void;
+  setWriteComment: (writeComment: boolean) => void;
+  setPosts: (posts: Post[]) => void;
+  setPost: (post: Post | null) => void;
 };
 
 export const UserSelector: React.FC<Props> = ({
@@ -19,7 +20,7 @@ export const UserSelector: React.FC<Props> = ({
   setUserSelected,
   getPostUser,
   setOpenPostDetails,
-  setWriteCommen,
+  setWriteComment,
   setPosts,
   setPost,
 }) => {
@@ -65,7 +66,7 @@ export const UserSelector: React.FC<Props> = ({
                 setClickedDropdown(false);
                 getPostUser(user);
                 setOpenPostDetails(0);
-                setWriteCommen(false);
+                setWriteComment(false);
                 setPosts([]);
                 setPost(null);
               }}