fix(node-player): load cover art via axios with Bearer token
Publish Metadata Agent Image (dev) / build-and-push-image (push) Successful in 1m22s
Publish Node Player Image (dev) / build-and-push-image (push) Failing after 29s
Publish Web Player Image (dev) / build-and-push-image (push) Has been cancelled

Cover images were loaded via <img src> which doesn't include the
Authorization header, resulting in 401 from the Rust API. Now covers
are fetched through axios as blobs and displayed via object URLs.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Ultradesu
2026-04-08 15:39:14 +01:00
parent 1df10fb0b7
commit a9a8ee81b8
5 changed files with 53 additions and 25 deletions
@@ -1,5 +1,5 @@
import { useEffect, useRef, useState } from 'react'
import { API_ROOT } from '../furumiApi'
import { useRef, useState } from 'react'
import { useCoverUrl } from '../hooks/useCoverUrl'
export type QueueItem = {
slug: string
@@ -32,13 +32,11 @@ function fmt(secs: number) {
return `${m}:${pad(s % 60)}`
}
function Cover({ src }: { src: string }) {
function Cover({ slug }: { slug: string }) {
const [errored, setErrored] = useState(false)
useEffect(() => {
setErrored(false)
}, [src])
const src = useCoverUrl(slug)
if (errored) return <>&#127925;</>
if (!src || errored) return <>&#127925;</>
return <img src={src} alt="" onError={() => setErrored(true)} />
}
@@ -77,7 +75,7 @@ export function QueueList({
if (!t) return null
const isPlaying = origIdx === playingOrigIdx
const coverSrc = t.album_slug ? `${API_ROOT}/tracks/${t.slug}/cover` : ''
const hasAlbum = !!t.album_slug
const dur = t.duration ? fmt(t.duration) : ''
const isDragging = draggingPos === pos
const isDragOver = dragOverPos === pos
@@ -118,7 +116,7 @@ export function QueueList({
>
<span className="qi-index">{isPlaying ? '' : pos + 1}</span>
<div className="qi-cover">
{coverSrc ? <Cover src={coverSrc} /> : <>&#127925;</>}
{hasAlbum ? <Cover slug={t.slug} /> : <>&#127925;</>}
</div>
<div className="qi-info">
<div className="qi-title">{t.title}</div>