refactor: generaliser stems en kits (type Stems/Acapella+Instru)

2026-07-03 16:57:44 +04:00
parent daa3510d73
commit 55967bfc3c
3 changed files with 15 additions and 15 deletions
@@ -0,0 +1,78 @@
+import {useState} from 'react'
+import PropTypes from 'prop-types'
+import Button from '@mui/material/Button'
+import Dialog from '@mui/material/Dialog'
+import DialogActions from '@mui/material/DialogActions'
+import DialogContent from '@mui/material/DialogContent'
+import DialogTitle from '@mui/material/DialogTitle'
+import List from '@mui/material/List'
+import ListItem from '@mui/material/ListItem'
+import ListItemButton from '@mui/material/ListItemButton'
+import ListItemIcon from '@mui/material/ListItemIcon'
+import ListItemText from '@mui/material/ListItemText'
+import useMediaQuery from '@mui/material/useMediaQuery'
+import {useTheme} from '@mui/material/styles'
+
+import CloudDownloadIcon from '@mui/icons-material/CloudDownload'
+import {Nextcloud} from '@icons-pack/react-simple-icons'
+
+const PLATFORM_ICON = {
+  NIYAJ: Nextcloud,
+  kDrive: CloudDownloadIcon,
+}
+
+export default function KitsDialog({kits}) {
+  const [open, setOpen] = useState(false)
+  const theme = useTheme()
+  const fullScreen = useMediaQuery(theme.breakpoints.down('md'))
+
+  const handleClickOpen = () => {
+    setOpen(true)
+  }
+
+  const handleClose = () => {
+    setOpen(false)
+  }
+
+  return (
+    <>
+      <Button endIcon={<CloudDownloadIcon />} sx={{marginBottom: 2}} variant='outlined' onClick={handleClickOpen}>
+        Kits
+      </Button>
+      <Dialog
+        fullScreen={fullScreen}
+        open={open}
+        aria-labelledby='KitsDialog'
+        onClose={handleClose}
+      >
+        <DialogTitle>Télécharger un kit</DialogTitle>
+        <DialogContent dividers>
+          <List>
+            {kits.map((kit, index) => {
+              const PlatformIcon = PLATFORM_ICON[kit.plateforme] ?? CloudDownloadIcon
+              return (
+                <ListItem key={index} disablePadding>
+                  <ListItemButton component='a' href={kit.url} target='_blank' rel='noopener noreferrer'>
+                    <ListItemIcon>
+                      <PlatformIcon />
+                    </ListItemIcon>
+                    <ListItemText primary={kit.type} secondary={kit.plateforme} />
+                  </ListItemButton>
+                </ListItem>
+              )
+            })}
+          </List>
+        </DialogContent>
+        <DialogActions>
+          <Button autoFocus onClick={handleClose}>
+            Fermer
+          </Button>
+        </DialogActions>
+      </Dialog>
+    </>
+  )
+}
+
+KitsDialog.propTypes = {
+  kits: PropTypes.array.isRequired
+}