diff --git a/src/api/graphics/graphics.ts b/src/api/graphics/graphics.ts index 563cfcb8d..601f1cf4e 100644 --- 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 = ( - 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 { 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: , - disabled: !hasGraphics, + rightElement: graphicsCount > 0 ? : null, + disabled: graphicsCount === 0, }, [Routes.METRICS]: { id: Routes.METRICS, @@ -121,9 +122,9 @@ export interface IAbstractSideNavProps extends HTMLAttributes { 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 ( <>