PlaylistTopBarExtraField PlaylistTopBarExtraField.tsx

50% Statements 2/4

100% Branches 0/0

0% Functions 0/1

50% Lines 2/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
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52  
 
19x
19x
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
  import { ReactElement } from "react";
 
import { PlayButton } from "components";
import { useSpotify } from "hooks";
import { ITrack } from "types/spotify";
 
interface PlaylistTopBarExtraFieldProps {
  isSingle?: boolean;
  track?: ITrack;
  uri?: string;
}
 
export default function PlaylistTopBarExtraField({
  isSingle,
  track,
  uri,
}: PlaylistTopBarExtraFieldProps): ReactElement {
  const { pageDetails, allTracks } = useSpotify();
  return (
    <div>
      <PlayButton
        uri={uri}
        size={40}
        centerSize={16}
        isSingle={isSingle}
        track={track}
        allTracks={allTracks}
      />
      <span>{pageDetails?.name}</span>
      <style jsx>{`
        span {
          color: #fff;
          font-size: 22px;
          font-weight: 700;
          letter-spacing: -0.04em;
          line-height: 28px;
          overflow: hidden;
          padding: 0 16px;
          text-overflow: ellipsis;
          pointer-events: none;
        }
        div {
          align-items: center;
          display: flex;
          white-space: nowrap;
          max-width: 100%;
        }
      `}</style>
    </div>
  );
}