Refine the warning message UI and disable actions buttons #310

Signed-off-by: tdruez <[email protected]>

Author: tdruez

dje/templates/object_details_base.html

@@ -22,7 +22,7 @@
           <h1 class="header-title text-break">
             {% block header_title %}
               {{ object|truncatechars:100 }}
-              <small class="ms-1" style="font-size: 70%">
+              <small class="ms-1" style="font-size: 65%">
                 {% if is_user_dataspace %}
                   {% if has_change_permission %}
                     {% with object.get_change_url as object_change_url %}

product_portfolio/templates/product_portfolio/product_details.html

@@ -4,7 +4,13 @@
 
 {% block pager-toolbar %}
   {% if is_user_dataspace %}
-    {% if has_edit_productcomponent or has_edit_productpackage or has_change_codebaseresource_permission or has_add_productcomponent %}
+    {% if product.is_locked %}
+      <span class="d-inline-block" data-bs-toggle="tooltip" title="Inventory is locked">
+        <button type="button" class="btn btn-outline-dark dropdown-toggle" disabled>
+          <i class="fas fa-tasks"></i> Manage
+        </button>
+      </span>
+    {% elif has_edit_productcomponent or has_edit_productpackage or has_change_codebaseresource_permission or has_add_productcomponent %}
       <div class="dropdown btn-group">
         <a class="btn btn-outline-dark dropdown-toggle" data-bs-toggle="dropdown" role="button" href="#"><i class="fas fa-tasks"></i> {% trans 'Manage' %}</a>
         <div class="dropdown-menu dropdown-menu-end">
@@ -31,9 +37,17 @@
       </div>
     {% endif %}
 
-    {% if has_scan_all_packages or has_change_permission %}
+    {% if product.is_locked %}
+      <span class="d-inline-block" data-bs-toggle="tooltip" title="Inventory is locked">
+        <button type="button" class="btn btn-outline-dark dropdown-toggle" disabled>
+          <i class="fas fa-toolbox"></i> Actions
+        </button>
+      </span>
+    {% elif has_scan_all_packages or has_change_permission %}
       <div class="dropdown btn-group">
-        <a class="btn btn-outline-dark dropdown-toggle" data-bs-toggle="dropdown" role="button" href="#"><i class="fas fa-toolbox"></i>&nbsp;Actions</a>
+        <a class="btn btn-outline-dark dropdown-toggle" data-bs-toggle="dropdown" role="button" href="#">
+          <i class="fas fa-toolbox"></i> Actions
+        </a>
         <div class="dropdown-menu dropdown-menu-end">
           <div class="dropdown-header">Import</div>
           {% if has_change_permission %}
@@ -111,11 +125,6 @@
 {% endblock %}
 
 {% block content %}
-  {% if product.is_locked %}
-    <small class="d-inline-flex mb-3 px-2 py-1 fw-semibold text-warning-emphasis bg-warning-subtle border border-warning-subtle rounded-2">
-      This product version is marked as read-only, preventing any modifications to its inventory.
-    </small>
-  {% endif %}
   {{ block.super }}
   {% if has_scan_all_packages %}
     {% include 'product_portfolio/modals/scan_all_packages_modal.html' %}
@@ -138,6 +147,19 @@
   {% endif %}
 {% endblock %}
 
+{% block messages-alert %}
+  {% if product.is_locked %}
+    <div class="container pe-0">
+      <div class="alert alert-warning alert-dismissible mb-2 py-2" role="alert">
+        <strong>
+          This product version is marked as read-only, preventing any modifications to its inventory.
+        </strong>
+      </div>
+    </div>
+  {% endif %}
+  {{ block.super }}
+{% endblock %}
+
 {% block extrastyle %}
   {{ block.super }}
   {% if has_edit_productpackage or has_edit_productcomponent %}

product_portfolio/views.py

@@ -194,6 +194,7 @@ def get_queryset(self):
                 "primary_language",
                 "keywords",
                 "configuration_status",
+                "is_locked",
                 "request_count",
                 "dataspace",
             )

reporting/templates/reporting/report_run.html

@@ -15,7 +15,7 @@
           </div>
           <h1 class="header-title">
             {{ object.name }}
-            <small class="ms-1" style="font-size: 70%">
+            <small class="ms-1" style="font-size: 65%">
               {% if user.is_staff and has_change_permission %}
                 <a href="{{ object.get_admin_url }}" data-bs-toggle="tooltip" title="Edit" target="_blank"><i class="far fa-edit"></i></a>
               {% endif %}