From c9696a51ac7e270accaf0629f50da76df667d7d4 Mon Sep 17 00:00:00 2001
From: Blair <dingdingbai0424@gmail.com>
Date: Wed, 24 Jul 2024 15:27:17 +0900
Subject: [PATCH] refactor action buttons

---
 .../promgen/service_action_button.html        | 28 -----------
 .../promgen/service_action_button_group.html  | 48 +++++++++++++++++++
 promgen/templates/promgen/service_block.html  | 45 +++--------------
 promgen/templates/promgen/service_detail.html |  8 +---
 4 files changed, 56 insertions(+), 73 deletions(-)
 delete mode 100644 promgen/templates/promgen/service_action_button.html
 create mode 100644 promgen/templates/promgen/service_action_button_group.html

diff --git a/promgen/templates/promgen/service_action_button.html b/promgen/templates/promgen/service_action_button.html
deleted file mode 100644
index 84bf1b67b..000000000
--- a/promgen/templates/promgen/service_action_button.html
+++ /dev/null
@@ -1,28 +0,0 @@
-{% load i18n %}
-{% load promgen %}
-
-<div class="btn-group btn-group-sm" role="group" aria-label="...">
-  <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
-    {% translate "Actions" %} <span class="caret"></span>
-  </button>
-  <ul class="dropdown-menu">
-    <li role="presentation"><a href="{% urlqs 'audit-list' service=service.id %}">{% translate "Edit History" %}</a></li>
-    <li role="presentation"><a href="{% urlqs 'alert-list' service=service.name %}">{% translate "Alert History" %}</a></li>
-
-    <hr>
-
-    <li role="presentation"><a href="{% url 'api:service-rules' name=service.name %}">{% translate "Export Rules" %}</a></li>
-    <li role="presentation"><a href="{% url 'api:service-targets' name=service.name %}">{% translate "Export Service" %}</a></li>
-
-    <hr>
-
-    <li role="presentation">
-      <a href="">
-      <form method="post" action="{% url 'service-delete' service.id %}" onsubmit="return confirm('{% translate "Delete this service?" %}')" style="display: inline">
-        {% csrf_token %}   
-          <button style="background:none;border: none;padding: 0;">{% translate "Delete Service" %}</button>  
-      </form>
-    </a>
-    </li>
-  </ul>
-</div>
diff --git a/promgen/templates/promgen/service_action_button_group.html b/promgen/templates/promgen/service_action_button_group.html
new file mode 100644
index 000000000..77bf524fd
--- /dev/null
+++ b/promgen/templates/promgen/service_action_button_group.html
@@ -0,0 +1,48 @@
+{% load i18n %}
+{% load promgen %}
+
+
+<div style="display: inline-block;">
+  <div class="btn-group btn-group-sm" role="group" aria-label="...">
+    <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+      {% translate "Actions" %} <span class="caret"></span>
+    </button>
+    <ul class="dropdown-menu">
+      <li role="presentation"><a href="{% urlqs 'audit-list' service=service.id %}">{% translate "Edit History" %}</a></li>
+      <li role="presentation"><a href="{% urlqs 'alert-list' service=service.name %}">{% translate "Alert History" %}</a></li>
+
+      <hr>
+
+      <li role="presentation"><a href="{% url 'api:service-rules' name=service.name %}">{% translate "Export Rules" %}</a></li>
+      <li role="presentation"><a href="{% url 'api:service-targets' name=service.name %}">{% translate "Export Service" %}</a></li>
+
+      <hr>
+
+      <li role="presentation">
+        <a href="">
+          <form method="post" action="{% url 'service-delete' service.id %}" onsubmit="return confirm('{% translate "Delete this service?" %}')" style="display: inline">
+            {% csrf_token %}   
+              <button style="background:none;border: none;padding: 0;">{% translate "Delete Service" %}</button>  
+          </form>
+        </a>
+      </li>
+
+      <hr>
+
+      <li>
+        <a href="">
+          <form action="{% url 'service-notifier' service.id %}" style="display:inline" method="post" v-pre>{% csrf_token %}
+            <input type="hidden" name="sender" value="promgen.notification.user">
+            <input type="hidden" name="value" value="{{request.user.username}}" />
+            <button style="background:none;border: none;padding: 0;">{% translate "Subscribe to Notifications" %}</button>
+          </form>
+        </a>
+      </li>
+
+    </ul>
+  </div>
+  <a @click="setSilenceDataset" data-service="{{service.name}}" class="btn btn-warning btn-sm ml-2 mr-2">{% translate "Silence" %}</a>
+
+  <a href="{% url 'service-update' service.id %}" class="btn btn-warning btn-sm">{% translate "Edit Service" %}</a>
+
+</div>
diff --git a/promgen/templates/promgen/service_block.html b/promgen/templates/promgen/service_block.html
index 7d768bc6d..d27003cb8 100644
--- a/promgen/templates/promgen/service_block.html
+++ b/promgen/templates/promgen/service_block.html
@@ -33,50 +33,19 @@
 
   <div class="panel panel-default">
     <div class="panel-body">
