From 28adb4956d6285064ba3d0533636d726f0504758 Mon Sep 17 00:00:00 2001
From: Ivan Kljun <ivan@scinote.net>
Date: Tue, 22 Aug 2023 14:30:49 +0200
Subject: [PATCH] Add 'Not started' btn to other views

---
 app/assets/javascripts/experiments/table.js         |  3 ++-
 app/assets/stylesheets/dashboard/current_tasks.scss |  4 ++++
 app/assets/stylesheets/experiment/canvas.scss       |  4 ++++
 app/assets/stylesheets/experiment/table.scss        |  4 ++++
 app/assets/stylesheets/mixins.scss                  |  4 ++++
 app/assets/stylesheets/my_modules/status_flow.scss  |  9 +++------
 app/views/canvas/full_zoom/_my_module.html.erb      | 13 +++++++------
 app/views/dashboards/current_tasks/_task.html.erb   |  5 ++++-
 8 files changed, 32 insertions(+), 14 deletions(-)

diff --git a/app/assets/javascripts/experiments/table.js b/app/assets/javascripts/experiments/table.js
index 1ac0f5da5..a6e950d72 100644
--- a/app/assets/javascripts/experiments/table.js
+++ b/app/assets/javascripts/experiments/table.js
@@ -43,7 +43,8 @@ var ExperimnetTable = {
       return `<a href="${data.url}">${data.count}</a>`;
     },
     status: function(data) {
-      return `<div class="my-module-status" style="background-color: ${data.color}">${data.name}</div>`;
+      return `<div class="my-module-status ${data.name === 'Not started' ? 'btn-not-started' : ''}" 
+        style="background-color: ${data.color}">${data.name}</div>`;
     },
     assigned: function(data) {
       return data.html;
diff --git a/app/assets/stylesheets/dashboard/current_tasks.scss b/app/assets/stylesheets/dashboard/current_tasks.scss
index 3942b8f03..136b5d7a1 100644
--- a/app/assets/stylesheets/dashboard/current_tasks.scss
+++ b/app/assets/stylesheets/dashboard/current_tasks.scss
@@ -211,6 +211,10 @@
           color: $color-white;
           font-weight: bold;
           padding: .25em .5em;
+
+          &.btn-not-started {
+            @include not-started;
+          }
         }
       }
 
diff --git a/app/assets/stylesheets/experiment/canvas.scss b/app/assets/stylesheets/experiment/canvas.scss
index 8ff80f37e..ccbc5efa9 100644
--- a/app/assets/stylesheets/experiment/canvas.scss
+++ b/app/assets/stylesheets/experiment/canvas.scss
@@ -35,6 +35,10 @@
       padding: 2px 8px;
       text-overflow: ellipsis;
       white-space: nowrap;
+
+      &.btn-not-started {
+        @include not-started;
+      }
     }
   }
 
diff --git a/app/assets/stylesheets/experiment/table.scss b/app/assets/stylesheets/experiment/table.scss
index 45ff04911..dcc31613b 100644
--- a/app/assets/stylesheets/experiment/table.scss
+++ b/app/assets/stylesheets/experiment/table.scss
@@ -359,6 +359,10 @@
       padding: 2px 8px;
       text-overflow: ellipsis;
       white-space: nowrap;
+
+      &.btn-not-started {
+        @include not-started;
+      }
     }
 
     .table-row-placeholder-divider {
diff --git a/app/assets/stylesheets/mixins.scss b/app/assets/stylesheets/mixins.scss
index 57731f5c1..4ef83e460 100644
--- a/app/assets/stylesheets/mixins.scss
+++ b/app/assets/stylesheets/mixins.scss
@@ -77,6 +77,10 @@
   width: .5em;
 }
 
+@mixin not-started {
+  border: 1px solid var(--sn-sleepy-grey);
+  color: var(--sn-black);
+}
 
 // Material design mixins
 
diff --git a/app/assets/stylesheets/my_modules/status_flow.scss b/app/assets/stylesheets/my_modules/status_flow.scss
index 42740920c..087c41c39 100644
--- a/app/assets/stylesheets/my_modules/status_flow.scss
+++ b/app/assets/stylesheets/my_modules/status_flow.scss
@@ -13,8 +13,7 @@
       width: 100%;
 
       &.btn-not-started {
-        border: 1px solid var(--sn-sleepy-grey);
-        color: var(--sn-black);
+        @include not-started;
       }
 
       .caret {
@@ -74,8 +73,7 @@
       }
 
       .btn-not-started {
-        border: 1px solid var(--sn-sleepy-grey);
-        color: var(--sn-black);
+        @include not-started;
       }
 
       .error-message {
@@ -139,8 +137,7 @@
         white-space: nowrap;
 
         &.btn-not-started {
-          border: 1px solid var(--sn-sleepy-grey);
-          color: var(--sn-black);
+          @include not-started;
         }
       }
 
diff --git a/app/views/canvas/full_zoom/_my_module.html.erb b/app/views/canvas/full_zoom/_my_module.html.erb
index a0033b664..faa32a901 100644
--- a/app/views/canvas/full_zoom/_my_module.html.erb
+++ b/app/views/canvas/full_zoom/_my_module.html.erb
@@ -65,12 +65,13 @@
       </div>
     </div>
 
-    <div class="status-label" style="--state-color: <%= my_module.my_module_status.color %>">
-      <% if my_module.status_changing %>
-        <i class="fas fa-spinner fa-spin"></i>
-        <span><%= t('experiments.canvas.full_zoom.status_transitioning_label') %></span>
-      <% end %>
-      <%= my_module.my_module_status.name %>
+    <div class="status-label <%= 'btn-not-started' if my_module.my_module_status.name == 'Not started' %>"
+      style="--state-color: <%= my_module.my_module_status.color %>">
+        <% if my_module.status_changing %>
+          <i class="fas fa-spinner fa-spin"></i>
+          <span><%= t('experiments.canvas.full_zoom.status_transitioning_label') %></span>
+        <% end %>
+        <%= my_module.my_module_status.name %>
     </div>
   </div>
 
diff --git a/app/views/dashboards/current_tasks/_task.html.erb b/app/views/dashboards/current_tasks/_task.html.erb
index 4d75589ce..f8c479274 100644
--- a/app/views/dashboards/current_tasks/_task.html.erb
+++ b/app/views/dashboards/current_tasks/_task.html.erb
@@ -16,6 +16,9 @@
     <% end %>
   </div>
   <div class="task-status-container row-border">
-    <span class="task-status" style="background:<%= task.status_color %>"><%= task.status_name %></span>
+    <span class="task-status <%= 'btn-not-started' if task.status_name == 'Not started' %>"
+      style="background:<%= task.status_color %>">
+        <%= task.status_name %>
+    </span>
   </div>
 </a>