feat(admin): add persistent login and improve audio playback error handling
This commit is contained in:
@@ -39,12 +39,22 @@ export default function AdminPage() {
|
||||
const [playingSongId, setPlayingSongId] = useState<number | null>(null);
|
||||
const [audioElement, setAudioElement] = useState<HTMLAudioElement | null>(null);
|
||||
|
||||
// Check for existing auth on mount
|
||||
useEffect(() => {
|
||||
const authToken = localStorage.getItem('hoerdle_admin_auth');
|
||||
if (authToken === 'authenticated') {
|
||||
setIsAuthenticated(true);
|
||||
fetchSongs();
|
||||
}
|
||||
}, []);
|
||||
|
||||
const handleLogin = async () => {
|
||||
const res = await fetch('/api/admin/login', {
|
||||
method: 'POST',
|
||||
body: JSON.stringify({ password }),
|
||||
});
|
||||
if (res.ok) {
|
||||
localStorage.setItem('hoerdle_admin_auth', 'authenticated');
|
||||
setIsAuthenticated(true);
|
||||
fetchSongs();
|
||||
} else {
|
||||
@@ -147,9 +157,25 @@ export default function AdminPage() {
|
||||
|
||||
// Play new song
|
||||
const audio = new Audio(`/uploads/${song.filename}`);
|
||||
audio.play();
|
||||
|
||||
// Handle playback errors
|
||||
audio.onerror = () => {
|
||||
alert(`Failed to load audio file: ${song.filename}\nThe file may be corrupted or missing.`);
|
||||
setPlayingSongId(null);
|
||||
setAudioElement(null);
|
||||
};
|
||||
|
||||
audio.play()
|
||||
.then(() => {
|
||||
setAudioElement(audio);
|
||||
setPlayingSongId(song.id);
|
||||
})
|
||||
.catch((error) => {
|
||||
console.error('Playback error:', error);
|
||||
alert(`Failed to play audio: ${error.message}`);
|
||||
setPlayingSongId(null);
|
||||
setAudioElement(null);
|
||||
});
|
||||
|
||||
// Reset when song ends
|
||||
audio.onended = () => {
|
||||
|
||||
Reference in New Issue
Block a user