feat: dont fetch render for false graphshard (#2803)

Author: astandrik

src/components/QueriesActivityBar/useQueriesActivityData.ts

@@ -1,8 +1,10 @@
 import React from 'react';
 
+import {selectGraphShardExists} from '../../store/reducers/capabilities/capabilities';
 import {topQueriesApi} from '../../store/reducers/executeTopQueries/executeTopQueries';
 import type {KeyValueRow} from '../../types/api/query';
 import {useAutoRefreshInterval} from '../../utils/hooks';
+import {useTypedSelector} from '../../utils/hooks/useTypedSelector';
 import type {TimeFrame} from '../../utils/timeframes';
 import {chartApi} from '../MetricChart/reducer';
 
@@ -26,6 +28,10 @@ export function useQueriesActivityData(tenantName: string): UseQueriesActivityDa
 
     const shouldRefresh = autoRefreshInterval;
 
+    // Respect GraphShardExists if explicitly false for the specific tenant
+    const graphShardExists = useTypedSelector((state) => selectGraphShardExists(state, tenantName));
+    const skipCharts = graphShardExists === false;
+
     const {data: runningQueriesData} = topQueriesApi.useGetRunningQueriesQuery(
         {
             database: tenantName,
@@ -45,7 +51,7 @@ export function useQueriesActivityData(tenantName: string): UseQueriesActivityDa
             timeFrame: QUERIES_TIME_FRAME,
             maxDataPoints: 30,
         },
-        {pollingInterval: shouldRefresh},
+        {pollingInterval: shouldRefresh, skip: skipCharts},
     );
 
     const {data: latencyData} = chartApi.useGetChartDataQuery(
@@ -55,21 +61,24 @@ export function useQueriesActivityData(tenantName: string): UseQueriesActivityDa
             timeFrame: LATENCIES_TIME_FRAME,
             maxDataPoints: 30,
         },
-        {pollingInterval: shouldRefresh},
+        {pollingInterval: shouldRefresh, skip: skipCharts},
     );
 
     const runningQueriesCount = runningQueriesData?.resultSets?.[0]?.result?.length || 0;
 
     // Determine chart availability from queries API success/error state
     const areChartsAvailable = React.useMemo(() => {
+        if (skipCharts) {
+            return false;
+        }
         if (queriesSuccess) {
             return true;
         }
         if (queriesError) {
             return false;
         }
         return null; // Still loading
-    }, [queriesSuccess, queriesError]);
+    }, [queriesSuccess, queriesError, skipCharts]);
 
     const qps = React.useMemo(
         () => calculateQueriesPerSecond(queriesPerSecData?.metrics?.[0]?.data),

src/containers/Tenant/Diagnostics/TenantOverview/TenantDashboard/TenantDashboard.tsx

@@ -42,14 +42,19 @@ export const TenantDashboard = ({database, charts}: TenantDashboardProps) => {
     // Refetch data only if dashboard successfully loaded
     const shouldRefresh = isDashboardHidden ? 0 : autoRefreshInterval;
 
+    // Do not render charts at all when GraphShard capability explicitly says it's absent
+    if (graphShardExists === false) {
+        return null;
+    }
+
     /**
      * Charts should be hidden, if they are not enabled:
      * 1. GraphShard is not enabled
      * 2. ydb version does not have /viewer/json/render endpoint (400, 404, CORS error, etc.)
      *
      * If at least one chart successfully loaded, dashboard should be shown
      * This fallback behavior is only used when GraphShardExists capability is not available or false
-     * @link https://github.com/ydb-platform/ydb-embedded-ui/issues/659
+     * Link: https://github.com/ydb-platform/ydb-embedded-ui/issues/659
      * @todo disable only for specific errors ('GraphShard is not enabled') after ydb-stable-24 is generally used
      */
     const handleChartDataStatusChange = (chartStatus: ChartDataStatus) => {