[ML] Fixing kibana object list in new job from recognised index page (#…

…171935) Fixes issue where the list of kibana objects in a module are not being rendered correctly. The issue was caused by the kibana objects from the module not being initially added to the list. **Before** ![image](https://github.com/elastic/kibana/assets/22172091/e4253cc4-6f37-40a6-bfe5-808145769a3b) **After** ![image](https://github.com/elastic/kibana/assets/22172091/74fefafc-ab53-45db-be21-4c3b9e3bdcc0)
elastic · Nov 30, 2023 · a484572 · a484572
1 parent b323fc9
commit a484572
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 9 deletions.
diff --git a/x-pack/plugins/ml/public/application/jobs/new_job/recognize/components/kibana_objects.tsx b/x-pack/plugins/ml/public/application/jobs/new_job/recognize/components/kibana_objects.tsx
@@ -23,11 +23,11 @@ import { KibanaObjectUi } from '../page';
 
 export interface KibanaObjectItemProps {
   objectType: string;
-  kibanaObjects: KibanaObjectUi[];
+  kibanaObjects: KibanaObjectUi[] | undefined;
   isSaving: boolean;
 }
 
-export const KibanaObjects: FC<KibanaObjectItemProps> = memo(
+export const KibanaObjectList: FC<KibanaObjectItemProps> = memo(
   ({ objectType, kibanaObjects, isSaving }) => {
     const kibanaObjectLabels: Record<string, string> = {
       dashboard: i18n.translate('xpack.ml.newJob.recognize.dashboardsLabel', {
@@ -41,6 +41,10 @@ export const KibanaObjects: FC<KibanaObjectItemProps> = memo(
       }),
     };
 
+    if (kibanaObjects === undefined) {
+      return null;
+    }
+
     return (
       <>
         <EuiTitle size="s">
@@ -53,7 +57,7 @@ export const KibanaObjects: FC<KibanaObjectItemProps> = memo(
               <EuiFlexGroup alignItems="center" gutterSize="s">
                 <EuiFlexItem>
                   <EuiFlexGroup gutterSize="xs">
-                    <EuiFlexItem grow={false}>
+                    <EuiFlexItem>
                       <EuiText size="s" color={exists ? 'subdued' : 'success'}>
                         {title}
                       </EuiText>

diff --git a/x-pack/plugins/ml/public/application/jobs/new_job/recognize/page.tsx b/x-pack/plugins/ml/public/application/jobs/new_job/recognize/page.tsx
@@ -30,11 +30,12 @@ import {
   JobOverride,
   JobResponse,
   KibanaObject,
+  KibanaObjects,
   KibanaObjectResponse,
   ModuleJob,
 } from '../../../../../common/types/modules';
 import { CreateResultCallout } from './components/create_result_callout';
-import { KibanaObjects } from './components/kibana_objects';
+import { KibanaObjectList } from './components/kibana_objects';
 import { ModuleJobs } from './components/module_jobs';
 import { JobSettingsForm, JobSettingsFormValues } from './components/job_settings_form';
 import { TimeRange } from '../common/components';
@@ -50,10 +51,6 @@ export interface ModuleJobUI extends ModuleJob {
 
 export type KibanaObjectUi = KibanaObject & KibanaObjectResponse;
 
-export interface KibanaObjects {
-  [objectType: string]: KibanaObjectUi[];
-}
-
 interface PageProps {
   moduleId: string;
   existingGroupIds: string[];
@@ -111,6 +108,7 @@ export const Page: FC<PageProps> = ({ moduleId, existingGroupIds }) => {
     try {
       const response = await getDataRecognizerModule({ moduleId });
       setJobs(response.jobs);
+      setKibanaObjects(response.kibana);
 
       setSaveState(SAVE_STATE.NOT_SAVED);
 
@@ -365,7 +363,7 @@ export const Page: FC<PageProps> = ({ moduleId, existingGroupIds }) => {
               <EuiPanel grow={false} hasShadow={false} hasBorder>
                 {Object.keys(kibanaObjects).map((objectType, i) => (
                   <Fragment key={objectType}>
-                    <KibanaObjects
+                    <KibanaObjectList
                       objectType={objectType}
                       kibanaObjects={kibanaObjects[objectType]}
                       isSaving={saveState === SAVE_STATE.SAVING}