[ML] Progress to include step. (elastic#65305)

Changes the way progress is reported to include the steps and the progress for each step.
walterra · May 5, 2020 · a2d4bac · a2d4bac
1 parent c5f486a
commit a2d4bac
Show file tree

Hide file tree

Showing 2 changed files with 40 additions and 11 deletions.
diff --git a/...ion/data_frame_analytics/pages/analytics_management/components/analytics_list/columns.tsx b/...ion/data_frame_analytics/pages/analytics_management/components/analytics_list/columns.tsx
@@ -66,15 +66,21 @@ export const getTaskStateBadge = (
 
 export const progressColumn = {
   name: i18n.translate('xpack.ml.dataframe.analyticsList.progress', {
-    defaultMessage: 'Progress',
+    defaultMessage: 'Progress per Step',
   }),
   sortable: (item: DataFrameAnalyticsListRow) => getDataFrameAnalyticsProgress(item.stats),
   truncateText: true,
   render(item: DataFrameAnalyticsListRow) {
-    const progress = getDataFrameAnalyticsProgress(item.stats);
+    const totalSteps = item.stats.progress.length;
+    let step = 0;
+    let progress = 0;
 
-    if (progress === undefined) {
-      return null;
+    for (const progressStep of item.stats.progress) {
+      step++;
+      progress = progressStep.progress_percent;
+      if (progressStep.progress_percent < 100) {
+        break;
+      }
     }
 
     // For now all analytics jobs are batch jobs.
@@ -98,6 +104,11 @@ export const progressColumn = {
             <EuiFlexItem style={{ width: '35px' }} grow={false}>
               <EuiText size="xs">{`${progress}%`}</EuiText>
             </EuiFlexItem>
+            <EuiFlexItem style={{ width: '21px' }} grow={false}>
+              <EuiText size="xs">
+                {step}/{totalSteps}
+              </EuiText>
+            </EuiFlexItem>
           </Fragment>
         )}
         {!isBatchTransform && (
@@ -118,7 +129,7 @@ export const progressColumn = {
       </EuiFlexGroup>
     );
   },
-  width: '100px',
+  width: '130px',
   'data-test-subj': 'mlAnalyticsTableColumnProgress',
 };
 

diff --git a/...ata_frame_analytics/pages/analytics_management/components/analytics_list/expanded_row.tsx b/...ata_frame_analytics/pages/analytics_management/components/analytics_list/expanded_row.tsx
@@ -171,17 +171,35 @@ export const ExpandedRow: FC<Props> = ({ item }) => {
     position: 'left',
   };
 
+  const totalSteps = item.stats.progress.length;
+  let step = 0;
+  for (const progressStep of item.stats.progress) {
+    step++;
+    if (progressStep.progress_percent < 100) {
+      break;
+    }
+  }
+
   const progress: SectionConfig = {
     title: i18n.translate(
       'xpack.ml.dataframe.analyticsList.expandedRow.tabs.jobSettings.progress',
       { defaultMessage: 'Progress' }
     ),
-    items: item.stats.progress.map(s => {
-      return {
-        title: s.phase,
-        description: <ProgressBar progress={s.progress_percent} />,
-      };
-    }),
+    items: [
+      {
+        title: i18n.translate(
+          'xpack.ml.dataframe.analyticsList.expandedRow.tabs.jobSettings.step',
+          { defaultMessage: 'Step' }
+        ),
+        description: `${step}/${totalSteps}`,
+      },
+      ...item.stats.progress.map(s => {
+        return {
+          title: s.phase,
+          description: <ProgressBar progress={s.progress_percent} />,
+        };
+      }),
+    ],
     position: 'left',
   };