fix

mate-academy · Oct 24, 2024 · c30b374 · c30b374
1 parent 69421ae
commit c30b374
Show file tree

Hide file tree

Showing 5 changed files with 10 additions and 13 deletions.
diff --git a/src/App.tsx b/src/App.tsx
@@ -79,7 +79,7 @@ export const App = () => {
                 {!postsIsLoading && posts.length > 0 && (
                   <PostsList
                     posts={posts}
-                    choosenPost={chosenPost}
+                    chosenPost={chosenPost}
                     onSelect={setChosenPost}
                   />
                 )}

diff --git a/src/components/NewCommentForm.tsx b/src/components/NewCommentForm.tsx
@@ -134,7 +134,7 @@ export const NewCommentForm: React.FC<Props> = ({ post, addComment }) => {
           <input
             value={email}
             onChange={handleEmailChange}
-            type="text"
+            type="email"
             name="email"
             id="comment-author-email"
             placeholder="email@test.com"

diff --git a/src/components/PostDetails.tsx b/src/components/PostDetails.tsx
@@ -89,7 +89,7 @@ export const PostDetails: React.FC<Props> = ({ post }) => {
                         type="button"
                         className="delete is-small"
                         aria-label="delete"
-                        onClick={() => removeComment(id)}
+                        onClick={() => removeComment(comment.id)}
                       >
                         {/* delete button */}
                       </button>

diff --git a/src/components/PostsList.tsx b/src/components/PostsList.tsx
@@ -4,15 +4,11 @@ import { Post } from '../types/Post';
 
 type Props = {
   posts: Post[];
-  choosenPost: Post | null;
+  chosenPost: Post | null;
   onSelect: (v: Post | null) => void;
 };
 
-export const PostsList: React.FC<Props> = ({
-  posts,
-  choosenPost,
-  onSelect,
-}) => {
+export const PostsList: React.FC<Props> = ({ posts, chosenPost, onSelect }) => {
   return (
     <div data-cy="PostsList">
       <p className="title">Posts:</p>
@@ -39,13 +35,13 @@ export const PostsList: React.FC<Props> = ({
                   type="button"
                   data-cy="PostButton"
                   className={cn('button is-link', {
-                    'is-light': choosenPost?.id !== post.id,
+                    'is-light': chosenPost?.id !== post.id,
                   })}
                   onClick={() =>
-                    onSelect(choosenPost?.id === post.id ? null : post)
+                    onSelect(chosenPost?.id === post.id ? null : post)
                   }
                 >
-                  {choosenPost?.id === post.id ? 'Close' : 'Open'}
+                  {chosenPost?.id === post.id ? 'Close' : 'Open'}
                 </button>
               </td>
             </tr>

diff --git a/src/components/UserSelector.tsx b/src/components/UserSelector.tsx
@@ -46,7 +46,7 @@ export const UserSelector: React.FC<Props> = ({
     const currentUser = e.target as HTMLAnchorElement;
 
     if (currentUser.tagName === 'A') {
-      const userId = +currentUser.href.split('-').slice(-1)[0];
+      const userId = Number(currentUser.getAttribute('data-user-id'));
 
       onSelect(users.find(user => user.id === userId) || null);
       setMenuActive(false);
@@ -86,6 +86,7 @@ export const UserSelector: React.FC<Props> = ({
               className={cn('dropdown-item', {
                 'is-active': user.id === selectedUser?.id,
               })}
+              data-user-id={user.id}
               key={user.id}
             >
               {user.name}