Fix display issue of badges when Sonarr or Radarr is disabled

1 files changed, 6 insertions, 6 deletions

diff --git a/frontend/src/Sidebar/index.tsx b/frontend/src/Sidebar/index.tsx
index 54cf624f9..339ab4768 100644
--- a/frontend/src/Sidebar/index.tsx
+++ b/frontend/src/Sidebar/index.tsx
@@ -42,22 +42,22 @@ const Sidebar: FunctionComponent<Props> = ({ open }) => {
 
   const { movies, episodes, providers } = useReduxStore((s) => s.site.badges);
 
+  const sonarrEnabled = useIsSonarrEnabled();
+  const radarrEnabled = useIsRadarrEnabled();
+
   const badges = useMemo<BadgeProvider>(
     () => ({
       Wanted: {
-        Series: episodes,
-        Movies: movies,
+        Series: sonarrEnabled ? episodes : 0,
+        Movies: radarrEnabled ? movies : 0,
       },
       System: {
         Providers: providers,
       },
     }),
-    [movies, episodes, providers]
+    [movies, episodes, providers, sonarrEnabled, radarrEnabled]
   );
 
-  const sonarrEnabled = useIsSonarrEnabled();
-  const radarrEnabled = useIsRadarrEnabled();
-
   const hiddenKeys = useMemo<string[]>(() => {
     const list = [];
     if (!sonarrEnabled) {