[ML] Fix form validation.

elastic · Apr 3, 2020 · b4e2b69 · b4e2b69
1 parent f61359b
commit b4e2b69
Show file tree

Hide file tree

Showing 3 changed files with 50 additions and 23 deletions.
diff --git a/x-pack/plugins/ml/public/application/data_frame_analytics/common/analytics.ts b/x-pack/plugins/ml/public/application/data_frame_analytics/common/analytics.ts
@@ -67,6 +67,8 @@ export const SEARCH_SIZE = 1000;
 export const TRAINING_PERCENT_MIN = 1;
 export const TRAINING_PERCENT_MAX = 100;
 
+export const NUM_TOP_FEATURE_IMPORTANCE_VALUES_MIN = 0;
+
 export const defaultSearchQuery = {
   match_all: {},
 };
@@ -154,7 +156,7 @@ type AnalysisConfig =
   | ClassificationAnalysis
   | GenericAnalysis;
 
-export const getAnalysisType = (analysis: AnalysisConfig) => {
+export const getAnalysisType = (analysis: AnalysisConfig): string => {
   const keys = Object.keys(analysis);
 
   if (keys.length === 1) {
@@ -164,7 +166,11 @@ export const getAnalysisType = (analysis: AnalysisConfig) => {
   return 'unknown';
 };
 
-export const getDependentVar = (analysis: AnalysisConfig) => {
+export const getDependentVar = (
+  analysis: AnalysisConfig
+):
+  | RegressionAnalysis['regression']['dependent_variable']
+  | ClassificationAnalysis['classification']['dependent_variable'] => {
   let depVar = '';
 
   if (isRegressionAnalysis(analysis)) {
@@ -177,7 +183,11 @@ export const getDependentVar = (analysis: AnalysisConfig) => {
   return depVar;
 };
 
-export const getTrainingPercent = (analysis: AnalysisConfig) => {
+export const getTrainingPercent = (
+  analysis: AnalysisConfig
+):
+  | RegressionAnalysis['regression']['training_percent']
+  | ClassificationAnalysis['classification']['training_percent'] => {
   let trainingPercent;
 
   if (isRegressionAnalysis(analysis)) {
@@ -190,7 +200,11 @@ export const getTrainingPercent = (analysis: AnalysisConfig) => {
   return trainingPercent;
 };
 
-export const getPredictionFieldName = (analysis: AnalysisConfig) => {
+export const getPredictionFieldName = (
+  analysis: AnalysisConfig
+):
+  | RegressionAnalysis['regression']['prediction_field_name']
+  | ClassificationAnalysis['classification']['prediction_field_name'] => {
   // If undefined will be defaulted to dependent_variable when config is created
   let predictionFieldName;
   if (isRegressionAnalysis(analysis) && analysis.regression.prediction_field_name !== undefined) {
@@ -204,9 +218,12 @@ export const getPredictionFieldName = (analysis: AnalysisConfig) => {
   return predictionFieldName;
 };
 
-export const getNumTopFeatureImportanceValues = (analysis: AnalysisConfig) => {
-  // If undefined will be defaulted to dependent_variable when config is created
-  let numTopFeatureImportanceValues = 0;
+export const getNumTopFeatureImportanceValues = (
+  analysis: AnalysisConfig
+):
+  | RegressionAnalysis['regression']['num_top_feature_importance_values']
+  | ClassificationAnalysis['classification']['num_top_feature_importance_values'] => {
+  let numTopFeatureImportanceValues;
   if (
     isRegressionAnalysis(analysis) &&
     analysis.regression.num_top_feature_importance_values !== undefined

diff --git a/...ics/pages/analytics_management/components/create_analytics_form/create_analytics_form.tsx b/...ics/pages/analytics_management/components/create_analytics_form/create_analytics_form.tsx
@@ -42,6 +42,7 @@ import {
   ANALYSIS_CONFIG_TYPE,
   DfAnalyticsExplainResponse,
   FieldSelectionItem,
+  NUM_TOP_FEATURE_IMPORTANCE_VALUES_MIN,
   TRAINING_PERCENT_MIN,
   TRAINING_PERCENT_MAX,
 } from '../../../../common/analytics';
@@ -663,30 +664,37 @@ export const CreateAnalyticsForm: FC<CreateAnalyticsFormProps> = ({ actions, sta
                       'Specify the maximum number of feature importance values per document to return.',
                   }
                 )}
-                error={
-                  numTopFeatureImportanceValuesValid &&
-                  !sourceIndexNameEmpty && [
-                    i18n.translate(
-                      'xpack.ml.dataframe.analytics.create.numTopFeatureImportanceValuesErrorText',
-                      {
-                        defaultMessage: 'Invalid maximum number of feature importance values.',
-                      }
-                    ),
-                  ]
-                }
+                isInvalid={numTopFeatureImportanceValuesValid === false}
+                error={[
+                  ...(numTopFeatureImportanceValuesValid === false
+                    ? [
+                        <Fragment>
+                          {i18n.translate(
+                            'xpack.ml.dataframe.analytics.create.numTopFeatureImportanceValuesErrorText',
+                            {
+                              defaultMessage:
+                                'Invalid maximum number of feature importance values.',
+                            }
+                          )}
+                        </Fragment>,
+                      ]
+                    : []),
+                ]}
               >
                 <EuiFieldNumber
-                  disabled={false}
-                  value={numTopFeatureImportanceValues}
-                  onChange={e => setFormState({ numTopFeatureImportanceValues: +e.target.value })}
                   aria-label={i18n.translate(
                     'xpack.ml.dataframe.analytics.create.numTopFeatureImportanceValuesInputAriaLabel',
                     {
                       defaultMessage: 'Maximum number of feature importance values per document.',
                     }
                   )}
-                  isInvalid={!destinationIndexNameEmpty && !destinationIndexNameValid}
                   data-test-subj="mlAnalyticsCreateJobFlyoutnumTopFeatureImportanceValuesInput"
+                  disabled={false}
+                  isInvalid={numTopFeatureImportanceValuesValid === false}
+                  min={NUM_TOP_FEATURE_IMPORTANCE_VALUES_MIN}
+                  onChange={e => setFormState({ numTopFeatureImportanceValues: +e.target.value })}
+                  step={1}
+                  value={numTopFeatureImportanceValues}
                 />
               </EuiFormRow>
             </Fragment>

diff --git a/...ata_frame_analytics/pages/analytics_management/hooks/use_create_analytics_form/reducer.ts b/...ata_frame_analytics/pages/analytics_management/hooks/use_create_analytics_form/reducer.ts
@@ -36,6 +36,7 @@ import {
   isRegressionAnalysis,
   isClassificationAnalysis,
   ANALYSIS_CONFIG_TYPE,
+  NUM_TOP_FEATURE_IMPORTANCE_VALUES_MIN,
   TRAINING_PERCENT_MIN,
   TRAINING_PERCENT_MAX,
 } from '../../../../common/analytics';
@@ -474,7 +475,8 @@ export function reducer(state: State, action: Action): State {
 
       if (action.payload.numTopFeatureImportanceValues !== undefined) {
         newFormState.numTopFeatureImportanceValuesValid =
-          (newFormState?.numTopFeatureImportanceValues ?? 0) > 0;
+          (newFormState?.numTopFeatureImportanceValues ?? NUM_TOP_FEATURE_IMPORTANCE_VALUES_MIN) >=
+          NUM_TOP_FEATURE_IMPORTANCE_VALUES_MIN;
       }
 
       return state.isAdvancedEditorEnabled