nautobot 2.4.21__py3-none-any.whl → 3.0.0a3__py3-none-any.whl

nautobot/extras/templates/extras/role_retrieve.html

@@ -2,11 +2,11 @@
 {% load helpers %}
 
 {% block content_left_page %}
-    <div class="panel panel-default">
-        <div class="panel-heading">
+    <div class="card">
+        <div class="card-header">
             <strong>Role</strong>
         </div>
-        <table class="table table-hover panel-body attr-table">
+        <table class="table table-hover card-body attr-table">
             <tr>
                 <td>Name</td>
                 <td>
@@ -32,7 +32,7 @@
             <tr>
                 <td>Color</td>
                 <td>
-                    <span class="label color-block" style="background-color: #{{ object.color }}">&nbsp;</span>
+                    <span class="label nb-color-block" style="background-color: #{{ object.color }}">&nbsp;</span>
                 </td>
             </tr>
             <tr>
@@ -47,14 +47,14 @@
 
 {% block content_full_width_page %}
     {% if device_table %}
-        <div class="panel panel-default">
-            <div class="panel-heading">
+        <div class="card">
+            <div class="card-header">
                 <strong>Devices</strong>
             </div>
             {% include 'inc/table.html' with table=device_table %}
             {% if perms.dcim.add_device %}
-                <div class="panel-footer text-right noprint">
-                    <a href="{% url 'dcim:device_add' %}?role={{ object.pk }}" class="btn btn-xs btn-primary">
+                <div class="card-footer text-end d-print-none">
+                    <a href="{% url 'dcim:device_add' %}?role={{ object.pk }}" class="btn btn-sm btn-primary">
                         <span class="mdi mdi-plus-thick" aria-hidden="true"></span> Add Device
                     </a>
                 </div>
@@ -63,14 +63,14 @@
         {% include 'inc/paginator.html' with paginator=device_table.paginator page=device_table.page %}
     {% endif %}
     {% if interface_table %}
-        <div class="panel panel-default">
-            <div class="panel-heading">
+        <div class="card">
+            <div class="card-header">
                 <strong>Interfaces</strong>
             </div>
             {% include 'inc/table.html' with table=interface_table %}
             {% if perms.dcim.add_interface %}
-                <div class="panel-footer text-right noprint">
-                    <a href="{% url 'dcim:interface_add' %}?role={{ object.pk }}" class="btn btn-xs btn-primary">
+                <div class="card-footer text-end d-print-none">
+                    <a href="{% url 'dcim:interface_add' %}?role={{ object.pk }}" class="btn btn-sm btn-primary">
                         <span class="mdi mdi-plus-thick" aria-hidden="true"></span> Add Interface
                     </a>
                 </div>
@@ -79,14 +79,14 @@
         {% include 'inc/paginator.html' with paginator=interface_table.paginator page=interface_table.page %}
     {% endif %}
     {% if rack_table %}
-        <div class="panel panel-default">
-            <div class="panel-heading">
+        <div class="card">
+            <div class="card-header">
                 <strong>Racks</strong>
             </div>
             {% include 'inc/table.html' with table=rack_table %}
             {% if perms.dcim.add_rack %}
-                <div class="panel-footer text-right noprint">
-                    <a href="{% url 'dcim:rack_add' %}?role={{ object.pk }}" class="btn btn-xs btn-primary">
+                <div class="card-footer text-end d-print-none">
+                    <a href="{% url 'dcim:rack_add' %}?role={{ object.pk }}" class="btn btn-sm btn-primary">
                         <span class="mdi mdi-plus-thick" aria-hidden="true"></span> Add Rack
                     </a>
                 </div>
@@ -95,14 +95,14 @@
         {% include 'inc/paginator.html' with paginator=rack_table.paginator page=rack_table.page %}
     {% endif %}
     {% if ipaddress_table %}
-        <div class="panel panel-default">
-            <div class="panel-heading">
+        <div class="card">
+            <div class="card-header">
                 <strong>IP Addresses</strong>
             </div>
             {% include 'inc/table.html' with table=ipaddress_table %}
             {% if perms.ipam.add_ipaddress %}
-                <div class="panel-footer text-right noprint">
-                    <a href="{% url 'ipam:ipaddress_add' %}?role={{ object.pk }}" class="btn btn-xs btn-primary">
+                <div class="card-footer text-end d-print-none">
+                    <a href="{% url 'ipam:ipaddress_add' %}?role={{ object.pk }}" class="btn btn-sm btn-primary">
                         <span class="mdi mdi-plus-thick" aria-hidden="true"></span> Add IP Address
                     </a>
                 </div>
