fix: remove eventhandler

Author: astandrik

src/components/AutoRefreshControl/AutoRefreshControl.tsx

@@ -13,19 +13,17 @@ const b = cn('auto-refresh-control');
 
 interface AutoRefreshControlProps {
     className?: string;
-    onManualRefresh?: () => void;
 }
 
-export function AutoRefreshControl({className, onManualRefresh}: AutoRefreshControlProps) {
+export function AutoRefreshControl({className}: AutoRefreshControlProps) {
     const dispatch = useTypedDispatch();
     const [autoRefreshInterval, setAutoRefreshInterval] = useAutoRefreshInterval();
     return (
         <div className={b(null, className)}>
             <Button
                 view="flat-secondary"
                 onClick={() => {
-                    dispatch(api.util.invalidateTags(['All']));
-                    onManualRefresh?.();
+                    dispatch(api.util.invalidateTags(['All', 'ManualRefresh']));
                 }}
                 extraProps={{'aria-label': i18n('Refresh')}}
             >

src/containers/Tenant/Diagnostics/Diagnostics.tsx

@@ -174,13 +174,7 @@ function Diagnostics(props: DiagnosticsProps) {
                         }}
                         allowNotSelected={true}
                     />
-                    <AutoRefreshControl
-                        onManualRefresh={() => {
-                            //this is needed to collect healthcheck if it is disabled by default https://github.com/ydb-platform/ydb-embedded-ui/issues/1889
-                            const event = new CustomEvent('diagnosticsRefresh');
-                            document.dispatchEvent(event);
-                        }}
-                    />
+                    <AutoRefreshControl />
                 </div>
             </div>
         );

src/containers/Tenant/Diagnostics/TenantOverview/Healthcheck/HealthcheckPreview.tsx

@@ -63,26 +63,13 @@ export function HealthcheckPreview(props: HealthcheckPreviewProps) {
         },
     );
 
-    const [getHealthcheckQuery, {currentData: manualData, isFetching: isFetchingManually}] =
-        healthcheckApi.useLazyGetHealthcheckInfoQuery();
-
-    React.useEffect(() => {
-        if (metricsTab === 'healthcheck' && healthcheckPreviewDisabled) {
-            getHealthcheckQuery({database: tenantName});
-        }
-    }, [metricsTab, healthcheckPreviewDisabled, tenantName, getHealthcheckQuery]);
-
-    React.useEffect(() => {
-        const fetchHealthcheck = () => {
-            if (healthcheckPreviewDisabled) {
-                getHealthcheckQuery({database: tenantName});
-            }
-        };
-        document.addEventListener('diagnosticsRefresh', fetchHealthcheck);
-        return () => {
-            document.removeEventListener('diagnosticsRefresh', fetchHealthcheck);
-        };
-    }, [tenantName, healthcheckPreviewDisabled, getHealthcheckQuery]);
+    const {currentData: manualData, isFetching: isFetchingManually} =
+        healthcheckApi.useGetManualHealthcheckInfoQuery(
+            {database: tenantName},
+            {
+                skip: !healthcheckPreviewDisabled || metricsTab !== 'healthcheck',
+            },
+        );
 
     const loading =
         (isFetching && data === undefined) || (isFetchingManually && manualData === undefined);

src/store/reducers/api.ts

@@ -9,7 +9,16 @@ export const api = createApi({
      */
     endpoints: () => ({}),
     invalidationBehavior: 'immediately',
-    tagTypes: ['All', 'PDiskData', 'PreviewData', 'StorageData', 'Tablet', 'UserData', 'VDiskData'],
+    tagTypes: [
+        'All',
+        'PDiskData',
+        'PreviewData',
+        'StorageData',
+        'Tablet',
+        'UserData',
+        'VDiskData',
+        'ManualRefresh',
+    ],
 });
 
 export const _NEVER = Symbol();

src/store/reducers/healthcheckInfo/healthcheckInfo.ts

@@ -25,6 +25,23 @@ export const healthcheckApi = api.injectEndpoints({
             },
             providesTags: ['All'],
         }),
+        getManualHealthcheckInfo: builder.query({
+            queryFn: async (
+                {database, maxLevel}: {database: string; maxLevel?: number; disabled?: boolean},
+                {signal},
+            ) => {
+                try {
+                    const data = await window.api.viewer.getHealthcheckInfo(
+                        {database, maxLevel},
+                        {signal},
+                    );
+                    return {data};
+                } catch (error) {
+                    return {error};
+                }
+            },
+            providesTags: ['ManualRefresh'],
+        }),
     }),
     overrideExisting: 'throw',
 });