Dicken/dickendock
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

feat: Dashboard-Badge → Favoriten-Tab, ❤ Button im Modal, xREL für TV ausblenden

Browse Source
This commit is contained in:
Dicken
2026-06-18 11:55:22 +02:00
parent 3244ac7644
commit 940e1860b7
2 changed files with 28 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

33
frontend/src/tools/media.jsx
View File

@@ -38,8 +38,14 @@ const FSK_COLOR = fsk => {
return { bg:'#444', color:'#fff' };
};
export default function Media({ toast, mobile }) {
export default function Media({ toast, mobile, initTab, onInitTabConsumed }) {
const [activeTool, setActiveTool] = useState('kino');
const [favIds, toggleFav] = useFavIds();
// Wenn von außen ein Tab vorgegeben wird (z.B. Dashboard-Badge)
useEffect(() => {
if (initTab) { setActiveTool(initTab); onInitTabConsumed?.(); }
}, [initTab]);
const [modal, setModal] = useState(null); // { id, media_type }
const [xrelIds, setXrelIds] = useState(new Set()); // tmdb_ids mit bekannten Releases
@@ -126,10 +132,10 @@ export default function Media({ toast, mobile }) {
<span style={{ color:'rgba(255,255,255,0.5)', fontFamily:'monospace', fontSize:10 }}>{active?.desc}</span>
</div>
{activeTool === 'kino' && <KinoGrid onOpenModal={setModal} xrelIds={xrelIds} onXrelLoaded={ids => setXrelIds(prev => new Set([...prev, ...ids]))} />}
{activeTool === 'demnächst' && <DemnächstGrid onOpenModal={setModal} xrelIds={xrelIds} onXrelLoaded={ids => setXrelIds(prev => new Set([...prev, ...ids]))} />}
{activeTool === 'kino' && <KinoGrid onOpenModal={setModal} xrelIds={xrelIds} onXrelLoaded={ids => setXrelIds(prev => new Set([...prev, ...ids]))} favIds={favIds} onToggleFav={toggleFav}/>}
{activeTool === 'demnächst' && <DemnächstGrid onOpenModal={setModal} xrelIds={xrelIds} onXrelLoaded={ids => setXrelIds(prev => new Set([...prev, ...ids]))} favIds={favIds} onToggleFav={toggleFav}/>}
{activeTool === 'favoriten' && <FavoritenKalender onOpenModal={setModal} />}
{activeTool === 'suchen' && <SucheGrid onOpenModal={setModal} xrelIds={xrelIds} onXrelLoaded={ids => setXrelIds(prev => new Set([...prev, ...ids]))} />}
{activeTool === 'suchen' && <SucheGrid onOpenModal={setModal} xrelIds={xrelIds} onXrelLoaded={ids => setXrelIds(prev => new Set([...prev, ...ids]))} favIds={favIds} onToggleFav={toggleFav}/>}
</div>
{modal && createPortal(
@@ -140,6 +146,8 @@ export default function Media({ toast, mobile }) {
mobile={mobile}
onHasXrel={id => setXrelIds(prev => new Set([...prev, id]))}
noYearFilter={activeTool === 'suchen'}
isFav={favIds.has(modal?.id || modal)}
onToggleFav={movie => toggleFav(movie, favIds.has(modal?.id || modal))}
/>,
document.body
)}
@@ -809,7 +817,7 @@ function FavoritenKalender({ onOpenModal }) {
}
// ── Film-Detail-Modal (via Portal) ────────────────────────────────────────────
function MovieModal({ tmdbId, mediaType='movie', onClose, mobile, onHasXrel, noYearFilter }) {
function MovieModal({ tmdbId, mediaType='movie', onClose, mobile, onHasXrel, noYearFilter, isFav=false, onToggleFav }) {
const [detail, setDetail] = useState(null);
const [xrel, setXrel] = useState(null); // null=nicht gesucht, []=gesucht
const [xrelDates, setXrelDates] = useState([]);
@@ -917,13 +925,22 @@ function MovieModal({ tmdbId, mediaType='movie', onClose, mobile, onHasXrel, noY
)}
</div>
{/* Schließen – sticky außerhalb des Scroll-Containers */}
{/* Schließen + Favorit – sticky außerhalb des Scroll-Containers */}
<button onClick={onClose} style={{
position:'absolute', top:12, right:12,
background:'rgba(0,0,0,0.75)', border:'none', borderRadius:'50%',
width:34, height:34, cursor:'pointer', zIndex:10,
color:'#fff', fontSize:18, display:'flex', alignItems:'center', justifyContent:'center',
}}>✕</button>
{onToggleFav && detail && (
<button onClick={() => onToggleFav(detail)} style={{
position:'absolute', top:12, right:54,
background:'rgba(0,0,0,0.75)', border:'none', borderRadius:'50%',
width:34, height:34, cursor:'pointer', zIndex:10,
color: isFav ? '#f87171' : 'rgba(255,255,255,0.6)',
fontSize:18, display:'flex', alignItems:'center', justifyContent:'center',
}}>{isFav ? '❤' : '🤍'}</button>
)}
{/* Scrollbarer Inhalt */}
<div style={{ overflowY:'auto', WebkitOverflowScrolling:'touch', flex:1 }}>
@@ -1042,7 +1059,7 @@ function MovieModal({ tmdbId, mediaType='movie', onClose, mobile, onHasXrel, noY
</div>
) : null;
})()}
<div style={{ display:'flex', alignItems:'center', gap:8, marginBottom: xrel?.length ? 8 : 0 }}>
{mediaType !== 'tv' && <div style={{ display:'flex', alignItems:'center', gap:8, marginBottom: xrel?.length ? 8 : 0 }}>
<div style={{ ...S.head, marginBottom:0, flex:1 }}>RELEASES (XREL.TO)</div>
<button
onClick={() => searchXrel(xrel !== null && xrel.length > 0)}
@@ -1057,7 +1074,7 @@ function MovieModal({ tmdbId, mediaType='movie', onClose, mobile, onHasXrel, noY
{xrelLoading ? '⏳ Suche…' : xrel === null ? '🔍 Nach Releases suchen' : '🔄 Erneut suchen'}
</button>
</div>
{xrel !== null && xrel.length === 0 && (
{mediaType !== 'tv' && xrel !== null && xrel.length === 0 && (
<div style={{ fontSize:11, color:'rgba(255,255,255,0.3)', fontFamily:'monospace', fontStyle:'italic' }}>
Keine deutschen Releases gefunden
</div>