rework the action buttons

Signed-off-by: tdruez <tdruez@aboutcode.org>

Author: tdruez

product_portfolio/templates/product_portfolio/tabs/tab_packages_vulnerabilities.html

@@ -147,34 +147,42 @@
               {% endwith %}
             </td>
             <td class="p-1 text-nowrap">
-              <span data-bs-toggle="modal"
-                    data-bs-target="#vulnerability-analysis-modal"
-                    data-advisory-uid="{{ vulnerability.advisory_uid }}"
-                    data-package-identifier="{{ product_package.package.identifier }}"
-                    data-edit-url="{% url 'product_portfolio:vulnerability_analysis_form' product_package.uuid vulnerability.advisory_uid %}"
-              >
-                <button type="button" data-bs-toggle="tooltip" title="Edit" class="btn btn-link p-0" aria-label="Edit">
-                  <i class="far fa-edit fa-sm"></i>
-                </button>
-              </span>
-              {% if analysis_presets and not vulnerability.vulnerability_analysis %}
-                <span class="dropdown d-inline ms-1" data-bs-toggle="tooltip" title="Apply analysis preset">
-                  <button type="button" class="btn btn-link p-0" data-bs-toggle="dropdown" aria-label="Quick action">
-                    <i class="fas fa-bolt fa-sm text-warning"></i>
-                  </button>
-                  <ul class="dropdown-menu dropdown-menu-end">
-                    <li><h6 class="dropdown-header small">Apply preset</h6></li>
-                    {% for preset in analysis_presets %}
-                    <li>
-                      <button type="button" class="dropdown-item small quick-preset-btn"
-                              data-apply-url="{% url 'product_portfolio:apply_analysis_preset' product_package.uuid preset.pk vulnerability.advisory_uid %}">
-                        {{ preset.name }}
-                      </button>
-                    </li>
-                    {% endfor %}
-                  </ul>
+              <div class="d-flex flex-column align-items-center">
+                <span data-bs-toggle="modal"
+                      data-bs-target="#vulnerability-analysis-modal"
+                      data-advisory-uid="{{ vulnerability.advisory_uid }}"
+                      data-package-identifier="{{ product_package.package.identifier }}"
+                      data-edit-url="{% url 'product_portfolio:vulnerability_analysis_form' product_package.uuid vulnerability.advisory_uid %}"
+                >
+                  {% if vulnerability.vulnerability_analysis %}
+                    <button type="button" data-bs-toggle="tooltip" title="Edit analysis" class="btn btn-link p-0" aria-label="Edit analysis">
+                      <i class="far fa-edit fa-sm"></i>
+                    </button>
+                  {% else %}
+                    <button type="button" data-bs-toggle="tooltip" title="Add analysis" class="btn btn-link p-0" aria-label="Add analysis">
+                      <i class="far fa-edit fa-sm"></i>
+                    </button>
+                  {% endif %}
                 </span>
-              {% endif %}
+                {% if analysis_presets and not vulnerability.vulnerability_analysis %}
+                  <span class="dropdown d-inline mt-1" data-bs-toggle="tooltip" title="Apply analysis preset">
+                    <button type="button" class="btn btn-link p-0" data-bs-toggle="dropdown" aria-label="Quick action">
+                      <i class="fas fa-bolt fa-sm text-warning"></i>
+                    </button>
+                    <ul class="dropdown-menu dropdown-menu-end">
+                      <li><h6 class="dropdown-header small">Apply preset</h6></li>
+                      {% for preset in analysis_presets %}
+                      <li>
+                        <button type="button" class="dropdown-item small quick-preset-btn"
+                                data-apply-url="{% url 'product_portfolio:apply_analysis_preset' product_package.uuid preset.pk vulnerability.advisory_uid %}">
+                          {{ preset.name }}
+                        </button>
+                      </li>
+                      {% endfor %}
+                    </ul>
+                  </span>
+                {% endif %}
+              </div>
             </td>
             {% if not forloop.first %}</tr>{% endif %}
           {% endfor %}

product_portfolio/tests/test_views.py

@@ -348,8 +348,8 @@ def test_product_portfolio_tab_vulnerability_view_packages_row_rendering(self):
               data-package-identifier="{p1}"
               data-edit-url="/products/vulnerability_analysis/{pp1.uuid}/{vulnerability1.advisory_uid}/"
         >
-        <button type="button" data-bs-toggle="tooltip" title="Edit" class="btn btn-link p-0"
-                aria-label="Edit">
+        <button type="button" data-bs-toggle="tooltip" title="Add analysis" class="btn btn-link p-0"
+                aria-label="Add analysis">
             <i class="far fa-edit fa-sm"></i>
           </button>
         </span>