Make name clickable

js/components/FavoriteBar.js

@@ -119,13 +119,21 @@ export function FavoriteBar({teams}) {
                 )}
                 <div>
                     {filteredTeams.map(team => (
-                        <div key={team.id} style={{display: 'flex', alignItems: 'center'}}>
-                            <Button onClick={() => toggleFavorite(team)} style={{marginRight: '10px'}}>
+                        <div
+                            key={team.id}
+                            onClick={() => toggleFavorite(team)}
+                            style={{display: 'flex', alignItems: 'center', cursor: 'pointer'}}
+                        >
+                            <Button
+                                onClick={e => {
+                                    e.stopPropagation();
+                                    toggleFavorite(team);
+                                }}
+                                style={{marginRight: '10px'}}
+                            >
                                 {favorite && favorite.id === team.id ? <FaHeart/> : <FaRegHeart/>}
                             </Button>
-                            <span>
-                                {team.name}
-                            </span>
+                            <span>{team.name}</span>
                         </div>
                     ))}
                 </div>