@@ -111,14 +111,14 @@
         {% include 'inc/paginator.html' with paginator=ipaddress_table.paginator page=ipaddress_table.page %}
     {% endif %}
     {% if prefix_table %}
-        <div class="panel panel-default">
-            <div class="panel-heading">
+        <div class="card">
+            <div class="card-header">
                 <strong>Prefixes</strong>
             </div>
             {% include 'inc/table.html' with table=prefix_table %}
             {% if perms.ipam.add_prefix %}
-                <div class="panel-footer text-right noprint">
-                    <a href="{% url 'ipam:prefix_add' %}?role={{ object.pk }}" class="btn btn-xs btn-primary">
+                <div class="card-footer text-end d-print-none">
+                    <a href="{% url 'ipam:prefix_add' %}?role={{ object.pk }}" class="btn btn-sm btn-primary">
                         <span class="mdi mdi-plus-thick" aria-hidden="true"></span> Add Prefix
                     </a>
                 </div>
@@ -127,14 +127,14 @@
         {% include 'inc/paginator.html' with paginator=prefix_table.paginator page=prefix_table.page %}
     {% endif %}
     {% if virtual_machine_table %}
-        <div class="panel panel-default">
-            <div class="panel-heading">
+        <div class="card">
+            <div class="card-header">
                 <strong>Virtual Machines</strong>
             </div>
             {% include 'inc/table.html' with table=virtual_machine_table %}
             {% if perms.virtualization.add_virtualmachine %}
-                <div class="panel-footer text-right noprint">
-                    <a href="{% url 'virtualization:virtualmachine_add' %}?role={{ object.pk }}" class="btn btn-xs btn-primary">
+                <div class="card-footer text-end d-print-none">
+                    <a href="{% url 'virtualization:virtualmachine_add' %}?role={{ object.pk }}" class="btn btn-sm btn-primary">
                         <span class="mdi mdi-plus-thick" aria-hidden="true"></span> Add Virtual Machine
                     </a>
                 </div>
@@ -143,14 +143,14 @@
         {% include 'inc/paginator.html' with paginator=virtual_machine_table.paginator page=virtual_machine_table.page %}
     {% endif %}
     {% if vminterface_table %}
-        <div class="panel panel-default">
-            <div class="panel-heading">
+        <div class="card">
+            <div class="card-header">
                 <strong>VM Interfaces</strong>
             </div>
             {% include 'inc/table.html' with table=vminterface_table %}
             {% if perms.virtualization.add_vminterface %}
-                <div class="panel-footer text-right noprint">
-                    <a href="{% url 'virtualization:vminterface_add' %}?role={{ object.pk }}" class="btn btn-xs btn-primary">
+                <div class="card-footer text-end d-print-none">
+                    <a href="{% url 'virtualization:vminterface_add' %}?role={{ object.pk }}" class="btn btn-sm btn-primary">
                         <span class="mdi mdi-plus-thick" aria-hidden="true"></span> Add VM Interface
                     </a>
                 </div>
@@ -159,14 +159,14 @@
         {% include 'inc/paginator.html' with paginator=vminterface_table.paginator page=vminterface_table.page %}
     {% endif %}
     {% if vlan_table %}
-        <div class="panel panel-default">
-            <div class="panel-heading">
+        <div class="card">
+            <div class="card-header">
                 <strong>VLANs</strong>
             </div>
             {% include 'inc/table.html' with table=vlan_table %}
             {% if perms.ipam.add_vlan %}
-                <div class="panel-footer text-right noprint">
-                    <a href="{% url 'ipam:vlan_add' %}?role={{ object.pk }}" class="btn btn-xs btn-primary">
+                <div class="card-footer text-end d-print-none">
+                    <a href="{% url 'ipam:vlan_add' %}?role={{ object.pk }}" class="btn btn-sm btn-primary">
                         <span class="mdi mdi-plus-thick" aria-hidden="true"></span> Add VLAN
                     </a>
                 </div>
@@ -176,14 +176,14 @@
     {% endif %}
     <div class="row"></div>
     {% if controller_table %}
