-
{album.trackList[trackNum].trackArtist} - {album.trackList[trackNum].trackTitle}
+
{isShowAlbumInfo ?
:
}
+ {isShowAlbumInfo ?
:
}
diff --git a/src/PhotoContainer.tsx b/src/components/PhotoContainer.tsx
similarity index 83%
rename from src/PhotoContainer.tsx
rename to src/components/PhotoContainer.tsx
index 60550d8..2a0ae6b 100644
--- a/src/PhotoContainer.tsx
+++ b/src/components/PhotoContainer.tsx
@@ -1,6 +1,6 @@
-import {AlbumMetadata} from "./AlbumMetadata.ts";
+import {AlbumMetadata} from "../models/AlbumMetadata.ts";
import React from "react";
-import hostName from "./Config.ts";
+import hostName from "../Config.ts";
interface PhotoContainerProps {
imageList: AlbumMetadata[],
diff --git a/src/TrackInfo.tsx b/src/components/TrackInfo.tsx
similarity index 100%
rename from src/TrackInfo.tsx
rename to src/components/TrackInfo.tsx
diff --git a/src/components/TrackInfoDisplay.tsx b/src/components/TrackInfoDisplay.tsx
new file mode 100644
index 0000000..1e11d72
--- /dev/null
+++ b/src/components/TrackInfoDisplay.tsx
@@ -0,0 +1,11 @@
+interface TrackInfoDisplayProps {
+ artist: string,
+ track: string
+}
+export default function TrackInfoDisplay(props: Readonly
) {
+ return (
+
+
{`${props.artist} - `}{props.track}
+
+ )
+}
\ No newline at end of file
diff --git a/src/components/TrackListing.tsx b/src/components/TrackListing.tsx
new file mode 100644
index 0000000..9fd00a0
--- /dev/null
+++ b/src/components/TrackListing.tsx
@@ -0,0 +1,20 @@
+import {AlbumTrackInfo} from "../models/AlbumTrackInfo.ts";
+
+interface TrackListingProps {
+ trackList: AlbumTrackInfo[],
+ isOneArtist: boolean,
+ trackNumber: number
+}
+export default function TrackListing(props: Readonly) {
+ return (
+
+ {props.trackList.map((track, index) => {
+ let rawKeyString = `${track.trackNumber}${track.trackArtist}${track.trackTitle}`
+ let isCurrentTrack = index===props.trackNumber
+ return (
+
{track.trackNumber}. {!props.isOneArtist && `${track.trackArtist} - `}{track.trackTitle}
+ )
+ })}
+
+ )
+}
\ No newline at end of file
diff --git a/src/AlbumInfo.ts b/src/models/AlbumInfo.ts
similarity index 100%
rename from src/AlbumInfo.ts
rename to src/models/AlbumInfo.ts
diff --git a/src/AlbumMetadata.ts b/src/models/AlbumMetadata.ts
similarity index 100%
rename from src/AlbumMetadata.ts
rename to src/models/AlbumMetadata.ts
diff --git a/src/AlbumTrackInfo.ts b/src/models/AlbumTrackInfo.ts
similarity index 100%
rename from src/AlbumTrackInfo.ts
rename to src/models/AlbumTrackInfo.ts