fix internalState on expanded album item

This commit is contained in:
jeffvli
2025-11-28 14:39:18 -08:00
parent 3f8a3a5e03
commit 5d0124369e
@@ -11,6 +11,7 @@ import { useDefaultItemListControls } from '/@/renderer/components/item-list/hel
import { import {
ItemListStateActions, ItemListStateActions,
ItemListStateItem, ItemListStateItem,
useItemDraggingState,
useItemListState, useItemListState,
useItemSelectionState, useItemSelectionState,
} from '/@/renderer/components/item-list/helpers/item-list-state'; } from '/@/renderer/components/item-list/helpers/item-list-state';
@@ -30,7 +31,6 @@ import { LibraryItem, Song } from '/@/shared/types/domain-types';
import { DragOperation, DragTarget, DragTargetMap } from '/@/shared/types/drag-and-drop'; import { DragOperation, DragTarget, DragTargetMap } from '/@/shared/types/drag-and-drop';
interface AlbumTracksTableProps { interface AlbumTracksTableProps {
internalState?: ItemListStateActions;
isDark?: boolean; isDark?: boolean;
serverId: string; serverId: string;
songs?: Array<{ songs?: Array<{
@@ -57,6 +57,7 @@ interface TrackRowProps {
const TrackRow = ({ controls, internalState, serverId, song }: TrackRowProps) => { const TrackRow = ({ controls, internalState, serverId, song }: TrackRowProps) => {
const rowId = internalState.extractRowId(song); const rowId = internalState.extractRowId(song);
const isSelected = useItemSelectionState(internalState, rowId); const isSelected = useItemSelectionState(internalState, rowId);
const isDraggingState = useItemDraggingState(internalState, rowId);
const songWithMetadata = { const songWithMetadata = {
...song, ...song,
@@ -101,7 +102,7 @@ const TrackRow = ({ controls, internalState, serverId, song }: TrackRowProps) =>
isEnabled: true, isEnabled: true,
}); });
const isDragging = internalState.isDragging(song.id) || isDraggingLocal; const isDragging = isDraggingState || isDraggingLocal;
const containerRef = useRef<HTMLDivElement>(null); const containerRef = useRef<HTMLDivElement>(null);
const mergedRef = useMergedRef(containerRef, dragRef); const mergedRef = useMergedRef(containerRef, dragRef);
@@ -134,12 +135,7 @@ const TrackRow = ({ controls, internalState, serverId, song }: TrackRowProps) =>
); );
}; };
const AlbumTracksTable = ({ const AlbumTracksTable = ({ isDark, serverId, songs }: AlbumTracksTableProps) => {
internalState: parentInternalState,
isDark,
serverId,
songs,
}: AlbumTracksTableProps) => {
const getDataFn = useCallback(() => songs || [], [songs]); const getDataFn = useCallback(() => songs || [], [songs]);
const extractRowId = useCallback((item: unknown) => { const extractRowId = useCallback((item: unknown) => {
@@ -149,9 +145,9 @@ const AlbumTracksTable = ({
return undefined; return undefined;
}, []); }, []);
// Use parent internalState if available, otherwise create a local one // Always use a local state for tracks - tracks are separate entities from albums
const localInternalState = useItemListState(getDataFn, extractRowId); // and need their own selection state. The parentInternalState is for album-level operations.
const internalState = parentInternalState || localInternalState; const internalState = useItemListState(getDataFn, extractRowId);
const controls = useDefaultItemListControls(); const controls = useDefaultItemListControls();
@@ -262,7 +258,6 @@ export const ExpandedAlbumListItem = ({ internalState, item }: ExpandedAlbumList
</Group> </Group>
</div> </div>
<AlbumTracksTable <AlbumTracksTable
internalState={internalState}
isDark={color.isDark} isDark={color.isDark}
serverId={item._serverId} serverId={item._serverId}
songs={data?.songs} songs={data?.songs}