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:
Hördle Bot
2025-12-04 00:14:27 +01:00
parent 91b12ad859
commit afe6e12afc

View File

@@ -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>
) : (