build(ui): migrate from CRA/Jest to Vite/Vitest (#3311)

* feat: create vite project * feat: it's alive! * feat: `make dev` working! * feat: replace custom serviceWorker with vite plugin * test: replace Jest with Vitest * fix: run prettier * fix: skip eslint for now. * chore: remove ui.old folder * refactor: replace lodash.pick with simple destructuring * fix: eslint errors (wip) * fix: eslint errors (wip) * fix: display-name eslint errors (wip) * fix: no-console eslint errors (wip) * fix: react-refresh/only-export-components eslint errors (wip) * fix: react-refresh/only-export-components eslint errors (wip) * fix: react-refresh/only-export-components eslint errors (wip) * fix: react-refresh/only-export-components eslint errors (wip) * fix: build * fix: pwa manifest * refactor: pwa manifest * refactor: simplify PORT configuration * refactor: rename simple JS files * test: cover playlistUtils * fix: react-image-lightbox * feat(ui): add sourcemaps to help debug issues
2024-09-28 11:54:36 -04:00
parent dd48a23f92
commit fcdd30ba8f
212 changed files with 6231 additions and 31060 deletions
@@ -0,0 +1,61 @@
+import React from 'react'
+import PropTypes from 'prop-types'
+import PlayArrowIcon from '@material-ui/icons/PlayArrow'
+import { IconButton } from '@material-ui/core'
+import { useDispatch } from 'react-redux'
+import { useDataProvider } from 'react-admin'
+import { playTracks } from '../actions'
+
+export const PlayButton = ({ record, size, className }) => {
+  let extractSongsData = function (response) {
+    const data = response.data.reduce(
+      (acc, cur) => ({ ...acc, [cur.id]: cur }),
+      {},
+    )
+    const ids = response.data.map((r) => r.id)
+    return { data, ids }
+  }
+  const dataProvider = useDataProvider()
+  const dispatch = useDispatch()
+  const playAlbum = (record) => {
+    dataProvider
+      .getList('song', {
+        pagination: { page: 1, perPage: -1 },
+        sort: { field: 'trackNumber', order: 'ASC' },
+        filter: {
+          album_id: record.id,
+          release_date: record.releaseDate,
+          disc_number: record.discNumber,
+        },
+      })
+      .then((response) => {
+        let { data, ids } = extractSongsData(response)
+        dispatch(playTracks(data, ids))
+      })
+  }
+
+  return (
+    <IconButton
+      onClick={(e) => {
+        e.stopPropagation()
+        e.preventDefault()
+        playAlbum(record)
+      }}
+      aria-label="play"
+      className={className}
+      size={size}
+    >
+      <PlayArrowIcon fontSize={size} />
+    </IconButton>
+  )
+}
+
+PlayButton.propTypes = {
+  record: PropTypes.object.isRequired,
+  size: PropTypes.string,
+  className: PropTypes.string,
+}
+
+PlayButton.defaultProps = {
+  size: 'small',
+}