Implement special selection feature in CuratorPageClient
- Added a new section for curators to select specials associated with their account. - Introduced checkboxes for editing special selections, allowing for dynamic updates. - Updated the display logic for specials to differentiate between selected and unselected items.
This commit is contained in:
@@ -1316,6 +1316,41 @@ export default function CuratorPageClient() {
|
||||
: genre.name?.de ?? genre.name?.en}
|
||||
</label>
|
||||
))}
|
||||
{specials
|
||||
.filter(s => curatorInfo?.specialIds?.includes(s.id))
|
||||
.map(special => (
|
||||
<label
|
||||
key={special.id}
|
||||
style={{
|
||||
display: 'flex',
|
||||
alignItems: 'center',
|
||||
gap: '0.25rem',
|
||||
padding: '0.15rem 0.4rem',
|
||||
borderRadius: '999px',
|
||||
background: editSpecialIds.includes(special.id)
|
||||
? '#fee2e2'
|
||||
: '#f3f4f6',
|
||||
fontSize: '0.8rem',
|
||||
cursor: 'pointer',
|
||||
}}
|
||||
>
|
||||
<input
|
||||
type="checkbox"
|
||||
checked={editSpecialIds.includes(special.id)}
|
||||
onChange={() =>
|
||||
setEditSpecialIds(prev =>
|
||||
prev.includes(special.id)
|
||||
? prev.filter(id => id !== special.id)
|
||||
: [...prev, special.id]
|
||||
)
|
||||
}
|
||||
/>
|
||||
★{' '}
|
||||
{typeof special.name === 'string'
|
||||
? special.name
|
||||
: special.name?.de ?? special.name?.en}
|
||||
</label>
|
||||
))}
|
||||
</div>
|
||||
<div style={{ display: 'flex', flexWrap: 'wrap', gap: '0.25rem' }}>
|
||||
{song.genres
|
||||
@@ -1337,21 +1372,26 @@ export default function CuratorPageClient() {
|
||||
: g.name?.de ?? g.name?.en}
|
||||
</span>
|
||||
))}
|
||||
{song.specials.map(s => (
|
||||
<span
|
||||
key={`s-${s.id}`}
|
||||
style={{
|
||||
padding: '0.1rem 0.4rem',
|
||||
borderRadius: '999px',
|
||||
background: '#fee2e2',
|
||||
fontSize: '0.8rem',
|
||||
}}
|
||||
>
|
||||
{typeof s.name === 'string'
|
||||
? s.name
|
||||
: s.name?.de ?? s.name?.en}
|
||||
</span>
|
||||
))}
|
||||
{song.specials
|
||||
.filter(
|
||||
s => !curatorInfo?.specialIds?.includes(s.id)
|
||||
)
|
||||
.map(s => (
|
||||
<span
|
||||
key={`fixed-s-${s.id}`}
|
||||
style={{
|
||||
padding: '0.1rem 0.4rem',
|
||||
borderRadius: '999px',
|
||||
background: '#fee2e2',
|
||||
fontSize: '0.8rem',
|
||||
}}
|
||||
>
|
||||
★{' '}
|
||||
{typeof s.name === 'string'
|
||||
? s.name
|
||||
: s.name?.de ?? s.name?.en}
|
||||
</span>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
) : (
|
||||
|
||||
Reference in New Issue
Block a user