DiscSeparator DiscSeparator.tsx

62.5% Statements 5/8

0% Branches 0/2

0% Functions 0/1

83.33% Lines 5/6

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
19x
19x
 
19x
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
19x
  import { ReactElement } from "react";
 
import { Disc } from "components/icons";
import { useTranslations } from "hooks";
import { templateReplace } from "utils";
 
export const DiscSeparator = ({
  discNumber,
  style,
}: {
  discNumber?: number;
  style: React.CSSProperties;
}): ReactElement => {
  const { translations } = useTranslations();
  return (
    <div style={style}>
      <Disc width={16} />{" "}
      {templateReplace(translations.playlistHeader.disc, {
        number: discNumber ?? "0",
      })}
      <style jsx>{`
        div {
          padding: 12px 16px;
          font-size: 14px;
          font-weight: 600;
          display: flex;
          gap: 8px;
          align-items: center;
        }
      `}</style>
    </div>
  );
};
 
export default DiscSeparator;