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

components/files/kits-dialog.js

@@ -21,7 +21,7 @@ const PLATFORM_ICON = {
   kDrive: CloudDownloadIcon,
 }
 
-export default function StemsDialog({stems}) {
+export default function KitsDialog({kits}) {
   const [open, setOpen] = useState(false)
   const theme = useTheme()
   const fullScreen = useMediaQuery(theme.breakpoints.down('md'))
@@ -37,26 +37,26 @@ export default function StemsDialog({stems}) {
   return (
     <>
       <Button endIcon={<CloudDownloadIcon />} sx={{marginBottom: 2}} variant='outlined' onClick={handleClickOpen}>
-        Stems
+        Kits
       </Button>
       <Dialog
         fullScreen={fullScreen}
         open={open}
-        aria-labelledby='StemsDialog'
+        aria-labelledby='KitsDialog'
         onClose={handleClose}
       >
-        <DialogTitle>Télécharger les stems</DialogTitle>
+        <DialogTitle>Télécharger un kit</DialogTitle>
         <DialogContent dividers>
           <List>
-            {stems.map((stem, index) => {
-              const PlatformIcon = PLATFORM_ICON[stem.plateforme] ?? CloudDownloadIcon
+            {kits.map((kit, index) => {
+              const PlatformIcon = PLATFORM_ICON[kit.plateforme] ?? CloudDownloadIcon
               return (
                 <ListItem key={index} disablePadding>
-                  <ListItemButton component='a' href={stem.url} target='_blank' rel='noopener noreferrer'>
+                  <ListItemButton component='a' href={kit.url} target='_blank' rel='noopener noreferrer'>
                     <ListItemIcon>
                       <PlatformIcon />
                     </ListItemIcon>
-                    <ListItemText primary={stem.plateforme} />
+                    <ListItemText primary={kit.type} secondary={kit.plateforme} />
                   </ListItemButton>
                 </ListItem>
               )
@@ -73,6 +73,6 @@ export default function StemsDialog({stems}) {
   )
 }
 
-StemsDialog.propTypes = {
-  stems: PropTypes.array.isRequired
+KitsDialog.propTypes = {
+  kits: PropTypes.array.isRequired
 }

components/teks/teks.js

@@ -23,7 +23,7 @@ import {formatKuveti} from '../../lib/kuveti'
 
 import LicenseModal from '../cc/license-modal'
 import FilesDialog from '../files/files-dialog'
-import StemsDialog from '../files/stems-dialog'
+import KitsDialog from '../files/kits-dialog'
 import {StreamButton} from '../streaming-buttons'
 import EntegreMizik from './entegre-mizik'
 import OkiMizik from './oki-mizik'
@@ -185,13 +185,13 @@ export default function Teks({parole}) {
             <LicenseModal license={parole.creativeCommons.toLowerCase()} sourceOriginale={parole.sourceOriginale ?? null} remixes={parole.remixes?.length ? parole.remixes : null} />
           </Box>
         )}
-        {(parole?.files || (parole.creativeCommons && parole.stems?.length > 0)) && (
+        {(parole?.files || (parole.creativeCommons && parole.kits?.length > 0)) && (
           <Box sx={{display: 'flex', flexWrap: 'wrap', justifyContent: 'center', gap: 1}}>
             {parole?.files && (
               <FilesDialog files={parole.files} />
             )}
-            {parole.creativeCommons && parole.stems?.length > 0 && (
-              <StemsDialog stems={parole.stems} />
+            {parole.creativeCommons && parole.kits?.length > 0 && (
+              <KitsDialog kits={parole.kits} />
             )}
           </Box>
         )}