mbrucedogs/singsalot
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Signed-off-by: mbrucedogs <mbrucedogs@gmail.com>

Browse Source
This commit is contained in:
mbrucedogs 2025-07-21 09:15:04 -05:00
parent ba326cd265
commit 589f6b3ad5
8 changed files with 34 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
src/components/common/SongInfo.tsx
View File

@ -14,6 +14,7 @@ import { useModal } from '../../hooks/useModalContext';
import { ModalHeader, InfiniteScrollList, SongItem } from './index';
import { SongInfoDisplay } from './SongItem';
import type { Song, QueueItem } from '../../types';
import { SongItemContext } from '../../types';
interface SongInfoProps {
isOpen: boolean;
@ -160,7 +161,7 @@ const SongInfo: React.FC<SongInfoProps> = ({ isOpen, onClose, song }) => {
renderItem={(song) => (
<SongItem
song={song}
context="search"
context={SongItemContext.SEARCH}
showAddButton={true}
showInfoButton={true}
showFavoriteButton={false}

21
src/components/common/SongItem.tsx
View File

@ -7,6 +7,7 @@ import { useActions } from '../../hooks/useActions';
import { useModal } from '../../hooks/useModalContext';
import { debugLog } from '../../utils/logger';
import type { SongItemProps, QueueItem, Song } from '../../types';
import { SongItemContext } from '../../types';
import { ActionButtonVariant, ActionButtonSize, ActionButtonIconSlot } from '../../types';
import { Icons } from '../../constants';
@ -226,7 +227,7 @@ const SongItem: React.FC<SongItemProps> = React.memo(({
// Find queue item key for removal (only needed for queue context)
const queueItemKey = useMemo(() =>
context === 'queue'
context === SongItemContext.QUEUE
? (Object.entries(queue) as [string, QueueItem][]).find(([, item]) => item.song.path === song.path)?.[0]
: null,
[context, queue, song.path]
@ -242,14 +243,14 @@ const SongItem: React.FC<SongItemProps> = React.memo(({
});
// Default values based on context if not explicitly provided
const shouldShowPath = showPath !== undefined ? showPath : context !== 'queue';
const shouldShowCount = showCount !== undefined ? showCount : context === 'queue';
const shouldShowPath = showPath !== undefined ? showPath : context !== SongItemContext.QUEUE;
const shouldShowCount = showCount !== undefined ? showCount : context === SongItemContext.QUEUE;
// Default values for action buttons based on context if not explicitly provided
const shouldShowInfoButton = showInfoButton !== undefined ? showInfoButton : ['search', 'history'].includes(context);
const shouldShowAddButton = showAddButton !== undefined ? showAddButton : ['search', 'history'].includes(context);
const shouldShowRemoveButton = showRemoveButton !== undefined ? showRemoveButton : context === 'queue' && isAdmin;
const shouldShowDeleteButton = showDeleteButton !== undefined ? showDeleteButton : context === 'history' && isAdmin;
const shouldShowInfoButton = showInfoButton !== undefined ? showInfoButton : [SongItemContext.SEARCH, SongItemContext.HISTORY].includes(context);
const shouldShowAddButton = showAddButton !== undefined ? showAddButton : [SongItemContext.SEARCH, SongItemContext.HISTORY].includes(context);
const shouldShowRemoveButton = showRemoveButton !== undefined ? showRemoveButton : context === SongItemContext.QUEUE && isAdmin;
const shouldShowDeleteButton = showDeleteButton !== undefined ? showDeleteButton : context === SongItemContext.HISTORY && isAdmin;
const shouldShowFavoriteButton = showFavoriteButton !== undefined ? showFavoriteButton : false; // Disabled for all contexts
// Memoized handler functions for performance
@ -295,9 +296,9 @@ const SongItem: React.FC<SongItemProps> = React.memo(({
showDeleteButton={shouldShowDeleteButton}
showFavoriteButton={shouldShowFavoriteButton}
onDeleteItem={onDeleteItem}
onAddToQueue={context === 'queue' ? handleRemoveFromQueueClick : handleAddToQueueClick}
onRemoveFromQueue={context === 'queue' ? handleRemoveFromQueueClick : onDeleteItem}
onToggleFavorite={context === 'favorites' ? onDeleteItem : handleToggleFavoriteClick}
onAddToQueue={context === SongItemContext.QUEUE ? handleRemoveFromQueueClick : handleAddToQueueClick}
onRemoveFromQueue={context === SongItemContext.QUEUE ? handleRemoveFromQueueClick : onDeleteItem}
onToggleFavorite={context === SongItemContext.FAVORITES ? onDeleteItem : handleToggleFavoriteClick}
onShowSongInfo={handleSelectSinger}
/>
</div>

3
src/features/Favorites/Favorites.tsx
View File

@ -5,6 +5,7 @@ import { useAppSelector } from '../../redux';
import { selectFavorites } from '../../redux';
import { debugLog } from '../../utils/logger';
import type { Song } from '../../types';
import { SongItemContext } from '../../types';
const Favorites: React.FC = () => {
const {
@ -31,7 +32,7 @@ const Favorites: React.FC = () => {
renderItem={(song) => (
<SongItem
song={song}
context="favorites"
context={SongItemContext.FAVORITES}
showInfoButton={true}
showAddButton={false}
showDeleteButton={true}

3
src/features/History/History.tsx
View File

@ -7,6 +7,7 @@ import { useAppSelector } from '../../redux';
import { selectHistory, selectIsAdmin } from '../../redux';
import { formatDate } from '../../utils/dataProcessing';
import type { Song } from '../../types';
import { SongItemContext } from '../../types';
const History: React.FC = () => {
const {
@ -54,7 +55,7 @@ const History: React.FC = () => {
<div className="flex-1">
<SongItem
song={song}
context="history"
context={SongItemContext.HISTORY}
onDeleteItem={() => handleDeleteFromHistory(song)}
isAdmin={isAdmin}
showAddButton={true}

3
src/features/NewSongs/NewSongs.tsx
View File

@ -5,6 +5,7 @@ import { useAppSelector } from '../../redux';
import { selectNewSongsArray } from '../../redux';
import { debugLog } from '../../utils/logger';
import type { Song } from '../../types';
import { SongItemContext } from '../../types';
const NewSongs: React.FC = () => {
const {
@ -30,7 +31,7 @@ const NewSongs: React.FC = () => {
renderItem={(song) => (
<SongItem
song={song}
context="search"
context={SongItemContext.SEARCH}
showAddButton={true}
showInfoButton={true}
showFavoriteButton={false}

3
src/features/Search/Search.tsx
View File

@ -5,6 +5,7 @@ import { useSearch, useDebugLogging } from '../../hooks';
import { useAppSelector } from '../../redux';
import { selectIsAdmin, selectSongs } from '../../redux';
import type { Song } from '../../types';
import { SongItemContext } from '../../types';
const Search: React.FC = () => {
const {
@ -52,7 +53,7 @@ const Search: React.FC = () => {
renderItem={(song) => (
<SongItem
song={song}
context="search"
context={SongItemContext.SEARCH}
isAdmin={isAdmin}
showAddButton={true}
showInfoButton={true}

3
src/features/SongLists/SongLists.tsx
View File

@ -7,6 +7,7 @@ import { useAppSelector } from '../../redux';
import { selectSongList } from '../../redux';
import type { SongListSong, SongList, Song } from '../../types';
import { debugLog } from '../../utils/logger';
import { SongItemContext } from '../../types';
const SongLists: React.FC = () => {
const {
@ -124,7 +125,7 @@ const SongLists: React.FC = () => {
<SongItem
key={song.key || `${song.title}-${song.artist}-${sidx}`}
song={song}
context="search"
context={SongItemContext.SEARCH}
showAddButton={true}
showInfoButton={true}
showFavoriteButton={false}

12
src/types/index.ts
View File

@ -164,9 +164,19 @@ export interface ActionButtonProps {
'aria-label'?: string;
}
export enum SongItemContext {
SEARCH = 'search',
QUEUE = 'queue',
FAVORITES = 'favorites',
HISTORY = 'history',
SONGLISTS = 'songlists',
TOP100 = 'top100',
NEW = 'new',
}
export interface SongItemProps {
song: Song;
context: 'search' | 'queue' | 'favorites' | 'history' | 'songlists' | 'top100' | 'new';
context: SongItemContext;
onDeleteItem?: () => void;
isAdmin?: boolean;
className?: string;