From d3df262ad58866dd612cd3621502d911329d582c Mon Sep 17 00:00:00 2001
From: Pete Harverson <pete@elastic.co>
Date: Mon, 16 Mar 2020 17:36:27 +0000
Subject: [PATCH] [ML] Add key prop to error messages map

---
 .../components/analytics_list/expanded_row.tsx             | 7 ++++---
 .../components/create_analytics_form/messages.tsx          | 6 +++---
 2 files changed, 7 insertions(+), 6 deletions(-)

diff --git a/x-pack/plugins/ml/public/application/data_frame_analytics/pages/analytics_management/components/analytics_list/expanded_row.tsx b/x-pack/plugins/ml/public/application/data_frame_analytics/pages/analytics_management/components/analytics_list/expanded_row.tsx
index 27bafc60ce943a..43ef6b36c39720 100644
--- a/x-pack/plugins/ml/public/application/data_frame_analytics/pages/analytics_management/components/analytics_list/expanded_row.tsx
+++ b/x-pack/plugins/ml/public/application/data_frame_analytics/pages/analytics_management/components/analytics_list/expanded_row.tsx
@@ -159,13 +159,14 @@ export const ExpandedRow: FC<Props> = ({ item }) => {
       defaultMessage: 'State',
     }),
     items: Object.entries(stateValues).map(([stateKey, stateValue]) => {
-      if (stateKey.toString() === 'state') {
+      const title = stateKey.toString();
+      if (title === 'state') {
         return {
-          title: stateKey.toString(),
+          title,
           description: getTaskStateBadge(getItemDescription(stateValue)),
         };
       }
-      return { title: stateKey.toString(), description: getItemDescription(stateValue) };
+      return { title, description: getItemDescription(stateValue) };
     }),
     position: 'left',
   };
diff --git a/x-pack/plugins/ml/public/application/data_frame_analytics/pages/analytics_management/components/create_analytics_form/messages.tsx b/x-pack/plugins/ml/public/application/data_frame_analytics/pages/analytics_management/components/create_analytics_form/messages.tsx
index 65691c3e494860..68a9a264ddf787 100644
--- a/x-pack/plugins/ml/public/application/data_frame_analytics/pages/analytics_management/components/create_analytics_form/messages.tsx
+++ b/x-pack/plugins/ml/public/application/data_frame_analytics/pages/analytics_management/components/create_analytics_form/messages.tsx
@@ -4,7 +4,7 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
-import React, { FC } from 'react';
+import React, { Fragment, FC } from 'react';
 
 import { EuiCallOut, EuiCodeBlock, EuiSpacer } from '@elastic/eui';
 
@@ -18,7 +18,7 @@ export const Messages: FC<Props> = ({ messages }) => {
   return (
     <>
       {messages.map((requestMessage, i) => (
-        <>
+        <Fragment key={i}>
           <EuiCallOut
             title={requestMessage.message}
             color={requestMessage.error !== undefined ? 'danger' : 'primary'}
@@ -32,7 +32,7 @@ export const Messages: FC<Props> = ({ messages }) => {
             )}
           </EuiCallOut>
           <EuiSpacer size="s" />
-        </>
+        </Fragment>
       ))}
     </>
   );