From ece09ee9a5d53e8e399356664cf191f19098b51d Mon Sep 17 00:00:00 2001
From: Anton <anton@scinote.net>
Date: Tue, 7 Mar 2023 11:44:03 +0100
Subject: [PATCH] Add empty state for protocol actions toolbar [SCI-8077]

---
 app/assets/javascripts/protocols/index.js          | 2 ++
 app/assets/stylesheets/shared/datatable.scss       | 5 +++++
 app/views/protocols/index/_action_toolbar.html.erb | 3 +++
 config/locales/en.yml                              | 1 +
 4 files changed, 11 insertions(+)

diff --git a/app/assets/javascripts/protocols/index.js b/app/assets/javascripts/protocols/index.js
index 4ca717b0a..c018524d9 100644
--- a/app/assets/javascripts/protocols/index.js
+++ b/app/assets/javascripts/protocols/index.js
@@ -695,6 +695,8 @@ var ProtocolsIndex = (function() {
     actionToolbar.find('.btn').removeClass('btn-primary').addClass('btn-light');
     actionToolbar.find('.btn:visible').first().addClass('btn-primary').removeClass('btn-light');
     actionToolbar.find('.btn').removeClass('notransition');
+
+    actionToolbar.find('.emptyPlaceholder').toggleClass('hidden', actionToolbar.find('.btn:visible').length > 0);
   }
 
   /*
diff --git a/app/assets/stylesheets/shared/datatable.scss b/app/assets/stylesheets/shared/datatable.scss
index 6b5ea33c4..23968d2d1 100644
--- a/app/assets/stylesheets/shared/datatable.scss
+++ b/app/assets/stylesheets/shared/datatable.scss
@@ -56,6 +56,11 @@
       top: 0;
       width: 100%;
 
+      .emptyPlaceholder {
+        color: $color-volcano;
+        margin-left: 12px;
+      }
+
       .btn {
         margin-right: .25em;
       }
diff --git a/app/views/protocols/index/_action_toolbar.html.erb b/app/views/protocols/index/_action_toolbar.html.erb
index 3ac83ba6a..b990c8920 100644
--- a/app/views/protocols/index/_action_toolbar.html.erb
+++ b/app/views/protocols/index/_action_toolbar.html.erb
@@ -23,4 +23,7 @@
     <i class="fas fa-undo"></i>
     <span class="button-text"><%= t("protocols.index.action_toolbar.restore") %></span>
   </button>
+  <div class="emptyPlaceholder hidden">
+    <%= t("protocols.index.action_toolbar.empty_placeholder") %>
+  </div>
 </template>
diff --git a/config/locales/en.yml b/config/locales/en.yml
index 4501d1fdb..7a4a517aa 100644
--- a/config/locales/en.yml
+++ b/config/locales/en.yml
@@ -2720,6 +2720,7 @@ en:
         export: "Export"
         archive: "Archive"
         restore: "Restore"
+        empty_placeholder: "There is no action available"
       public_description: "Team protocols are visible and can be used by everyone from the team."
       private_description: "My protocols are only visible to you."
       create_new: "New protocol"