[UI] Fix switching from one cluster to the other in the repair/schedu…

…le screens

The clusterName in state was consistently being overridden by an observable subscription which refreshes the list of clusters every 2 seconds but is missing a check to stop rewriting state.clusterName with the first cluster of the list in alphabetical order.
Also, state updates are async in React so there can be some race conditions when updating the state and reading it again. Made the select change state change use a callback to ensure serialization of actions here.

src/ui/app/jsx/repair-form.jsx

@@ -97,7 +97,8 @@ const repairForm = CreateReactClass({
       obs.subscribeOnNext(names => {
         let previousNames = this.state.clusterNames;
         this.setState({clusterNames: names});
-        if (names.length) {
+        if (names.length && !this.state.clusterName) {
+          // Set the cluster name in state if it's not set yet
           this.setState({clusterName: names[0]});
         }
         if (!previousNames.length) {
@@ -257,8 +258,10 @@ const repairForm = CreateReactClass({
     let stateValue = {};
 
     stateValue[stateName] = valueContext.value;
-    this.setState(stateValue);
+    this.setState(stateValue, ()=>this._handleSelectOnChangeCallback(stateName));
+  },
 
+  _handleSelectOnChangeCallback: function(stateName) {
     if (stateName === "clusterName") {
       this._getClusterStatus();
     }