added a sidebar notes display

device/templates/details.html

@@ -3,6 +3,43 @@
 
 {% block content %}
 
+<div class="position-fixed" style="bottom: 2rem; right: 2rem; z-index: 9999; display: flex; gap: 0.5rem;">
+  <button class="btn btn-outline-warning d-flex align-items-center shadow" type="button"
+          data-bs-toggle="offcanvas" data-bs-target="#notesOffcanvas" aria-controls="notesOffcanvas"
+          data-bs-toggle="tooltip" data-bs-placement="left" title="{% trans 'View recent notes' %}">
+    <i class="bi bi-journal-text me-1"></i>
+    {% trans "Journal" %}
+  </button>
+</div>
+
+<!-- side panel for latest notes -->
+
+<div class="offcanvas offcanvas-end" tabindex="-1" id="notesOffcanvas" aria-labelledby="notesOffcanvasLabel">
+  <div class="offcanvas-header">
+    <h5 id="notesOffcanvasLabel">{% trans "Latest Notes" %}</h5>
+    <button type="button" class="btn-close" data-bs-dismiss="offcanvas" aria-label="Close"></button>
+  </div>
+  <div class="offcanvas-body">
+    {% for note in device_notes|slice:":5" %}
+      <div class="card mb-3 shadow-sm">
+        <div class="card-body">
+          <div class="d-flex justify-content-between">
+            <small class="fw-bold">
+              {{ note.user.get_full_name|default:note.user.username }}
+            </small>
+            <small class="text-muted">
+              {{ note.date|timesince }} {% trans "ago" %}
+            </small>
+          </div>
+          <p class="mt-3 ms-2 fst-italic">{{ note.description }}</p>
+        </div>
+      </div>
+    {% empty %}
+      <p>{% trans "No notes available." %}</p>
+    {% endfor %}
+  </div>
+</div>
+<!--  -->
 <div class="row">
   <div class="col">
     <h3>{{ object.shortid }}</h3>

device/views.py

@@ -14,7 +14,7 @@ from django.views.generic.edit import (
     DeleteView,
 )
 from django.views.generic.base import TemplateView
-from action.models import StateDefinition, State, DeviceLog
+from action.models import StateDefinition, State, DeviceLog, Note
 from dashboard.mixins import DashboardView, Http403
 from evidence.models import UserProperty, SystemProperty
 from lot.models import LotTag
@@ -116,6 +116,7 @@ class DetailsView(DashboardView, TemplateView):
             "state_definitions": StateDefinition.objects.filter(institution=self.request.user.institution).order_by('order'),
             "device_states": State.objects.filter(snapshot_uuid=uuid).order_by('-date'),
             "device_logs": DeviceLog.objects.filter(snapshot_uuid=uuid).order_by('-date'),
+            "device_notes": Note.objects.filter(snapshot_uuid=uuid).order_by('-date'),
         })
         return context