handle conditional item card expansion

src/renderer/components/item-card/item-card-controls.tsx

@@ -22,6 +22,7 @@ import { Play } from '/@/shared/types/types';
 
 interface ItemCardControlsProps {
     controls?: ItemControls;
+    enableExpansion?: boolean;
     internalState?: ItemListStateActions;
     item: Album | AlbumArtist | Artist | Playlist | Song | undefined;
     itemType: LibraryItem;
@@ -51,6 +52,7 @@ const containerProps = {
 
 export const ItemCardControls = ({
     controls,
+    enableExpansion,
     internalState,
     item,
     itemType,
@@ -198,7 +200,7 @@ export const ItemCardControls = ({
                     }}
                 />
             )}
-            {controls?.onExpand && (
+            {controls?.onExpand && enableExpansion && (
                 <SecondaryButton
                     className={styles.expand}
                     icon="arrowDownS"

src/renderer/components/item-card/item-card.tsx

@@ -40,6 +40,7 @@ export interface ItemCardProps {
     controls?: ItemControls;
     data: Album | AlbumArtist | Artist | Playlist | Song | undefined;
     enableDrag?: boolean;
+    enableExpansion?: boolean;
     internalState?: ItemListStateActions;
     isRound?: boolean;
     itemType: LibraryItem;
@@ -52,6 +53,7 @@ export const ItemCard = ({
     controls,
     data,
     enableDrag,
+    enableExpansion,
     internalState,
     isRound,
     itemType,
@@ -70,6 +72,7 @@ export const ItemCard = ({
                     controls={controls}
                     data={data}
                     enableDrag={enableDrag}
+                    enableExpansion={enableExpansion}
                     imageUrl={imageUrl}
                     internalState={internalState}
                     isRound={isRound}
@@ -84,6 +87,7 @@ export const ItemCard = ({
                     controls={controls}
                     data={data}
                     enableDrag={enableDrag}
+                    enableExpansion={enableExpansion}
                     imageUrl={imageUrl}
                     internalState={internalState}
                     isRound={isRound}
@@ -99,6 +103,7 @@ export const ItemCard = ({
                     controls={controls}
                     data={data}
                     enableDrag={enableDrag}
+                    enableExpansion={enableExpansion}
                     imageUrl={imageUrl}
                     internalState={internalState}
                     isRound={isRound}
@@ -112,6 +117,7 @@ export const ItemCard = ({
 
 export interface ItemCardDerivativeProps extends Omit<ItemCardProps, 'type'> {
     controls?: ItemControls;
+    enableExpansion?: boolean;
     imageUrl: string | undefined;
     internalState?: ItemListStateActions;
     rows: DataRow[];
@@ -120,6 +126,7 @@ export interface ItemCardDerivativeProps extends Omit<ItemCardProps, 'type'> {
 const CompactItemCard = ({
     controls,
     data,
+    enableExpansion,
     imageUrl,
     internalState,
     isRound,
@@ -232,6 +239,7 @@ const CompactItemCard = ({
                     {withControls && showControls && (
                         <ItemCardControls
                             controls={controls}
+                            enableExpansion={enableExpansion}
                             item={data}
                             itemType={itemType}
                             type="compact"
@@ -320,6 +328,7 @@ const CompactItemCard = ({
 const DefaultItemCard = ({
     controls,
     data,
+    enableExpansion,
     imageUrl,
     internalState,
     isRound,
@@ -432,6 +441,7 @@ const DefaultItemCard = ({
                     {withControls && showControls && (
                         <ItemCardControls
                             controls={controls}
+                            enableExpansion={enableExpansion}
                             item={data}
                             itemType={itemType}
                             type="default"
@@ -520,6 +530,7 @@ const PosterItemCard = ({
     controls,
     data,
     enableDrag,
+    enableExpansion,
     imageUrl,
     internalState,
     isRound,
@@ -677,6 +688,7 @@ const PosterItemCard = ({
                     {withControls && showControls && data && (
                         <ItemCardControls
                             controls={controls}
+                            enableExpansion={enableExpansion}
                             internalState={internalState}
                             item={data}
                             itemType={itemType}

src/renderer/components/item-list/item-grid-list/item-grid-list.tsx

@@ -261,7 +261,7 @@ export interface ItemGridListProps {
 export const ItemGridList = ({
     data,
     enableDrag = true,
-    enableExpansion = true,
+    enableExpansion = false,
     enableSelection = true,
     gap = 'sm',
     getRowId,
@@ -690,6 +690,7 @@ const ListComponent = memo((props: ListChildComponentProps<GridItemProps>) => {
                         controls={controls}
                         data={data[i]}
                         enableDrag={enableDrag}
+                        enableExpansion={props.data.enableExpansion}
                         internalState={props.data.internalState}
                         itemType={itemType}
                         rows={rows}

src/renderer/features/albums/components/album-list-infinite-grid.tsx

@@ -58,6 +58,7 @@ export const AlbumListInfiniteGrid = forwardRef<any, AlbumListInfiniteGridProps>
         return (
             <ItemGridList
                 data={data}
+                enableExpansion
                 gap={gap}
                 initialTop={{
                     to: scrollOffset ?? 0,

src/renderer/features/albums/components/album-list-paginated-grid.tsx

@@ -71,6 +71,7 @@ export const AlbumListPaginatedGrid = forwardRef<any, AlbumListPaginatedGridProp
                 <ItemGridList
                     currentPage={currentPage}
                     data={data || []}
+                    enableExpansion
                     gap={gap}
                     initialTop={{
                         to: scrollOffset ?? 0,