[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](e4253cc4-6f37-40a6-bfe5-808145769a3b)

**After**

![image](74fefafc-ab53-45db-be21-4c3b9e3bdcc0)
This commit is contained in:
James Gowdy 2023-11-30 11:15:28 +00:00 committed by GitHub
parent b323fc90a8
commit a4845721d3
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 11 additions and 9 deletions

View file

@ -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>

View file

@ -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}