add placeholder expanded list item

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

@@ -0,0 +1,44 @@
+import styles from './expanded-list-item.module.css';
+
+import {
+    ItemListItem,
+    ItemListStateActions,
+} from '/@/renderer/components/item-list/helpers/item-list-state';
+import { ExpandedAlbumListItem } from '/@/renderer/features/albums/components/expanded-album-list-item';
+import { LibraryItem } from '/@/shared/types/domain-types';
+
+interface ExpandedListItemProps {
+    internalState: ItemListStateActions;
+    itemType: LibraryItem;
+}
+
+export const ExpandedListItem = ({ internalState, itemType }: ExpandedListItemProps) => {
+    const expandedItems = internalState.getExpanded();
+    const currentItem = expandedItems[0];
+
+    if (!currentItem) {
+        return null;
+    }
+
+    return (
+        <div className={styles.container}>
+            <div className={styles.inner}>
+                <SelectedItem item={currentItem} itemType={itemType} />
+            </div>
+        </div>
+    );
+};
+
+interface SelectedItemProps {
+    item: ItemListItem;
+    itemType: LibraryItem;
+}
+
+const SelectedItem = ({ item, itemType }: SelectedItemProps) => {
+    switch (itemType) {
+        case LibraryItem.ALBUM:
+            return <ExpandedAlbumListItem item={item} />;
+        default:
+            return null;
+    }
+};