Merge pull request #497 from shinyichen/SCIX-397-graphic-count

show graphics count in abstract nav bar
adsabs · Jul 16, 2024 · d6e420b · d6e420b
2 parents 1239f0f + 7051f8d
commit d6e420b
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 11 deletions.
diff --git a/src/api/graphics/graphics.ts b/src/api/graphics/graphics.ts
@@ -22,10 +22,12 @@ const retryFn = (count: number, error: unknown) => {
 /**
  * Fetches graphics and returns true if the request returns successfully
  */
-export const useHasGraphics: ADSQuery<IDocsEntity['bibcode'], IADSApiGraphicsResponse, null, boolean> = (
-  bibcode,
-  options,
-) => {
+export const useGetGraphicsCount: ADSQuery<
+  IDocsEntity['bibcode'],
+  IADSApiGraphicsResponse,
+  IADSApiGraphicsResponse,
+  number
+> = (bibcode, options) => {
   const params = { bibcode };
 
   const { data } = useQuery({
@@ -36,7 +38,7 @@ export const useHasGraphics: ADSQuery<IDocsEntity['bibcode'], IADSApiGraphicsRes
     ...options,
   });
 
-  return !isNil(data);
+  return data?.figures?.length ?? 0;
 };
 
 /**

diff --git a/src/components/AbstractSideNav/AbstractSideNav.tsx b/src/components/AbstractSideNav/AbstractSideNav.tsx
@@ -1,4 +1,4 @@
-import { IDocsEntity, useHasGraphics, useHasMetrics } from '@/api';
+import { IDocsEntity, useGetGraphicsCount, useHasMetrics } from '@/api';
 import { Badge } from '@chakra-ui/react';
 import { exportFormats, IMenuItem, SideNavigationMenu, TopNavigationMenu } from '@/components';
 import {
@@ -23,11 +23,11 @@ const abstractPath = '/abs';
 const useGetItems = ({
   doc,
   hasMetrics,
-  hasGraphics,
+  graphicsCount,
 }: {
   doc: IDocsEntity;
   hasMetrics: boolean;
-  hasGraphics: boolean;
+  graphicsCount: number;
 }) => {
   const router = useRouter();
   const docId = router.query.id as string;
@@ -91,7 +91,8 @@ const useGetItems = ({
       href: { pathname: `${abstractPath}/${docId}/${Routes.GRAPHICS}` },
       label: 'Graphics',
       icon: <PhotographIcon />,
-      disabled: !hasGraphics,
+      rightElement: graphicsCount > 0 ? <CountBadge count={graphicsCount} /> : null,
+      disabled: graphicsCount === 0,
     },
     [Routes.METRICS]: {
       id: Routes.METRICS,
@@ -121,9 +122,9 @@ export interface IAbstractSideNavProps extends HTMLAttributes<HTMLDivElement> {
 
 export const AbstractSideNav = (props: IAbstractSideNavProps): ReactElement => {
   const { doc } = props;
-  const hasGraphics = useHasGraphics(doc?.bibcode);
+  const graphicsCount = useGetGraphicsCount(doc?.bibcode);
   const hasMetrics = useHasMetrics(doc?.bibcode);
-  const { menuItems, activeItem } = useGetItems({ doc, hasGraphics, hasMetrics });
+  const { menuItems, activeItem } = useGetItems({ doc, graphicsCount, hasMetrics });
 
   return (
     <>