-
-
-
File Name
- {file?.AniDB?.ID && (
-
-
-
- )}
-
-
{mediaInfo.Name}
-
-
-
-
Series Name
- {seriesInfo !== undefined && (
-
-
-
- Shoko
-
-
-
- )}
-
-
{seriesInfo?.Titles.find(x => x.Type === 'Main')?.Name ?? 'N/A'}
-
-
-
- Episode Name
-
-
{episodeInfo?.Title ?? 'N/A'}
-
+ <>
Location
@@ -258,9 +206,104 @@ const FileDetails = (props: FileSelectedProps) => {
{mediaInfo.Hashes.SHA1 ?? ''}
+ >
+ );
+});
+
+const FileDetails = React.memo(({ fileId }: { fileId: number }) => {
+ const { data: file, isPending: fileQueryIsPending } = useFileQuery(
+ fileId,
+ {
+ include: ['XRefs', 'MediaInfo', 'AbsolutePaths'],
+ includeDataFrom: ['AniDB'],
+ },
+ );
+
+ const seriesId: number = get(file, 'SeriesIDs[0].SeriesID.ID', 0);
+ const { data: seriesInfo, isPending: seriesQueryIsPending } = useSeriesQuery(
+ seriesId,
+ {},
+ !!seriesId,
+ );
+
+ const episodeId: number = get(file, 'SeriesIDs[0].EpisodeIDs[0].ID', 0);
+ const { data: episodeInfo, isPending: episodeQueryIsPending } = useEpisodeAniDBQuery(
+ episodeId,
+ !!episodeId,
+ );
+
+ const isPending = useMemo(
+ () => fileQueryIsPending || seriesQueryIsPending || episodeQueryIsPending,
+ [
+ fileQueryIsPending,
+ seriesQueryIsPending,
+ episodeQueryIsPending,
+ ],
+ );
+
+ if (isPending) {
+ return (
+
+
+
+ );
+ }
+
+ if (!file) {
+ return (
+
+ Error fetching file data!
+
+ );
+ }
+
+ return (
+
+
+
+
File Name
+ {file.AniDB?.ID && (
+
+
+
+ )}
+
+
{file.Locations[0]?.RelativePath?.split(/[\\/]+/g).pop()}
+
+
+ {seriesInfo && (
+
+
+
Series Name
+
+
+
+ Shoko
+
+
+
+
+
{seriesInfo.Name}
+
+ )}
+
+ {episodeInfo && (
+
+
+ Episode Name
+
+
{episodeInfo.Title}
+
+ )}
+
+
);
-};
+});
const FileSearch = () => {
const [sortCriteria, setSortCriteria] = useState(-FileSortCriteriaEnum.ImportedAt);
@@ -350,7 +393,7 @@ const FileSearch = () => {
{selectedRows?.length > 0 && (
-
+
@@ -365,9 +408,7 @@ const FileSearch = () => {
-
+
)}