add task solution

mate-academy · Aug 29, 2024 · c05b516 · c05b516
1 parent 9eec5b8
commit c05b516
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 14 deletions.
diff --git a/src/components/PostDetails.tsx b/src/components/PostDetails.tsx
@@ -65,7 +65,7 @@ export const PostDetails: React.FC<Props> = ({ post }) => {
             </div>
           )}
 
-          {!comments.length && !isError && isLoading && (
+          {!comments.length && !isError && !isLoading && (
             <p className="title is-4" data-cy="NoCommentsMessage">
               No comments yet
             </p>

diff --git a/src/components/UserSelector.tsx b/src/components/UserSelector.tsx
@@ -18,27 +18,29 @@ export const UserSelector: React.FC<Props> = ({
 }) => {
   const [focused, setFocused] = useState(false);
 
-  const onFocused = () => {
-    if (focused) {
-      setFocused(false);
-    } else {
-      setFocused(true);
-    }
+  const toggleDropdown = () => {
+    setFocused(prev => !prev);
+  };
+
+  const handleUserSelect = (user: User) => {
+    setSelectedUser(user);
+    setFocused(false);
+    setSelectedPost(null);
   };
 
   return (
     <div
       data-cy="UserSelector"
       className={cn('dropdown', { 'is-active': focused })}
+      onBlur={() => setFocused(false)}
     >
       <div className="dropdown-trigger">
         <button
           type="button"
           className="button"
           aria-haspopup="true"
           aria-controls="dropdown-menu"
-          onClick={onFocused}
-          onBlur={() => setFocused(false)}
+          onClick={toggleDropdown}
         >
           {selectedUser ? (
             <span>{selectedUser.name}</span>
@@ -64,11 +66,7 @@ export const UserSelector: React.FC<Props> = ({
                   'is-active': selectedUser?.id === id,
                 })}
                 key={id}
-                onClick={() => {
-                  setSelectedUser(user);
-                  setFocused(false);
-                  setSelectedPost(null);
-                }}
+                onClick={() => handleUserSelect(user)}
               >
                 {name}
               </a>