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 08:21:00 -05:00
parent 9662c8ce56
commit e480fe4828
3 changed files with 26 additions and 32 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -27,10 +27,12 @@ export const SongInfoDisplay: React.FC<{
song: Song; song: Song;
showPath?: boolean; showPath?: boolean;
showCount?: boolean; showCount?: boolean;
showFullPath?: boolean;
}> = React.memo(({ }> = React.memo(({
song, song,
showPath = false, showPath = false,
showCount = false showCount = false,
showFullPath = false
}) => { }) => {
return ( return (
<IonLabel> <IonLabel>
@ -56,7 +58,7 @@ export const SongInfoDisplay: React.FC<{
> >
{song.artist} {song.artist}
</div> </div>
{/* Show filename if showPath is true */} {/* Show filename or full path if showPath is true */}
{showPath && song.path && ( {showPath && song.path && (
<div <div
className="ion-text-sm ion-color-medium" className="ion-text-sm ion-color-medium"
@ -65,7 +67,7 @@ export const SongInfoDisplay: React.FC<{
color: 'var(--ion-color-medium)' color: 'var(--ion-color-medium)'
}} }}
> >
{extractFilename(song.path)} {showFullPath ? song.path : extractFilename(song.path)}
</div> </div>
)} )}
{/* Show play count if showCount is true */} {/* Show play count if showCount is true */}
@ -200,7 +202,8 @@ const SongItem: React.FC<SongItemProps> = React.memo(({
showAddButton, showAddButton,
showRemoveButton, showRemoveButton,
showDeleteButton, showDeleteButton,
showFavoriteButton showFavoriteButton,
showFullPath
}) => { }) => {
// Get current state from Redux // Get current state from Redux
const queue = useAppSelector(selectQueue); const queue = useAppSelector(selectQueue);
@ -277,6 +280,7 @@ const SongItem: React.FC<SongItemProps> = React.memo(({
song={song} song={song}
showPath={shouldShowPath} showPath={shouldShowPath}
showCount={shouldShowCount} showCount={shouldShowCount}
showFullPath={showFullPath}
/> />
{showActions && ( {showActions && (

41
src/features/Settings/Settings.tsx
View File

@ -4,7 +4,7 @@ import { ban } from 'ionicons/icons';
import { useAppSelector } from '../../redux'; import { useAppSelector } from '../../redux';
import { selectIsAdmin, selectSettings } from '../../redux'; import { selectIsAdmin, selectSettings } from '../../redux';
import { useDisabledSongs } from '../../hooks'; import { useDisabledSongs } from '../../hooks';
import { InfiniteScrollList, ActionButton } from '../../components/common'; import { InfiniteScrollList, ActionButton, SongItem } from '../../components/common';
import { ActionButtonVariant, ActionButtonSize, ActionButtonIconSlot } from '../../types'; import { ActionButtonVariant, ActionButtonSize, ActionButtonIconSlot } from '../../types';
import { Icons } from '../../constants'; import { Icons } from '../../constants';
import { filterSongs } from '../../utils/dataProcessing'; import { filterSongs } from '../../utils/dataProcessing';
@ -166,34 +166,23 @@ const Settings: React.FC = () => {
hasMore={false} hasMore={false}
onLoadMore={() => {}} onLoadMore={() => {}}
renderItem={(song) => ( renderItem={(song) => (
<IonItem> <div className="flex items-center">
<IonLabel> <div className="flex-1">
<h3 className="text-sm font-medium text-gray-900"> <SongItem
{song.title || 'Unknown Title'} song={song}
</h3> context="history"
<p className="text-sm text-gray-500"> showDeleteButton={true}
{song.artist || 'Unknown Artist'} showInfoButton={false}
</p> showAddButton={false}
<p className="text-xs text-gray-400 break-words"> showFavoriteButton={false}
{song.path} onDeleteItem={() => handleRemoveDisabledSong(song)}
</p> showFullPath={true}
<p className="text-xs text-gray-400">
Disabled: {new Date(song.disabledAt || '').toLocaleDateString()}
</p>
</IonLabel>
<div slot="end" className="flex items-center gap-2 ml-2">
<div onClick={(e) => e.stopPropagation()}>
<ActionButton
onClick={() => handleRemoveDisabledSong(song)}
variant={ActionButtonVariant.DANGER}
size={ActionButtonSize.SMALL}
icon={Icons.TRASH}
iconSlot={ActionButtonIconSlot.ICON_ONLY}
/> />
</div> </div>
<div className="flex items-center gap-2 ml-2">
{/* Delete button is now handled by SongItem */}
</div>
</div> </div>
</IonItem>
)} )}
emptyTitle="No disabled songs" emptyTitle="No disabled songs"
emptyMessage="Songs marked as disabled will appear here" emptyMessage="Songs marked as disabled will appear here"

1
src/types/index.ts
View File

@ -177,6 +177,7 @@ export interface SongItemProps {
showRemoveButton?: boolean; showRemoveButton?: boolean;
showDeleteButton?: boolean; showDeleteButton?: boolean;
showFavoriteButton?: boolean; showFavoriteButton?: boolean;
showFullPath?: boolean;
} }
export interface LayoutProps { export interface LayoutProps {