fix the bug that index field is not getting populated when editing a …

…detector

Signed-off-by: Jackie Han <jkhanjob@gmail.com>

public/pages/DefineDetector/components/Datasource/DataSource.tsx

@@ -1,14 +1,3 @@
-/*
- * SPDX-License-Identifier: Apache-2.0
- *
- * The OpenSearch Contributors require contributions made to
- * this file be licensed under the Apache-2.0 license or a
- * compatible open source license.
- *
- * Modifications Copyright OpenSearch Contributors. See
- * GitHub history for details.
- */
-
 import { EuiComboBox, EuiCallOut, EuiSpacer } from '@elastic/eui';
 import { Field, FieldProps, FormikProps, useFormikContext } from 'formik';
 import { debounce, get } from 'lodash';
@@ -17,18 +6,10 @@ import { useDispatch, useSelector } from 'react-redux';
 import { CatIndex, IndexAlias } from '../../../../../server/models/types';
 import ContentPanel from '../../../../components/ContentPanel/ContentPanel';
 import { AppState } from '../../../../redux/reducers';
-import {
-  getIndices,
-  getMappings,
-  getPrioritizedIndices,
-} from '../../../../redux/reducers/opensearch';
+import { getIndices, getMappings, getPrioritizedIndices } from '../../../../redux/reducers/opensearch';
 import { getError, isInvalid } from '../../../../utils/utils';
 import { IndexOption } from './IndexOption';
-import {
-  getDataSourceFromURL,
-  getVisibleOptions,
-  sanitizeSearchText,
-} from '../../../utils/helpers';
+import { getDataSourceFromURL, getVisibleOptions, sanitizeSearchText } from '../../../utils/helpers';
 import { validateIndex } from '../../../utils/validate';
 import { DataFilterList } from '../DataFilterList/DataFilterList';
 import { FormattedFormRow } from '../../../../components/FormattedFormRow/FormattedFormRow';
@@ -61,14 +42,14 @@ export function DataSource(props: DataSourceProps) {
   const { setFieldValue } = useFormikContext();
 
   useEffect(() => {
-    setFieldValue('index', []);
-    setFieldValue('timeField', undefined);
-    setFieldValue('filters', []);
-
-    const getInitialIndices = async () => {
+    // Fetch initial indices and set initial form values when the component mounts or when dataSourceId changes
+    const fetchInitialIndices = async () => {
       await dispatch(getIndices(queryText, dataSourceId));
+      setFieldValue('index', props.formikProps.values.index);
+      setFieldValue('timeField', props.formikProps.values.timeField);
+      setFieldValue('filters', props.formikProps.values.filters);
     };
-    getInitialIndices();
+    fetchInitialIndices();
   }, [dataSourceId]);
 
   useEffect(() => {