-        <div class="panel panel-default">
-            <div class="panel-heading">
+        <div class="card">
+            <div class="card-header">
                 <strong>Controllers</strong>
             </div>
             {% include 'inc/table.html' with table=controller_table %}
             {% if perms.dcim.add_controller %}
-                <div class="panel-footer text-right noprint">
-                    <a href="{% url 'dcim:controller_add' %}?role={{ object.pk }}" class="btn btn-xs btn-primary">
+                <div class="card-footer text-end d-print-none">
+                    <a href="{% url 'dcim:controller_add' %}?role={{ object.pk }}" class="btn btn-sm btn-primary">
                         <span class="mdi mdi-plus-thick" aria-hidden="true"></span> Add Controller
                     </a>
                 </div>
@@ -192,14 +192,14 @@
         {% include 'inc/paginator.html' with paginator=controller_table.paginator page=controller_table.page %}
     {% endif %}
     {% if module_table %}
-        <div class="panel panel-default">
-            <div class="panel-heading">
+        <div class="card">
+            <div class="card-header">
                 <strong>Modules</strong>
             </div>
             {% include 'inc/table.html' with table=module_table %}
             {% if perms.dcim.add_module %}
-                <div class="panel-footer text-right noprint">
-                    <a href="{% url 'dcim:module_add' %}?role={{ object.pk }}" class="btn btn-xs btn-primary">
+                <div class="card-footer text-end d-print-none">
+                    <a href="{% url 'dcim:module_add' %}?role={{ object.pk }}" class="btn btn-sm btn-primary">
                         <span class="mdi mdi-plus-thick" aria-hidden="true"></span> Add Module
                     </a>
                 </div>
@@ -208,14 +208,14 @@
         {% include 'inc/paginator.html' with paginator=module_table.paginator page=module_table.page %}
     {% endif %}
     {% if vdc_table %}
-        <div class="panel panel-default">
-            <div class="panel-heading">
+        <div class="card">
+            <div class="card-header">
                 <strong>Virtual Device Contexts</strong>
             </div>
             {% include 'inc/table.html' with table=vdc_table %}
             {% if perms.dcim.add_virtualdevicecontext %}
-                <div class="panel-footer text-right noprint">
-                    <a href="{% url 'dcim:virtualdevicecontext_add' %}?role={{ object.pk }}" class="btn btn-xs btn-primary">
+                <div class="card-footer text-end d-print-none">
+                    <a href="{% url 'dcim:virtualdevicecontext_add' %}?role={{ object.pk }}" class="btn btn-sm btn-primary">
                         <span class="mdi mdi-plus-thick" aria-hidden="true"></span> Add Virtual Device Context
                     </a>
                 </div>
@@ -223,4 +223,68 @@
         </div>
         {% include 'inc/paginator.html' with paginator=vdc_table.paginator page=vdc_table.page %}
     {% endif %}
