Add keys for steps (future-proof)

js/src/modals/UpgradeParity/store.js

@@ -25,7 +25,7 @@ const A_DAY = 24 * 60 * A_MINUTE;
 const STEP_INFO = 0;
 const STEP_UPDATING = 1;
 const STEP_COMPLETED = 2;
-const STEP_ERROR = 3;
+const STEP_ERROR = 2;
 
 const CHECK_INTERVAL = 1 * A_MINUTE;
 

js/src/modals/UpgradeParity/upgradeParity.js

@@ -49,16 +49,20 @@ export default class UpgradeParity extends Component {
         steps={ [
           <FormattedMessage
             id='upgradeParity.step.info'
+            key='info'
             defaultMessage='upgrade available' />,
           <FormattedMessage
+            key='updating'
             id='upgradeParity.step.updating'
             defaultMessage='upgrading parity' />,
           store.step === STEP_ERROR
             ? <FormattedMessage
               id='upgradeParity.step.error'
+              key='error'
               defaultMessage='error' />
             : <FormattedMessage
               id='upgradeParity.step.completed'
+              key='completed'
               defaultMessage='upgrade completed' />
         ] }
         visible>
@@ -158,6 +162,25 @@ export default class UpgradeParity extends Component {
         );
 
       case STEP_COMPLETED:
+      case STEP_ERROR:
+        if (store.error) {
+          return (
+            <Completed>
+              <div>
+                <FormattedMessage
+                  id='upgradeParity.failed'
+                  defaultMessage='Your upgrade to Parity {newversion} has failed with an error.'
+                  values={ {
+                    newversion: <div className={ styles.version }>{ newversion }</div>
+                  } } />
+              </div>
+              <div className={ styles.error }>
+                { store.error.message }
+              </div>
+            </Completed>
+          );
+        }
+
         return (
           <Completed>
             <FormattedMessage
@@ -168,23 +191,6 @@ export default class UpgradeParity extends Component {
               } } />
           </Completed>
         );
-
-      case STEP_ERROR:
-        return (
-          <Completed>
-            <div>
-              <FormattedMessage
-                id='upgradeParity.failed'
-                defaultMessage='Your upgrade to Parity {newversion} has failed with an error.'
-                values={ {
-                  newversion: <div className={ styles.version }>{ newversion }</div>
-                } } />
-            </div>
-            <div className={ styles.error }>
-              { store.error.message }
-            </div>
-          </Completed>
-        );
     }
   }
 

js/src/ui/Modal/Title/title.js

@@ -72,7 +72,7 @@ export default class Title extends Component {
     return steps.map((label, index) => {
       return (
         <Step
-          key={ index }>
+          key={ label.key || index }>
           <StepLabel>
             { label }
           </StepLabel>