root/jukebox-vibe
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Nightly: Badge-Entfernen ohne Modal neuer Endpoint /badges/clear und UI-Button 'Badges entfernen'

Browse source
This commit is contained in:
vibe-bot 2025-08-09 21:12:02 +02:00
parent fae25d7578
commit 85a148d45f
3 changed files with 35 additions and 23 deletions
Download patch file Download diff file Expand all files Collapse all files

36
web/src/App.tsx
View file

@ -1,6 +1,6 @@
import React, { useEffect, useMemo, useRef, useState } from 'react';
import ReactDOM from 'react-dom';
import { fetchChannels, fetchSounds, playSound, setVolumeLive, getVolume, adminStatus, adminLogin, adminLogout, adminDelete, adminRename, playUrl, fetchCategories, createCategory, assignCategories, assignBadges, updateCategory, deleteCategory } from './api';
import { fetchChannels, fetchSounds, playSound, setVolumeLive, getVolume, adminStatus, adminLogin, adminLogout, adminDelete, adminRename, playUrl, fetchCategories, createCategory, assignCategories, assignBadges, clearBadges, updateCategory, deleteCategory } from './api';
import type { VoiceChannelInfo, Sound, Category } from './types';
import { getCookie, setCookie } from './cookies';
@ -475,28 +475,18 @@ export default function App() {
)}
</div>
<div style={{ position:'relative' }}>
<button
className="bg-gray-700 hover:bg-gray-600 text-white font-bold py-3 px-6 rounded-lg transition duration-300"
onClick={()=> setShowEmojiRemovePicker(v=>!v)}
>Badge entfernen</button>
{showEmojiRemovePicker && (
<div ref={emojiRemovePickerRef as any} className="emoji-picker" style={{ position:'absolute', top:'110%', right:0, zIndex: 99999 }}>
{EMOJIS.map((e, i)=> (
<button key={i} onClick={async ()=>{
try{
const files = Object.entries(selectedSet).filter(([,v])=>v).map(([k])=>k);
await assignBadges(files, [], [e]);
setShowEmojiRemovePicker(false);
setInfo('Badge entfernt'); setError(null);
const resp = await fetchSounds(query, activeFolder === '__favs__' ? '__all__' : activeFolder, activeCategoryId || undefined);
setSounds(resp.items); setTotal(resp.total); setFolders(resp.folders);
}catch(err:any){ setError(err?.message||'Badge-Entfernung fehlgeschlagen'); setInfo(null); }
}}>{e}</button>
))}
</div>
)}
</div>
<button
className="bg-gray-700 hover:bg-gray-600 text-white font-bold py-3 px-6 rounded-lg transition duration-300"
onClick={async ()=>{
try{
const files = Object.entries(selectedSet).filter(([,v])=>v).map(([k])=>k);
await clearBadges(files);
setInfo('Alle Custom-Badges entfernt'); setError(null);
const resp = await fetchSounds(query, activeFolder === '__favs__' ? '__all__' : activeFolder, activeCategoryId || undefined);
setSounds(resp.items); setTotal(resp.total); setFolders(resp.folders);
}catch(err:any){ setError(err?.message||'Badge-Entfernung fehlgeschlagen'); setInfo(null); }
}}
>Badges entfernen</button>
</>
)}

9
web/src/api.ts
View file

@ -63,6 +63,15 @@ export async function assignBadges(files: string[], add: string[], remove: strin
return res.json();
}
export async function clearBadges(files: string[]) {
const res = await fetch(`${API_BASE}/badges/clear`, {
method: 'POST', headers: { 'Content-Type': 'application/json' }, credentials: 'include',
body: JSON.stringify({ files })
});
if (!res.ok) throw new Error('Badges löschen fehlgeschlagen');
return res.json();
}
export async function fetchChannels(): Promise<VoiceChannelInfo[]> {
const res = await fetch(`${API_BASE}/channels`);
if (!res.ok) throw new Error('Fehler beim Laden der Channels');