Add FetchedDataTitleCard and update MusicTitleCard

src/components/TitleCard/FetchedDataTitleCard.tsx

@@ -0,0 +1,64 @@
+import TitleCard from '@app/components/TitleCard';
+import { MediaType } from '@server/constants/media';
+import type {
+  ArtistResult,
+  RecordingResult,
+  ReleaseGroupResult,
+  ReleaseResult,
+  WorkResult,
+} from '@server/models/Search';
+
+export interface FetchedDataTitleCardProps {
+  data:
+    | ArtistResult
+    | ReleaseGroupResult
+    | ReleaseResult
+    | WorkResult
+    | RecordingResult;
+  canExpand?: boolean;
+}
+
+const FetchedDataTitleCard = ({
+  canExpand,
+  data,
+}: FetchedDataTitleCardProps) => {
+  if (data.mediaType === 'artist') {
+    const newData = data as ArtistResult;
+    return (
+      <TitleCard
+        id={data.id}
+        image={data.posterPath}
+        status={newData.mediaInfo?.status}
+        title={newData.name}
+        mediaType={data.mediaType}
+        canExpand={canExpand}
+      />
+    );
+  } else if (data.mediaType === 'release-group') {
+    return (
+      <TitleCard
+        id={data.id}
+        image={data.posterPath}
+        status={data.mediaInfo?.status}
+        title={data.title}
+        mediaType={data.mediaType}
+        canExpand={canExpand}
+        type={data.type ?? MediaType.MUSIC}
+      />
+    );
+  } else if (data.mediaType === 'release') {
+    return (
+      <TitleCard
+        id={data.id}
+        image={data.posterPath}
+        status={data.mediaInfo?.status}
+        title={data.title}
+        mediaType={data.mediaType}
+        canExpand={canExpand}
+      />
+    );
+  }
+  return null;
+};
+
+export default FetchedDataTitleCard;

src/components/TitleCard/MusicTitleCard.tsx

@@ -1,6 +1,6 @@
 import TitleCard from '@app/components/TitleCard';
 import { Permission, useUser } from '@app/hooks/useUser';
-import { SecondaryType } from '@server/constants/media';
+import { MediaType, SecondaryType } from '@server/constants/media';
 import type {
   ArtistResult,
   RecordingResult,
@@ -16,6 +16,13 @@ export interface MusicBrainTitleCardProps {
   mbId: string;
   type?: SecondaryType;
   canExpand?: boolean;
+  displayType?: string;
+  preData?:
+    | ArtistResult
+    | ReleaseGroupResult
+    | ReleaseResult
+    | WorkResult
+    | RecordingResult;
 }
 
 const MusicTitleCard = ({
@@ -23,6 +30,7 @@ const MusicTitleCard = ({
   mbId,
   canExpand,
   type = SecondaryType.ARTIST,
+  displayType,
 }: MusicBrainTitleCardProps) => {
   const { hasPermission } = useUser();
 
@@ -76,6 +84,7 @@ const MusicTitleCard = ({
         title={data.title}
         mediaType={data.mediaType}
         canExpand={canExpand}
+        type={displayType ?? MediaType.MUSIC}
       />
     );
   }