+    {% if vpn_table %}
+        <div class="card">
+            <div class="card-header">
+                <strong>VPNs</strong>
+            </div>
+            {% include 'inc/table.html' with table=vpn_table %}
+            {% if perms.vpn.add_vpn %}
+                <div class="card-footer text-end d-print-none">
+                    <a href="{% url 'vpn:vpn_add' %}?role={{ object.pk }}" class="btn btn-sm btn-primary">
+                        <span class="mdi mdi-plus-thick" aria-hidden="true"></span> Add VPN
+                    </a>
+                </div>
+            {% endif %}
+        </div>
+        {% include 'inc/paginator.html' with paginator=vpn_table.paginator page=vpn_table.page %}
+    {% endif %}
+    {% if vpn_profile_table %}
+        <div class="card">
+            <div class="card-header">
+                <strong>VPN Profiles</strong>
+            </div>
+            {% include 'inc/table.html' with table=vpn_profile_table %}
+            {% if perms.vpn.add_vpnprofile %}
+                <div class="card-footer text-end d-print-none">
+                    <a href="{% url 'vpn:vpnprofile_add' %}?role={{ object.pk }}" class="btn btn-sm btn-primary">
+                        <span class="mdi mdi-plus-thick" aria-hidden="true"></span> Add VPN Profile
+                    </a>
+                </div>
+            {% endif %}
+        </div>
+        {% include 'inc/paginator.html' with paginator=vpn_profile_table.paginator page=vpn_profile_table.page %}
+    {% endif %}
+    {% if vpn_tunnel_table %}
+        <div class="card">
+            <div class="card-header">
+                <strong>VPN Tunnels</strong>
+            </div>
+            {% include 'inc/table.html' with table=vpn_tunnel_table %}
+            {% if perms.vpn.add_vpntunnel %}
+                <div class="card-footer text-end d-print-none">
+                    <a href="{% url 'vpn:vpntunnel_add' %}?role={{ object.pk }}" class="btn btn-sm btn-primary">
+                        <span class="mdi mdi-plus-thick" aria-hidden="true"></span> Add VPN Tunnel
+                    </a>
+                </div>
+            {% endif %}
+        </div>
+        {% include 'inc/paginator.html' with paginator=vpn_tunnel_table.paginator page=vpn_tunnel_table.page %}
+    {% endif %}
+    {% if vpn_tunnel_endpoint_table %}
+        <div class="card">
+            <div class="card-header">
+                <strong>VPN Tunnel Endpoints</strong>
+            </div>
+            {% include 'inc/table.html' with table=vpn_tunnel_endpoint_table %}
+            {% if perms.vpn.add_vpntunnelendpoint %}
+                <div class="card-footer text-end d-print-none">
+                    <a href="{% url 'vpn:vpntunnelendpoint_add' %}?role={{ object.pk }}" class="btn btn-sm btn-primary">
+                        <span class="mdi mdi-plus-thick" aria-hidden="true"></span> Add VPN Tunnel Endpoint
+                    </a>
+                </div>
+            {% endif %}
+        </div>
+        {% include 'inc/paginator.html' with paginator=vpn_tunnel_endpoint_table.paginator page=vpn_tunnel_endpoint_table.page %}
+    {% endif %}
 {% endblock content_full_width_page %}

nautobot/extras/templates/extras/scheduledjob.html

@@ -6,17 +6,10 @@
 {% load plugins %}
 {% load tz %}
 
-{% block buttons %}
-    {% plugin_buttons object %}
-    {% if user|can_delete:object %}
-        {% delete_button object %}
-    {% endif %}
-{% endblock buttons %}
-
 {% block content %}
     {% if not job_class_found %}
         <div class="alert alert-danger">
-            <i class="mdi mdi-alert"></i>
+            <span class="mdi mdi-alert"></span>
             This job source for this scheduled job is no longer installed.
             This scheduled job will fail to run unless reinstalled at the original location.
         </div>
@@ -24,12 +17,22 @@
     {{ block.super }}
 {% endblock content %}
 
+{% block extra_nav_tabs %}
+    {% if perms.extras.view_approvalworkflow and object.associated_approval_workflows.exists %}
+        {% if active_tab != 'approval_workflow' and object.get_approval_workflow_url or active_tab == 'approval_workflow' %}
+            <li class="nav-item" role="presentation">
+                <a href="{{ object.get_approval_workflow_url }}" class="nav-link{% if active_tab == 'approval_workflow' %} active{% endif %}">Approval Workflow</a>
+            </li>
+        {% endif %}
+    {% endif %}
+{% endblock extra_nav_tabs %}
+
 {% block content_left_page %}
-    <div class="panel panel-default">
-        <div class="panel-heading">
+    <div class="card">
+        <div class="card-header">
             <strong>Scheduled Job</strong>
         </div>
-        <table class="table table-hover panel-body attr-table">
+        <table class="table table-hover card-body attr-table">
             <tr>
                 <td>Name</td>
                 <td>
@@ -63,24 +66,18 @@
                 <td>{{ object.approval_required | render_boolean }}</td>
             </tr>
             <tr>
-                <td>Approver</td>
-                <td>
-                    {{ object.approved_by_user | placeholder }}
-                </td>
-            </tr>
-            <tr>
-                <td>Approved At</td>
+                <td>Decision Date</td>
                 <td>
-                    {{ object.approved_at | placeholder }}
+                    {{ object.decision_date | placeholder }}
                 </td>
             </tr>
         </table>
     </div>
-    <div class="panel panel-default">
-        <div class="panel-heading">
+    <div class="card">
+        <div class="card-header">
             <strong>Scheduling</strong>
         </div>
-        <table class="table table-hover panel-body attr-table">
+        <table class="table table-hover card-body attr-table">
             <tr>
                 <td>Enabled?</td>
                 <td>{{ object.enabled | render_boolean }}</td>
@@ -135,11 +132,11 @@
 {% endblock %}
 {% block content_right_page %}
     {% if job_class_found %}
