Finish implementation of server-side detail view

src/servala/frontend/templates/frontend/organizations/service_instance_detail.html

@@ -0,0 +1,54 @@
+{% extends "frontend/base.html" %}
+{% load i18n static %}
+{% block html_title %}
+    {% block page_title %}
+        {{ instance.name }}
+    {% endblock page_title %}
+{% endblock html_title %}
+{% block content %}
+    <section class="section">
+        <div class="card">
+            <div class="card-body">
+                <div class="row">
+                    <div class="col-md-6">
+                        <h5>{% translate "Details" %}</h5>
+                        <dl class="row">
+                            <dt class="col-sm-4">{% translate "Service" %}</dt>
+                            <dd class="col-sm-8">
+                                {{ instance.context.service_definition.service.name }}
+                            </dd>
+                            <dt class="col-sm-4">{% translate "Service Provider" %}</dt>
+                            <dd class="col-sm-8">
+                                {{ instance.context.service_offering.provider.name }}
+                            </dd>
+                            <dt class="col-sm-4">{% translate "Control Plane" %}</dt>
+                            <dd class="col-sm-8">
+                                {{ instance.context.control_plane.name }}
+                            </dd>
+                            <dt class="col-sm-4">{% translate "Created By" %}</dt>
+                            <dd class="col-sm-8">
+                                {{ instance.created_by }}
+                            </dd>
+                            <dt class="col-sm-4">{% translate "Created At" %}</dt>
+                            <dd class="col-sm-8">
+                                {{ instance.created_at|date:"SHORT_DATETIME_FORMAT" }}
+                            </dd>
+                            <dt class="col-sm-4">{% translate "Updated At" %}</dt>
+                            <dd class="col-sm-8">
+                                {{ instance.updated_at|date:"SHORT_DATETIME_FORMAT" }}
+                            </dd>
+                            <dt class="col-sm-4">{% translate "Status" %}</dt>
+                            <dd class="col-sm-8">
+                                {% if instance.is_deleted %}
+                                    <span class="badge text-bg-secondary">{% translate "Deleted" %}</span>
+                                {% else %}
+                                    <span class="badge text-bg-success">{% translate "Active" %}</span>
+                                {% endif %}
+                            </dd>
+                        </dl>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section>
+{% endblock content %}

src/servala/frontend/urls.py

@@ -45,6 +45,11 @@ urlpatterns = [
                     views.ServiceInstanceListView.as_view(),
                     name="organization.instances",
                 ),
+                path(
+                    "instances/<slug:slug>/",
+                    views.ServiceInstanceDetailView.as_view(),
+                    name="organization.instance",
+                ),
             ]
         ),
     ),

src/servala/frontend/views/__init__.py

@@ -7,6 +7,7 @@ from .organization import (
 )
 from .service import (
     ServiceDetailView,
+    ServiceInstanceDetailView,
     ServiceInstanceListView,
     ServiceListView,
     ServiceOfferingDetailView,
@@ -19,6 +20,7 @@ __all__ = [
     "OrganizationDashboardView",
     "OrganizationUpdateView",
     "ServiceDetailView",
+    "ServiceInstanceDetailView",
     "ServiceInstanceListView",
     "ServiceListView",
     "ServiceOfferingDetailView",

src/servala/frontend/views/service.py

@@ -149,6 +149,26 @@ class ServiceOfferingDetailView(OrganizationViewMixin, HtmxViewMixin, DetailView
         return self.render_to_response(context)
 
 
+class ServiceInstanceDetailView(OrganizationViewMixin, DetailView):
+    """View to display details of a specific service instance."""
+
+    template_name = "frontend/organizations/service_instance_detail.html"
+    context_object_name = "instance"
+    model = ServiceInstance
+    permission_type = "view"
+    slug_field = "name"
+
+    def get_queryset(self):
+        """Return service instance for the current organization."""
+        return ServiceInstance.objects.filter(
+            organization=self.request.organization
+        ).select_related(
+            "context__service_offering__provider",
+            "context__control_plane",
+            "context__service_definition__service",
+        )
+
+
 class ServiceInstanceListView(OrganizationViewMixin, ListView):
     template_name = "frontend/organizations/service_instances.html"
     context_object_name = "instances"