TopTracks TopTracks.tsx

20% Statements 1/5

0% Branches 0/1

0% Functions 0/2

25% Lines 1/4

Press n or j to go to the next uncovered block, b, p or k for the previous block.


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36  
 
19x
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
  import { ReactElement } from "react";
 
import { Grid, Heading, SingleTrackCard } from "components";
import { ITrack } from "types/spotify";
 
interface TopTracksProps {
  topTracks: ITrack[];
  heading: string;
}
 
export default function TopTracks({
  heading,
  topTracks,
}: Readonly<TopTracksProps>): ReactElement {
  return (
    <>
      <Heading number={2}>{heading}</Heading>
      <div>
        <Grid minWidthItem="max(190px, 25%)" marginBottom="50px">
          {topTracks?.map((track, i) => {
            Iif (i >= 9) return null;
            return <SingleTrackCard key={track.id} track={track} />;
          })}
        </Grid>
      </div>
      <style jsx>{`
        @media screen and (max-width: 768px) {
          div {
            padding: 0 8px;
          }
        }
      `}</style>
    </>
  );
}