-        <div class="panel panel-default">
-            <div class="panel-heading">
+        <div class="card">
+            <div class="card-header">
                 <strong>User Inputs</strong>
             </div>
-            <table class="table table-hover panel-body attr-table">
+            <table class="table table-hover card-body attr-table">
                 {% for key, value in object.kwargs.items %}
                     <tr>
                         <td>{{ labels|get_item:key }}</td>
@@ -151,11 +148,11 @@
             </table>
         </div>
     {% endif %}
-    <div class="panel panel-default">
-        <div class="panel-heading">
+    <div class="card">
+        <div class="card-header">
             <strong>Celery Keyword Arguments</strong>
         </div>
-        <div class="panel-body">
+        <div class="card-body">
             {% include 'extras/inc/json_data.html' with data=object.celery_kwargs format="json" %}
         </div>
     </div>

nautobot/extras/templates/extras/secret_create.html

@@ -2,28 +2,28 @@
 {% load form_helpers %}
 
 {% block form %}
-    <div class="panel panel-default">
-        <div class="panel-heading"><strong>Secret</strong></div>
-        <div class="panel-body">
+    <div class="card">
+        <div class="card-header"><strong>Secret</strong></div>
+        <div class="card-body">
             {% render_field form.name %}
             {% render_field form.description %}
             {% render_field form.provider %}
         </div>
     </div>
-    <div class="panel panel-default">
-        <div class="panel-heading"><strong>Parameters</strong></div>
-        <div class="panel-body">
-            <span class="help-block">
+    <div class="card">
+        <div class="card-header"><strong>Parameters</strong></div>
+        <div class="card-body">
+            <span class="form-text">
                 All parameter values can be entered as Jinja2 templates if desired.
                 The requesting object (device, Git repository, etc.), if any, will be provided
                 as context variable <code>obj</code>.
             </span>
             <ul class="nav nav-tabs" role="tablist">
-                <li role="presentation" class="active">
-                    <a href="#parameters_form" role="tab" data-toggle="tab">Form</a>
+                <li role="presentation" class="nav-item">
+                    <a class="nav-link active" href="#parameters_form" role="tab" data-bs-toggle="tab">Form</a>
                 </li>
-                <li role="presentation">
-                    <a href="#parameters_json" role="tab" data-toggle="tab">JSON</a>
+                <li class="nav-item" role="presentation">
+                    <a class="nav-link" href="#parameters_json" role="tab" data-bs-toggle="tab">JSON</a>
                 </li>
             </ul>
             <div class="tab-content">

nautobot/extras/templates/extras/secretsgroup_update.html

@@ -3,16 +3,16 @@
 {% load form_helpers %}
 
 {% block form %}
-    <div class="panel panel-default">
-        <div class="panel-heading"><strong>Secrets Group</strong></div>
-        <div class="panel-body">
+    <div class="card">
+        <div class="card-header"><strong>Secrets Group</strong></div>
+        <div class="card-body">
             {% render_field form.name %}
             {% render_field form.description %}
         </div>
     </div>
-    <div class="panel panel-default">
-        <div class="panel-heading"><strong>Secret Assignment</strong></div>
-        <div class="panel-body">
+    <div class="card">
+        <div class="card-header"><strong>Secret Assignment</strong></div>
+        <div class="card-body">
             {% if secrets.errors %}
                 <div class="text-danger">
                     Please correct the error(s) below:

nautobot/extras/templates/extras/staticgroupassociation_retrieve.html

@@ -2,11 +2,11 @@
 {% load helpers %}
 
 {% block content_left_page %}
-    <div class="panel panel-default">
-        <div class="panel-heading">
+    <div class="card">
+        <div class="card-header">
             <strong>Static Group Association</strong>
         </div>
-        <table class="table table-hover panel-body attr-table">
+        <table class="table table-hover card-body attr-table">
             <tr>
                 <td>Dynamic Group</td>
                 <td>{{ object.dynamic_group|hyperlinked_object }}</td>

nautobot/extras/templates/extras/status.html

@@ -1,2 +1,2 @@
 {% extends 'generic/object_retrieve.html' %}
-{% comment %}3.0 TODO: remove this template, which only exists for backward compatibility with 2.4 and earlier{% endcomment %}
+{% comment %}3.0 TODO: remove this template, which only exists for backward compatibility with 2.4 and earlier{% endcomment %}

