74 lines
2.2 KiB
TypeScript
74 lines
2.2 KiB
TypeScript
import React, { ReactElement } from "react";
|
|
import { RecentlyImported } from "./RecentlyImported";
|
|
import { WantedComicsList } from "./WantedComicsList";
|
|
import { VolumeGroups } from "./VolumeGroups";
|
|
import { LibraryStatistics } from "./LibraryStatistics";
|
|
import { PullList } from "./PullList";
|
|
import {
|
|
useGetRecentComicsQuery,
|
|
useGetWantedComicsQuery,
|
|
useGetVolumeGroupsQuery,
|
|
useGetLibraryStatisticsQuery
|
|
} from "../../graphql/generated";
|
|
|
|
export const Dashboard = (): ReactElement => {
|
|
// Use GraphQL for recent comics
|
|
const { data: recentComicsData, error: recentComicsError } = useGetRecentComicsQuery(
|
|
{ limit: 5 },
|
|
{ refetchOnWindowFocus: false }
|
|
);
|
|
|
|
// Wanted Comics - using GraphQL
|
|
const { data: wantedComicsData, error: wantedComicsError } = useGetWantedComicsQuery(
|
|
{
|
|
paginationOptions: {
|
|
page: 1,
|
|
limit: 5,
|
|
sort: '{"updatedAt": -1}'
|
|
},
|
|
predicate: '{"acquisition.source.wanted": true}'
|
|
},
|
|
{
|
|
refetchOnWindowFocus: false,
|
|
retry: false
|
|
}
|
|
);
|
|
|
|
// Volume Groups - using GraphQL
|
|
const { data: volumeGroupsData, error: volumeGroupsError } = useGetVolumeGroupsQuery(
|
|
undefined,
|
|
{ refetchOnWindowFocus: false }
|
|
);
|
|
|
|
// Library Statistics - using GraphQL
|
|
const { data: statisticsData, error: statisticsError } = useGetLibraryStatisticsQuery(
|
|
undefined,
|
|
{
|
|
refetchOnWindowFocus: false,
|
|
retry: false
|
|
}
|
|
);
|
|
|
|
const recentComics = recentComicsData?.comics?.comics || [];
|
|
const wantedComics = !wantedComicsError ? (wantedComicsData?.getComicBooks?.docs || []) : [];
|
|
const volumeGroups = volumeGroupsData?.getComicBookGroups || [];
|
|
const statistics = !statisticsError ? statisticsData?.getLibraryStatistics : undefined;
|
|
|
|
return (
|
|
<>
|
|
<div className="mx-auto max-w-screen-xl px-4 py-4 sm:px-6 sm:py-8 lg:px-8">
|
|
<PullList />
|
|
{recentComics.length > 0 && <RecentlyImported comics={recentComics} />}
|
|
{/* Wanted comics */}
|
|
<WantedComicsList comics={wantedComics} />
|
|
{/* Library Statistics */}
|
|
{statistics && <LibraryStatistics stats={statistics} />}
|
|
{/* Volume groups */}
|
|
<VolumeGroups volumeGroups={volumeGroups} />
|
|
</div>
|
|
</>
|
|
);
|
|
};
|
|
|
|
export default Dashboard;
|