[ML] Fixing capabilites polling in manage page (#163399)

On ML's management page a new capabilities poll is created every time
the user changes tabs.
`getMlGlobalServices` gets called every time the jobs list renders,
which creates a new `MlCapabilitiesService` which creates a new timer to
poll for ml's capabilities.

This change moves the `mlServices` so it isn't called on each render.
It also bumps up the interval from 1 min to 5 mins as think 1 min is a
bit too frequent.

x-pack/plugins/ml/public/application/capabilities/check_capabilities.ts

@@ -24,7 +24,7 @@ import { type MlApiServices } from '../services/ml_api_service';
 
 let _capabilities: MlCapabilities = getDefaultCapabilities();
 
-const CAPABILITIES_REFRESH_INTERVAL = 60000;
+const CAPABILITIES_REFRESH_INTERVAL = 5 * 60 * 1000; // 5min;
 
 export class MlCapabilitiesService {
   private _isLoading$ = new BehaviorSubject<boolean>(true);

x-pack/plugins/ml/public/application/management/jobs_list/components/jobs_list_page/jobs_list_page.tsx

@@ -70,6 +70,11 @@ export const JobsListPage: FC<{
   const I18nContext = coreStart.i18n.Context;
   const theme$ = coreStart.theme.theme$;
 
+  const mlServices = useMemo(
+    () => getMlGlobalServices(coreStart.http, usageCollection),
+    [coreStart.http, usageCollection]
+  );
+
   const check = async () => {
     try {
       await checkGetManagementMlJobsResolver(mlApiServices);
@@ -122,7 +127,7 @@ export const JobsListPage: FC<{
               usageCollection,
               fieldFormats,
               spacesApi,
-              mlServices: getMlGlobalServices(coreStart.http, usageCollection),
+              mlServices,
             }}
           >
             <ContextWrapper feature={PLUGIN_ID}>