Reenable Pipeline operation buttons if pipeline trigger fails (#5153) (#5278)

* On successfully accepting the pipeline-trigger request (status:202),
  we disable the trigger buttons to disallow users from trigger pipeline multiple times.
* Though, if the pipeline scheduling fails for MDU issue, the pipeline operation
  buttons are not enabled.
* The dashboard API says {"schedulable": true}, but as we've manually disabled the buttons
  on the trigger call, there is inconsistency between the view and the data.
* Force a redraw on the next dashboard api response to make buttons either enabled or
  disabled based on the Dashboard API response.

* Also, as the operation buttons' state is refreshed on the next dashboard api response,
  those can be enabled within a span of 0-10 sec

Author: GaneshSPatil

server/webapp/WEB-INF/rails/spec/webpack/views/dashboard/pipeline_widget_spec.js

@@ -949,6 +949,7 @@ describe("Dashboard Pipeline Widget", () => {
       view() {
         return m(PipelineWidget, {
           pipeline,
+          invalidateEtag: () => {},
           isQuickEditPageEnabled,
           pluginsSupportingAnalytics,
           shouldShowAnalyticsIcon,

server/webapp/WEB-INF/rails/webpack/views/dashboard/dashboard_groups_widget.js.msx

@@ -29,7 +29,7 @@ const Group = {
     return <div class="dashboard-group" key={vm.name}>
       <GroupHeading {...vnode.attrs} />
       <ul class="dashboard-group_items">
-        {_.map(pipelines, (pipeline) => <PipelineWidget pipeline={pipeline} key={pipeline.name} {...sharedArgs} />)}
+        {_.map(pipelines, (pipeline) => <PipelineWidget invalidateEtag={vnode.attrs.invalidateEtag} pipeline={pipeline} key={pipeline.name} {...sharedArgs} />)}
       </ul>
     </div>;
   }
@@ -40,7 +40,9 @@ const DashboardGroupsWidget = {
     const sharedArgs = _.assign({}, vnode.attrs);
     delete sharedArgs.groups;
 
-    return _.map(vnode.attrs.groups, (group) => <Group vm={group} {...sharedArgs} />);
+    return _.map(vnode.attrs.groups, (group) => <Group vm={group}
+                                                       invalidateEtag={vnode.attrs.invalidateEtag}
+                                                       {...sharedArgs} />);
   }
 };
 

server/webapp/WEB-INF/rails/webpack/views/dashboard/dashboard_widget.js.msx

@@ -79,8 +79,10 @@ const DashboardWidget = {
           </section>
 
           {messageView}
-          <DashboardGroupsWidget groups={vm.filteredGroups(personalizeVM.currentFilter())} scheme={vm.scheme()}
-                                 resolver={dashboard} {...sharedGroupArgs} />
+          <DashboardGroupsWidget scheme={vm.scheme()}
+                                 invalidateEtag={vm.invalidateEtag}
+                                 resolver={dashboard} {...sharedGroupArgs}
+                                 groups={vm.filteredGroups(personalizeVM.currentFilter())}/>
         </div>
       </div>
     );

server/webapp/WEB-INF/rails/webpack/views/dashboard/models/dashboard_view_model.js

@@ -114,11 +114,15 @@ function DashboardViewModel(dashboard) {
 
   let dropdownPipelineName, dropdownPipelineCounter;
 
+  const self = this;
+
   _.assign(this, {
     dashboard,
 
     etag: Stream(null),
 
+    invalidateEtag: () => self.etag(null),
+
     dropdown: {
       isOpen: (name, instanceCounter) => ((name === dropdownPipelineName) && (instanceCounter === dropdownPipelineCounter)),
 

server/webapp/WEB-INF/rails/webpack/views/dashboard/pipeline_header_widget.js.msx

@@ -76,6 +76,7 @@ const PipelineHeaderWidget = {
           </div>
         </div>
         <PipelineOperationsWidget pipeline={vnode.attrs.pipeline}
+                                  invalidateEtag={vnode.attrs.invalidateEtag}
                                   doCancelPolling={vnode.attrs.doCancelPolling}
                                   doRefreshImmediately={vnode.attrs.doRefreshImmediately}
                                   operationMessages={vnode.attrs.operationMessages}/>

server/webapp/WEB-INF/rails/webpack/views/dashboard/pipeline_operations_widget.js.msx

@@ -35,6 +35,7 @@ const PipelineOperationsWidget = {
       pipeline.trigger(options).then((res) => {
         pipeline.triggerDisabled(true);
         operationMessages.success(pipeline.name, res.message);
+        vnode.attrs.invalidateEtag();
       }, (res) => {
         operationMessages.failure(pipeline.name, res.responseJSON.message);
       });

server/webapp/WEB-INF/rails/webpack/views/dashboard/pipeline_widget.js.msx

@@ -46,6 +46,7 @@ const PipelineWidget = {
       <li class="dashboard-group_pipeline">
         <div class="pipeline">
           <PipelineHeaderWidget pipeline={vnode.attrs.pipeline}
+                                invalidateEtag={vnode.attrs.invalidateEtag}
                                 doCancelPolling={vnode.attrs.doCancelPolling}
                                 doRefreshImmediately={vnode.attrs.doRefreshImmediately}
                                 pluginsSupportingAnalytics={vnode.attrs.pluginsSupportingAnalytics}