nautobot/extras/templates/extras/tag.html

@@ -1,2 +1,2 @@
 {% extends 'generic/object_retrieve.html' %}
-{% comment %}3.0 TODO: remove this template, which only exists for backward compatibility with 2.4 and earlier{% endcomment %}
+{% comment %}3.0 TODO: remove this template, which only exists for backward compatibility with 2.4 and earlier{% endcomment %}

nautobot/extras/templates/extras/tag_update.html

@@ -2,9 +2,9 @@
 {% load form_helpers %}
 
 {% block form %}
-    <div class="panel panel-default">
-        <div class="panel-heading"><strong>Tag</strong></div>
-        <div class="panel-body">
+    <div class="card">
+        <div class="card-header"><strong>Tag</strong></div>
+        <div class="card-body">
             {% render_field form.name %}
             {% render_field form.color %}
             {% render_field form.description %}

nautobot/extras/templates/extras/templatetags/log_level.html

@@ -1 +1 @@
-<label class="label label-{{ class }}">{{ name }}</label>
+<label class="badge bg-{{ class }}">{{ name }}</label>

nautobot/extras/templates/extras/templatetags/plugin_object_detail_tabs.html

@@ -2,8 +2,8 @@
 {% render_tabs_labels ui_component_tabs %}
 {% for tabs in plugin_object_detail_tabs %}
     {% for tab_id, tab in tabs.items %}
-        <li role="presentation"{% if active_tab == tab_id %} class="active"{% endif %}>
-            <a href="{{ tab.url }}?tab={{ tab_id }}">{{ tab.title }}</a>
+        <li role="presentation" class="nav-item">
+            <a class="nav-link{% if active_tab == tab_id %} active{% endif %}" href="{{ tab.url }}?tab={{ tab_id }}">{{ tab.title }}</a>
         </li>
     {% endfor %}
 {% endfor %}

nautobot/extras/templates/extras/webhook.html

@@ -2,12 +2,12 @@
 {% load helpers %}
 
 {% block content_left_page %}
-    <div class="panel panel-default">
-        <div class="panel-heading">
+    <div class="card">
+        <div class="card-header">
             <strong>Webhook</strong>
         </div>
 
-        <table class="table table-hover panel-body attr-table">
+        <table class="table table-hover card-body attr-table">
             <tr>
                 <td>Object Type(s)</td>
                 <td>
@@ -39,11 +39,11 @@
 
     </div>
 
-    <div class="panel panel-default">
-        <div class="panel-heading">
+    <div class="card">
+        <div class="card-header">
             <strong>HTTP</strong>
         </div>
-        <table class="table table-hover panel-body attr-table">
+        <table class="table table-hover card-body attr-table">
             <tr>
                 <td>HTTP Method</td>
                 <td><span>{{ object.http_method }}</span></td>
@@ -63,11 +63,11 @@
         </table>
     </div>
 
-    <div class="panel panel-default">
-        <div class="panel-heading">
+    <div class="card">
+        <div class="card-header">
             <strong>Security</strong>
         </div>
-        <table class="table table-hover panel-body attr-table">
+        <table class="table table-hover card-body attr-table">
             <tr>
                 <td>Secret</td>
                 <td>{{ object.secret | placeholder }}</td>
@@ -85,11 +85,11 @@
 {% endblock content_left_page %}
 
 {% block content_right_page %}
-    <div class="panel panel-default">
-        <div class="panel-heading">
+    <div class="card">
+        <div class="card-header">
             <strong>Body Template</strong>
         </div>
-        <div class="panel-body">
+        <div class="card-body">
             {% if object.body_template %} <pre>{{ object.body_template }}</pre> {% else %} {{ None }} {% endif %}
         </div>
     </div>

nautobot/extras/templatetags/approvals.py

@@ -0,0 +1,19 @@
+from django import template
+from django.utils.html import format_html
+from django_jinja import library
+
+from nautobot.extras.choices import ApprovalWorkflowStateChoices
+
+register = template.Library()
+
+
+@library.filter()
+@register.filter()
+def render_approval_workflow_state(value):
+    """
+    Render an approval state value as a colored label.
+    """
+    if value:
+        css_class = ApprovalWorkflowStateChoices.CSS_CLASSES.get(value)
+        return format_html('<span class="badge bg-{}">{}</span>', css_class, value)
+    return ""