-      <div class="btn-group btn-group-sm" role="group" aria-label="...">
+      <div class="btn-group btn-group-sm mr-2" role="group" aria-label="...">
         <button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
-          {% trans "Register" %} <span class="caret"></span>
+          {% translate "Register" %} <span class="caret"></span>
         </button>
         <ul class="dropdown-menu">
-          <li role="presentation"><a href="{% url 'project-new' service.id %}">{% trans "Register Project" %}</a></li>
-          <li role="presentation"><a href="{% url 'rule-new' 'service' service.id %}">{% trans "Register Rule" %}</a></li>
-          <li role="presentation"><a href="{% url 'service-notifier' service.id %}">{% trans "Register Notifier" %}</a></li>
+          <li role="presentation"><a href="{% url 'project-new' service.id %}">{% translate "Register Project" %}</a></li>
+          <li role="presentation"><a href="{% url 'rule-new' 'service' service.id %}">{% translate "Register Rule" %}</a></li>
+          <li role="presentation"><a href="{% url 'service-notifier' service.id %}">{% translate "Register Notifier" %}</a></li>
         </ul>
       </div>
 
-      <form action="{% url 'service-notifier' service.id %}" style="display:inline" method="post" v-pre>{% csrf_token %}
-        <input type="hidden" name="sender" value="promgen.notification.user">
-        <input type="hidden" name="value" value="{{request.user.username}}" />
-        <button class="btn btn-primary btn-sm">{% trans "Subscribe to Notifications" %}</button>
-      </form>
+      {% include "promgen/service_action_button_group.html" %}
 
-      <div class="btn-group btn-group-sm" role="group" aria-label="...">
-        <button type="button" class="btn btn-info dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
-          {% trans "Change History" %} <span class="caret"></span>
-        </button>
-        <ul class="dropdown-menu">
-          <li role="presentation"><a href="{% urlqs 'audit-list' service=service.id %}">{% trans "Edit History" %}</a></li>
-          <li role="presentation"><a href="{% urlqs 'alert-list' service=service.name %}">{% trans "Alert History" %}</a></li>
-        </ul>
-      </div>
-
-      <a href="{% url 'service-update' service.id %}" class="btn btn-warning btn-sm">{% trans "Edit Service" %}</a>
-      <a @click="setSilenceDataset" data-service="{{service.name}}" class="btn btn-warning btn-sm">{% trans "Silence" %}</a>
-
-      <div class="btn-group btn-group-sm" role="group" aria-label="...">
-        <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
-          Export <span class="caret"></span>
-        </button>
-        <ul class="dropdown-menu">
-          <li role="presentation"><a href="{% url 'api:service-rules' name=service.name %}">{% trans "Export Rules" %}</a></li>
-          <li role="presentation"><a href="{% url 'api:service-targets' name=service.name %}">{% trans "Export Service" %}</a></li>
-        </ul>
-      </div>
-
-      <form method="post" action="{% url 'service-delete' service.id %}" onsubmit="return confirm('{% trans "Delete this service?" %}')" style="display: inline">
-        {% csrf_token %}
-        <button class="btn btn-danger btn-sm pull-right">{% trans "Delete Service" %}</button>
-      </form>
     </div>
   </div>
 
@@ -89,7 +58,7 @@
     </table>
     <div class="panel-footer">
       <a class="btn btn-default btn-xs" role="button" data-toggle="collapse" href=".service-site-rules-{{service.id}}" aria-expanded="false" aria-controls="collapseExample">
-        {% trans 'Show Site Rules' %}
+        {% translate 'Show Site Rules' %}
       </a>
     </div>
   </div>
diff --git a/promgen/templates/promgen/service_detail.html b/promgen/templates/promgen/service_detail.html
index 8f472d6b0..7a120e933 100644
--- a/promgen/templates/promgen/service_detail.html
+++ b/promgen/templates/promgen/service_detail.html
@@ -16,15 +16,9 @@ <h1>Service: {{ service.name }}</h1>
     {% endif %}
   </div>
   
-  <div>
-
-    {% include "promgen/service_action_button.html" %}
 
-    <a @click="setSilenceDataset" data-service="{{service.name}}" class="btn btn-warning btn-sm ml-2 mr-2">{% translate "Silence" %}</a>
+    {% include "promgen/service_action_button_group.html" %}
 
-    <a href="{% url 'service-update' service.id %}" class="btn btn-warning btn-sm">{% translate "Edit Service" %}</a>
-
-  </div>
 </div>
 
 {% breadcrumb service %}