Add Song of the Day filter and badges to Admin Song Library
This commit is contained in:
@@ -21,6 +21,14 @@ interface Genre {
|
||||
};
|
||||
}
|
||||
|
||||
interface DailyPuzzle {
|
||||
id: number;
|
||||
date: string;
|
||||
songId: number;
|
||||
genreId: number | null;
|
||||
specialId: number | null;
|
||||
}
|
||||
|
||||
interface Song {
|
||||
id: number;
|
||||
title: string;
|
||||
@@ -28,6 +36,7 @@ interface Song {
|
||||
filename: string;
|
||||
createdAt: string;
|
||||
activations: number;
|
||||
puzzles: DailyPuzzle[];
|
||||
genres: Genre[];
|
||||
specials: Special[];
|
||||
}
|
||||
@@ -535,6 +544,9 @@ export default function AdminPage() {
|
||||
} else if (selectedGenreFilter.startsWith('special:')) {
|
||||
const specialId = Number(selectedGenreFilter.split(':')[1]);
|
||||
matchesFilter = song.specials?.some(s => s.id === specialId) || false;
|
||||
} else if (selectedGenreFilter === 'daily') {
|
||||
const today = new Date().toISOString().split('T')[0];
|
||||
matchesFilter = song.puzzles?.some(p => p.date === today) || false;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -863,6 +875,7 @@ export default function AdminPage() {
|
||||
style={{ minWidth: '150px' }}
|
||||
>
|
||||
<option value="">All Content</option>
|
||||
<option value="daily">📅 Song of the Day</option>
|
||||
<optgroup label="Genres">
|
||||
<option value="genre:-1">No Genre</option>
|
||||
{genres.map(genre => (
|
||||
@@ -1020,8 +1033,40 @@ export default function AdminPage() {
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
<td style={{ padding: '0.75rem', fontWeight: 'bold' }}>{song.title}</td>
|
||||
<td style={{ padding: '0.75rem' }}>{song.artist}</td>
|
||||
<td style={{ padding: '0.75rem' }}>
|
||||
<div style={{ fontWeight: 'bold', color: '#111827' }}>{song.title}</div>
|
||||
<div style={{ fontSize: '0.875rem', color: '#6b7280' }}>{song.artist}</div>
|
||||
|
||||
{/* Daily Puzzle Badges */}
|
||||
<div style={{ display: 'flex', flexWrap: 'wrap', gap: '0.25rem', marginTop: '0.25rem' }}>
|
||||
{song.puzzles?.filter(p => p.date === new Date().toISOString().split('T')[0]).map(p => {
|
||||
if (!p.genreId && !p.specialId) {
|
||||
return (
|
||||
<span key={p.id} style={{ background: '#dbeafe', color: '#1e40af', padding: '0.1rem 0.4rem', borderRadius: '0.25rem', fontSize: '0.7rem', border: '1px solid #93c5fd' }}>
|
||||
🌍 Global Daily
|
||||
</span>
|
||||
);
|
||||
}
|
||||
if (p.genreId) {
|
||||
const genreName = genres.find(g => g.id === p.genreId)?.name;
|
||||
return (
|
||||
<span key={p.id} style={{ background: '#f3f4f6', color: '#374151', padding: '0.1rem 0.4rem', borderRadius: '0.25rem', fontSize: '0.7rem', border: '1px solid #d1d5db' }}>
|
||||
🏷️ {genreName} Daily
|
||||
</span>
|
||||
);
|
||||
}
|
||||
if (p.specialId) {
|
||||
const specialName = specials.find(s => s.id === p.specialId)?.name;
|
||||
return (
|
||||
<span key={p.id} style={{ background: '#fce7f3', color: '#be185d', padding: '0.1rem 0.4rem', borderRadius: '0.25rem', fontSize: '0.7rem', border: '1px solid #fbcfe8' }}>
|
||||
★ {specialName} Daily
|
||||
</span>
|
||||
);
|
||||
}
|
||||
return null;
|
||||
})}
|
||||
</div>
|
||||
</td>
|
||||
<td style={{ padding: '0.75rem' }}>
|
||||
<div style={{ display: 'flex', flexWrap: 'wrap', gap: '0.25rem' }}>
|
||||
{song.genres?.map(g => (
|
||||
|
||||
Reference in New Issue
Block a user