Show the individual PURL fields in the Package details view #83 (#85)

Signed-off-by: tdruez <tdruez@nexb.com>

Author: tdruez

CHANGELOG.rst

@@ -48,6 +48,9 @@ Release notes
 - Add a DEJACODE_SUPPORT_EMAIL setting for support email address customization.
   https://github.com/nexB/dejacode/issues/76
 
+- Show the individual PURL fields in the Package details view.
+  https://github.com/nexB/dejacode/issues/83
+
 ### Version 5.0.1
 
 - Improve the stability of the "Check for new Package versions" feature.

component_catalog/templates/component_catalog/tabs/field_package_url_fields.html

@@ -0,0 +1,49 @@
+<dt class="col-sm-2 text-end pt-2 pe-0">
+  &nbsp;
+</dt>
+<dd class="col-sm-10">
+  <div class="container px-0">
+    <div class="row align-items-start">
+      <div class="col">
+        <span class="help_text" data-bs-placement="right" data-bs-toggle="tooltip" data-bs-title="{{ values.help_texts.type }}">
+          Type
+        </span>
+        <pre class="pre-bg-body-tertiary mt-1 mb-2">{{ values.package.type|default:"&nbsp;" }}</pre>
+      </div>
+      <div class="col">
+        <span class="help_text" data-bs-placement="right" data-bs-toggle="tooltip" data-bs-title="{{ values.help_texts.namespace }}">
+          Namespace
+        </span>
+        <pre class="pre-bg-body-tertiary mt-1 mb-2">{{ values.package.namespace|default:"&nbsp;" }}</pre>
+      </div>
+      <div class="col">
+        <span class="help_text" data-bs-placement="right" data-bs-toggle="tooltip" data-bs-title="{{ values.help_texts.name }}">
+          Name
+        </span>
+        <pre class="pre-bg-body-tertiary mt-1 mb-2">{{ values.package.name|default:"&nbsp;" }}</pre>
+      </div>
+      <div class="col">
+        <span class="help_text" data-bs-placement="right" data-bs-toggle="tooltip" data-bs-title="{{ values.help_texts.version }}">
+          Version
+        </span>
+        <pre class="pre-bg-body-tertiary mt-1 mb-2">{{ values.package.version|default:"&nbsp;" }}</pre>
+      </div>
+    </div>
+    {% if package.qualifiers or package.subpath %}
+      <div class="row align-items-start">
+        <div class="col">
+          <span class="help_text" data-bs-placement="right" data-bs-toggle="tooltip" data-bs-title="{{ values.help_texts.qualifiers }}">
+            Qualifiers
+          </span>
+          <pre class="pre-bg-body-tertiary mt-1 mb-2">{{ values.package.qualifiers|default:"&nbsp;" }}</pre>
+        </div>
+        <div class="col">
+          <span class="help_text" data-bs-placement="right" data-bs-toggle="tooltip" data-bs-title="{{ values.help_texts.subpath }}">
+            Subpath
+          </span>
+          <pre class="pre-bg-body-tertiary mt-1 mb-2">{{ values.package.subpath|default:"&nbsp;" }}</pre>
+        </div>
+      </div>
+    {% endif %}
+  </div>
+</dd>

dje/templates/tabs/tab_default.html dje/templates/tabs/field_default.htmldje/templates/tabs/tab_default.html renamed to dje/templates/tabs/field_default.html

@@ -2,7 +2,7 @@
   {% if template_name %}
     {% include template_name %}
   {% else %}
-    {% include 'tabs/tab_default.html' %}
+    {% include 'tabs/field_default.html' %}
   {% endif %}
 {% endfor %}
 {% if tab_context.extra %}

dje/templates/tabs/tab_content.html

@@ -1004,6 +1004,8 @@ def tab_history(self):
         }
 
     def get_package_fields(self, package, essential_tab=False):
+        from component_catalog.models import PACKAGE_URL_FIELDS
+
         # Always displayed in the Package "Essentials" tab context but only
         # displayed if a value is available in the Component "Packages" tab.
         essential_else_bool = None if essential_tab else bool
@@ -1024,9 +1026,20 @@ def show_usage_policy(value):
                 (_("Identifier"), package.get_absolute_link(), package.identifier_help(), None)
             )
 
+        package_url_fields_context = {
+            "package": package,
+            "help_texts": {field: ght(package._meta, field) for field in PACKAGE_URL_FIELDS},
+        }
+
         tab_fields.extend(
             [
                 (_("Package URL"), package.package_url, package.package_url_help(), None),
+                (
+                    "",
+                    package_url_fields_context,
+                    None,
+                    "component_catalog/tabs/field_package_url_fields.html",
+                ),
                 TabField("filename", package, condition=essential_else_bool),
                 TabField(
                     "usage_policy",