🕶Added visibility guards to volumes, stats and wanted on dashboard

src/client/components/Dashboard/LibraryStatistics.tsx

@@ -19,7 +19,7 @@ interface LibraryStatisticsProps {
  * Returns `null` when `stats` is absent or the statistics array is empty.
  */
 export const LibraryStatistics = ({ stats }: LibraryStatisticsProps): ReactElement | null => {
-  if (!stats) return null;
+  if (!stats || !stats.totalDocuments) return null;
 
   const facet = stats.statistics?.[0];
   if (!facet) return null;

src/client/components/Dashboard/VolumeGroups.tsx

@@ -11,9 +11,11 @@ type VolumeGroupsProps = {
   volumeGroups?: GetVolumeGroupsQuery['getComicBookGroups'];
 };
 
-export const VolumeGroups = (props: VolumeGroupsProps): ReactElement => {
+export const VolumeGroups = (props: VolumeGroupsProps): ReactElement | null => {
   // Till mongo gives us back the deduplicated results with the ObjectId
   const deduplicatedGroups = unionBy(props.volumeGroups, "volumes.id");
+  if (!deduplicatedGroups || deduplicatedGroups.length === 0) return null;
+
   const navigate = useNavigate();
   const navigateToVolumes = (row: any) => {
     navigate(`/volumes/all`);

src/client/components/Dashboard/WantedComicsList.tsx

@@ -15,7 +15,9 @@ type WantedComicsListProps = {
 
 export const WantedComicsList = ({
   comics,
-}: WantedComicsListProps): ReactElement => {
+}: WantedComicsListProps): ReactElement | null => {
+  if (!comics || comics.length === 0) return null;
+
   const navigate = useNavigate();
 
   // embla carousel