Get lossless format list from server

ui/src/common/QualityInfo.js

@@ -1,16 +1,24 @@
 import React from 'react'
 import PropTypes from 'prop-types'
 import Chip from '@material-ui/core/Chip'
-import { LOSSLESS_FORMATS } from '../consts'
+import config from '../config'
 
-export const QualityInfo = ({ record, size, ...rest }) => {
-  let { suffix = 'NO_SUFFIX', bitRate = 'NO_BITRATE' } = record
-  suffix = suffix.toUpperCase()
-  let info = suffix
-  if (!LOSSLESS_FORMATS.includes(suffix)) {
-    info += ' ' + bitRate
+const llFormats = new Set(config.losslessFormats.split(','))
+const placeholder = 'N/A'
+
+export const QualityInfo = ({ record, ...rest }) => {
+  let { suffix, bitRate } = record
+  let info = placeholder
+
+  if (suffix) {
+    suffix = suffix.toUpperCase()
+    info = suffix
+    if (!llFormats.has(suffix)) {
+      info += ' ' + bitRate
+    }
   }
-  return <Chip {...rest} size={size} variant="outlined" label={info} />
+
+  return <Chip {...rest} variant="outlined" label={info} />
 }
 
 QualityInfo.propTypes = {

ui/src/common/QualityInfo.test.js

@@ -5,76 +5,23 @@ import { QualityInfo } from './QualityInfo'
 describe('<QualityInfo />', () => {
   afterEach(cleanup)
 
-  it('only render FLAC', () => {
-    const info = { suffix: 'FLAC', bitRate: 108 }
-    const { getByText } = render(<QualityInfo record={info} />)
-    const format = getByText('FLAC')
-    expect(format.innerHTML).toEqual('FLAC')
+  it('only render suffix for lossless formats', () => {
+    const info = { suffix: 'FLAC', bitRate: 1008 }
+    const { queryByText } = render(<QualityInfo record={info} />)
+    expect(queryByText('FLAC')).not.toBeNull()
   })
-  it('only render WAV', () => {
-    const info = { suffix: 'WAV', bitRate: 108 }
-    const { getByText } = render(<QualityInfo record={info} />)
-    const format = getByText('WAV')
-    expect(format.innerHTML).toEqual('WAV')
+  it('only render suffix and bitrate for lossy formats', () => {
+    const info = { suffix: 'MP3', bitRate: 320 }
+    const { queryByText } = render(<QualityInfo record={info} />)
+    expect(queryByText('MP3 320')).not.toBeNull()
   })
-  it('only render DSF', () => {
-    const info = { suffix: 'DSF', bitRate: 108 }
-    const { getByText } = render(<QualityInfo record={info} />)
-    const format = getByText('DSF')
-    expect(format.innerHTML).toEqual('DSF')
-  })
-  it('only render ALAC', () => {
-    const info = { suffix: 'ALAC', bitRate: 108 }
-    const { getByText } = render(<QualityInfo record={info} />)
-    const format = getByText('ALAC')
-    expect(format.innerHTML).toEqual('ALAC')
-  })
-  it('only render TTA', () => {
-    const info = { suffix: 'TTA', bitRate: 108 }
-    const { getByText } = render(<QualityInfo record={info} />)
-    const format = getByText('TTA')
-    expect(format.innerHTML).toEqual('TTA')
-  })
-  it('only render ATRAC', () => {
-    const info = { suffix: 'ATRAC', bitRate: 108 }
-    const { getByText } = render(<QualityInfo record={info} />)
-    const format = getByText('ATRAC')
-    expect(format.innerHTML).toEqual('ATRAC')
-  })
-  it('only render SHN', () => {
-    const info = { suffix: 'SHN', bitRate: 108 }
-    const { getByText } = render(<QualityInfo record={info} />)
-    const format = getByText('SHN')
-    expect(format.innerHTML).toEqual('SHN')
-  })
-  it('only render OCG 108', () => {
-    const info = { suffix: 'OCG', bitRate: 108 }
-    const { getByText } = render(<QualityInfo record={info} />)
-    const format = getByText('OCG 108')
-    expect(format.innerHTML).toEqual('OCG 108')
-  })
-  it('only render MP3 108', () => {
-    const info = { suffix: 'MP3', bitRate: 108 }
-    const { getByText } = render(<QualityInfo record={info} />)
-    const format = getByText('MP3 108')
-    expect(format.innerHTML).toEqual('MP3 108')
-  })
-  it('only render AAC 108', () => {
-    const info = { suffix: 'AAC', bitRate: 108 }
-    const { getByText } = render(<QualityInfo record={info} />)
-    const format = getByText('AAC 108')
-    expect(format.innerHTML).toEqual('AAC 108')
-  })
-  it('only render OPUS 108', () => {
-    const info = { suffix: 'OPUS', bitRate: 108 }
-    const { getByText } = render(<QualityInfo record={info} />)
-    const format = getByText('OPUS 108')
-    expect(format.innerHTML).toEqual('OPUS 108')
-  })
-  it('render nothing', () => {
+  it('renders placeholder if suffix is missing', () => {
     const info = {}
-    const { getByText } = render(<QualityInfo record={info} />)
-    const format = getByText('NO_SUFFIX NO_BITRATE')
-    expect(format.innerHTML).toEqual('NO_SUFFIX NO_BITRATE')
+    const { queryByText } = render(<QualityInfo record={info} />)
+    expect(queryByText('N/A')).not.toBeNull()
+  })
+  it('does not break if record is null', () => {
+    const { queryByText } = render(<QualityInfo />)
+    expect(queryByText('N/A')).not.toBeNull()
   })
 })