From fe7d922cc51f114c4b349913b9d581391f5c355c Mon Sep 17 00:00:00 2001
From: Mojca Lorber <mlorber@biosistemika.com>
Date: Tue, 15 Sep 2020 11:18:15 +0200
Subject: [PATCH] Refactor complete step button

---
 app/assets/javascripts/protocols/steps.js.erb | 11 ++-----
 app/assets/stylesheets/my_modules.scss        |  4 ---
 app/assets/stylesheets/steps.scss             |  8 -----
 app/views/steps/_step.html.erb                | 30 +++++++++----------
 4 files changed, 16 insertions(+), 37 deletions(-)

diff --git a/app/assets/javascripts/protocols/steps.js.erb b/app/assets/javascripts/protocols/steps.js.erb
index d259cb8f1..158be1c55 100644
--- a/app/assets/javascripts/protocols/steps.js.erb
+++ b/app/assets/javascripts/protocols/steps.js.erb
@@ -77,21 +77,14 @@
 
             button = step.find("[data-action='complete-step']");
             button.attr("data-action", "uncomplete-step");
-            button.find(".btn").removeClass("btn-toggle").addClass("btn-default");
-            button.find("button").html('<span class="fas fa-times"></span>&nbsp;' + data.new_title);
-
-            if (data.task_ready_to_complete) {
-              $('#completed-task-modal').modal('show');
-              complete_my_module_actions();
-            }
+            button.html('<span class="fas fa-times"></span>&nbsp;' + data.new_title);
           }
           else {
             step.addClass("not-completed").removeClass("completed");
 
             button = step.find("[data-action='uncomplete-step']");
             button.attr("data-action", "complete-step");
-            button.find(".btn").removeClass("btn-default").addClass("btn-toggle");
-            button.find("button").html('<span class="fas fa-check"></span>&nbsp;' + data.new_title);
+            button.html('<span class="fas fa-check"></span>&nbsp;' + data.new_title);
           }
         },
         error: function(response) {
diff --git a/app/assets/stylesheets/my_modules.scss b/app/assets/stylesheets/my_modules.scss
index e7d0f1637..b82e1fc79 100644
--- a/app/assets/stylesheets/my_modules.scss
+++ b/app/assets/stylesheets/my_modules.scss
@@ -166,10 +166,6 @@
       display: flex;
       flex-wrap: wrap;
       max-width: 100%;
-
-      .complete-step-btn {
-        width: 100%;
-      }
     }
   }
 
diff --git a/app/assets/stylesheets/steps.scss b/app/assets/stylesheets/steps.scss
index 5d06c251c..47140a260 100644
--- a/app/assets/stylesheets/steps.scss
+++ b/app/assets/stylesheets/steps.scss
@@ -58,14 +58,6 @@
     }
   }
 
-  .complete-step-btn {
-    display: inline-block;
-
-    &.disabled {
-      pointer-events: none;
-    }
-  }
-
   .step-heading {
     align-items: center;
     border: 0;
diff --git a/app/views/steps/_step.html.erb b/app/views/steps/_step.html.erb
index 251a8a23e..71456d21a 100644
--- a/app/views/steps/_step.html.erb
+++ b/app/views/steps/_step.html.erb
@@ -28,23 +28,21 @@
       </div>
       <div class="panel-options pull-right">
         <% if step.completed? %>
-          <div data-action="uncomplete-step"
-               class="complete-step-btn <%= 'disabled' unless can_complete_or_checkbox_step?(@protocol) && !(preview) %>"
-               data-link-url="<%= toggle_step_state_step_path(step)%>">
-            <button class="btn btn-secondary btn-block <%= 'disabled' unless can_complete_or_checkbox_step?(@protocol) && !(preview) %>">
-              <span class="fas fa-times"></span>
-              <%= t("protocols.steps.options.uncomplete_title") %>
-            </button>
-          </div>
+          <button data-action="uncomplete-step"
+                  data-link-url="<%= toggle_step_state_step_path(step)%>"
+                  class="btn btn-secondary"
+                  <%= 'disabled' if !can_complete_or_checkbox_step?(@protocol) || preview %>>
+            <span class="fas fa-times"></span>
+            <%= t("protocols.steps.options.uncomplete_title") %>
+          </button>
         <% else %>
-          <div data-action="complete-step"
-               class="complete-step-btn <%= 'disabled' unless can_complete_or_checkbox_step?(@protocol) && !(preview) %>"
-               data-link-url="<%= toggle_step_state_step_path(step)%>">
-            <button class="btn btn-secondary btn-block <%= 'disabled' unless can_complete_or_checkbox_step?(@protocol) && !(preview) %>">
-              <span class="fas fa-check"></span>
-              <%= t("protocols.steps.options.complete_title") %>
-            </button>
-          </div>
+          <button data-action="complete-step"
+                  data-link-url="<%= toggle_step_state_step_path(step)%>"
+                  class="btn btn-secondary"
+                  <%= 'disabled' if !can_complete_or_checkbox_step?(@protocol) || preview %>>
+            <span class="fas fa-check"></span>
+            <%= t("protocols.steps.options.complete_title") %>
+          </button>
         <% end %>
 
         <% if (can_manage_protocol_in_module?(@protocol) ||