fix: Resolve main view player issues and clean up UI
- Fix ObjectId casting error in PersistentMusicPlayer by handling both string IDs and populated objects - Remove music icon badge from main view song list (play button is sufficient) - Clean up unused Badge import in PaginatedSongList - Ensure proper musicFileId extraction for API calls The main view music player should now work correctly, and the UI is cleaner without redundant music icons.
This commit is contained in:
parent
4361531513
commit
6244c7c6b8
@ -17,7 +17,6 @@ import {
|
|||||||
MenuDivider,
|
MenuDivider,
|
||||||
IconButton,
|
IconButton,
|
||||||
Spinner,
|
Spinner,
|
||||||
Badge,
|
|
||||||
} from '@chakra-ui/react';
|
} from '@chakra-ui/react';
|
||||||
import { Search2Icon, ChevronDownIcon } from '@chakra-ui/icons';
|
import { Search2Icon, ChevronDownIcon } from '@chakra-ui/icons';
|
||||||
import type { Song, PlaylistNode } from '../types/interfaces';
|
import type { Song, PlaylistNode } from '../types/interfaces';
|
||||||
@ -97,16 +96,9 @@ const SongItem = memo<{
|
|||||||
/>
|
/>
|
||||||
)}
|
)}
|
||||||
<Box flex={1} minW={0}>
|
<Box flex={1} minW={0}>
|
||||||
<Flex align="center" gap={2}>
|
|
||||||
<Text fontSize="sm" fontWeight="medium" color="white" noOfLines={1}>
|
<Text fontSize="sm" fontWeight="medium" color="white" noOfLines={1}>
|
||||||
{song.title}
|
{song.title}
|
||||||
</Text>
|
</Text>
|
||||||
{hasMusicFile(song) && (
|
|
||||||
<Badge colorScheme="green" size="sm" variant="subtle" bg="green.900" color="green.200">
|
|
||||||
🎵
|
|
||||||
</Badge>
|
|
||||||
)}
|
|
||||||
</Flex>
|
|
||||||
<Text fontSize="xs" color="gray.400" noOfLines={1}>
|
<Text fontSize="xs" color="gray.400" noOfLines={1}>
|
||||||
{song.artist}
|
{song.artist}
|
||||||
</Text>
|
</Text>
|
||||||
|
|||||||
@ -66,9 +66,16 @@ export const PersistentMusicPlayer: React.FC<PersistentMusicPlayerProps> = ({
|
|||||||
const loadStreamingUrl = async () => {
|
const loadStreamingUrl = async () => {
|
||||||
if (!currentSong?.s3File?.musicFileId) return;
|
if (!currentSong?.s3File?.musicFileId) return;
|
||||||
|
|
||||||
|
// Handle both string ID and populated object
|
||||||
|
const musicFileId = typeof currentSong.s3File.musicFileId === 'string'
|
||||||
|
? currentSong.s3File.musicFileId
|
||||||
|
: currentSong.s3File.musicFileId._id;
|
||||||
|
|
||||||
|
if (!musicFileId) return;
|
||||||
|
|
||||||
setIsLoading(true);
|
setIsLoading(true);
|
||||||
try {
|
try {
|
||||||
const response = await fetch(`/api/music/${currentSong.s3File.musicFileId}/stream`);
|
const response = await fetch(`/api/music/${musicFileId}/stream`);
|
||||||
if (response.ok) {
|
if (response.ok) {
|
||||||
const data = await response.json();
|
const data = await response.json();
|
||||||
setStreamingUrl(data.streamingUrl);
|
setStreamingUrl(data.streamingUrl);
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user