Files
pawol.nu/components/streaming-buttons.js
T
cedric 5a6273e9e3
Déploiement FRONT PROD / check (push) Successful in 2m11s
Déploiement FRONT PROD / deploy (push) Successful in 18s
feat: display stream links on teks
2026-06-22 12:56:29 +04:00

42 lines
1.7 KiB
JavaScript

'use client'
import Button from '@mui/material/Button'
import OpenInNewIcon from '@mui/icons-material/OpenInNew'
import {Spotify, Applemusic, Deezer, Tidal, Youtubemusic, Amazon, Soundcloud} from '@icons-pack/react-simple-icons'
export const PLATFORM_CONFIG = {
Spotify: {label: 'Spotify', bg: '#1DB954', color: '#fff', Icon: Spotify},
Applemusic: {label: 'Apple Music', bg: '#FC3C44', color: '#fff', Icon: Applemusic},
Deezer: {label: 'Deezer', bg: '#EF5466', color: '#fff', Icon: Deezer},
Tidal: {label: 'Tidal', bg: '#000000', color: '#fff', Icon: Tidal},
Qobuz: {label: 'Qobuz', bg: '#00245B', color: '#fff', Icon: null},
Youtubemusic: {label: 'YouTube Music', bg: '#FF0000', color: '#fff', Icon: Youtubemusic},
Amazon: {label: 'Amazon Music', bg: '#00A8E1', color: '#fff', Icon: Amazon},
Soundcloud: {label: 'SoundCloud', bg: '#FF5500', color: '#fff', Icon: Soundcloud},
}
export function StreamButton({lyen}) {
const config = PLATFORM_CONFIG[lyen.plateforme] ?? {label: lyen.plateforme, bg: '#555', color: '#fff', Icon: null}
const PlatformIcon = config.Icon
return (
<Button
href={lyen.url}
target='_blank'
rel='noopener noreferrer'
size='small'
startIcon={PlatformIcon ? <PlatformIcon size={16} color={config.color} /> : null}
endIcon={<OpenInNewIcon sx={{fontSize: 11}} />}
sx={{
bgcolor: config.bg,
color: config.color,
fontWeight: 700,
fontSize: '0.72rem',
textTransform: 'none',
'&:hover': {bgcolor: config.bg, opacity: 0.85},
}}
>
{config.label}
</Button>
)
}