Agregada vista de artista

src/components/Search.jsx

@@ -4,31 +4,10 @@ import queryString from "query-string";
 import {searchArtist, searchDisc, searchSong} from "../services/search_service";
 import {SearchBar} from "./SearchBar";
 import {Paginate} from "./Paginate";
+import {CoverArt} from "./CoverArt";
 import {Link} from "react-router-dom";
 import {Tab, TabList, TabPanel, Tabs} from "react-tabs";
 
-import {ReactComponent as DiscSVG} from "../svg/disc.svg";
-
-const CoverArt = (props) => {
-    const [loading, setLoading] = useState(true);
-
-    const handleLoad = () => setLoading(false)
-
-    if (props.cover_art) {
-        if (loading) {
-            return (
-                <Fragment>
-                    <img src={props.cover_art.image} className={'coverart loading'} alt={props.alt} onLoad={handleLoad}/>
-                    <DiscSVG className='coverart'/>
-                </Fragment>
-            )
-        } else {
-            return <img src={props.cover_art.image} className={'coverart'} alt={props.alt}/>
-        }
-    } else {
-        return <DiscSVG className='coverart'/>
-    }
-}
 
 const SearchPlaceholder = (props) => {
     return (
@@ -109,7 +88,9 @@ const SearchDisc = (props) => {
     return (
         <li className='disc'>
             <Link to={`/disc/${disc.id}`}>
-                <CoverArt cover_art={disc.cover_art} alt={`Cover del disco: ${disc.title}`}/>
+                <div className={'cover-container'}>
+                    <CoverArt cover_art={disc.cover_art} alt={`Cover del disco: ${disc.title}`}/>
+                </div>
                 <div className='description'>
                     <span>{disc.title}</span>
                     <span className='small'>{disc.artist[0].name}</span>