- RQC output of TRAICIE_SELECTION_SPECIALIST to EveAIDataCapsule

eveai_app/templates/interaction/view_data_capsule.html

@@ -0,0 +1,111 @@
+{% extends "base.html" %}
+
+{% block title %}View Data Capsule{% endblock %}
+
+{% block content_title %}Data Capsule Details{% endblock %}
+{% block content_description %}View information about this EvAI Data Capsule and its content.{% endblock %}
+
+{% block content %}
+<div class="container mt-5">
+    <!-- Basic Information Section -->
+    <h4 class="mb-3">Basis Informatie</h4>
+    <table class="table table-bordered">
+        <tr>
+            <th>ID</th>
+            <td>{{ data_capsule.id }}</td>
+        </tr>
+        <tr>
+            <th>Type</th>
+            <td>{{ data_capsule.type }}</td>
+        </tr>
+        <tr>
+            <th>Type Version</th>
+            <td>{{ data_capsule.type_version }}</td>
+        </tr>
+        <tr>
+            <th>Created At</th>
+            <td>{{ data_capsule.created_at }}</td>
+        </tr>
+        <tr>
+            <th>Chat Session ID</th>
+            <td>
+                <a href="{{ url_for('interaction_bp.view_chat_session', chat_session_id=data_capsule.chat_session_id) }}">
+                    {{ data_capsule.chat_session_id }}
+                </a>
+            </td>
+        </tr>
+    </table>
+
+    <!-- Chat Session Information Section -->
+    <h4 class="mb-3 mt-4">Chat Sessie Informatie</h4>
+    <table class="table table-bordered">
+        <tr>
+            <th>Session ID</th>
+            <td>{{ chat_session.session_id }}</td>
+        </tr>
+        <tr>
+            <th>Session Start</th>
+            <td>{{ chat_session.session_start }}</td>
+        </tr>
+        <tr>
+            <th>Session End</th>
+            <td>{{ chat_session.session_end }}</td>
+        </tr>
+    </table>
+
+    <!-- Configuration Data Section -->
+    {% if data_capsule.configuration %}
+    <h4 class="mb-3 mt-4">Configuratie</h4>
+    <div id="configuration-viewer" class="json-viewer" style="height: 300px; width: 100%; border: 1px solid #dee2e6;"></div>
+    <div id="configuration-viewer-data" class="d-none">{{ data_capsule.configuration | tojson(indent=2) }}</div>
+    {% endif %}
+
+    <!-- Capsule Data Section -->
+    {% if data_capsule.data %}
+    <h4 class="mb-3 mt-4">Data</h4>
+    <div id="data-viewer" class="json-viewer" style="height: 300px; width: 100%; border: 1px solid #dee2e6;"></div>
+    <div id="data-viewer-data" class="d-none">{{ data_capsule.data | tojson(indent=2) }}</div>
+    {% endif %}
+
+    <!-- Navigation Buttons -->
+    <div class="mt-5 mb-4">
+        <a href="{{ url_for('interaction_bp.eveai_data_capsules') }}" class="btn btn-primary">
+            <i class="fas fa-arrow-left"></i> Back to Data Capsules
+        </a>
+        <a href="{{ url_for('interaction_bp.view_chat_session', chat_session_id=data_capsule.chat_session_id) }}" class="btn btn-secondary">
+            <i class="fas fa-comments"></i> View Chat Session
+        </a>
+    </div>
+</div>
+
+<!-- Initialize JSON Editor for the data fields -->
+<script>
+    document.addEventListener('DOMContentLoaded', function() {
+        // Initialize Configuration JSON Editor if available
+        if (document.getElementById('configuration-viewer')) {
+            const configurationData = JSON.parse(document.getElementById('configuration-viewer-data').textContent);
+            const configurationViewer = new JSONEditor(document.getElementById('configuration-viewer'), {
+                mode: 'view',
+                mainMenuBar: false,
+                navigationBar: false,
+                statusBar: false,
+                readOnly: true,
+                onChangeJSON: function() { /* read only */ }
+            }, configurationData);
+        }
+
+        // Initialize Data JSON Editor if available
+        if (document.getElementById('data-viewer')) {
+            const capsuleData = JSON.parse(document.getElementById('data-viewer-data').textContent);
+            const dataViewer = new JSONEditor(document.getElementById('data-viewer'), {
+                mode: 'view',
+                mainMenuBar: false,
+                navigationBar: false,
+                statusBar: false,
+                readOnly: true,
+                onChangeJSON: function() { /* read only */ }
+            }, capsuleData);
+        }
+    });
+</script>
+{% endblock %}

eveai_app/templates/navbar.html

@@ -109,6 +109,7 @@
                                     {'name': 'Specialists', 'url': '/interaction/specialists', 'roles': ['Super User', 'Partner Admin', 'Tenant Admin']},
                                     {'name': 'Specialist Magic Links', 'url': '/interaction/specialist_magic_links', 'roles': ['Super User', 'Partner Admin', 'Tenant Admin']},
                                     {'name': 'Assets', 'url': '/interaction/assets', 'roles': ['Super User', 'Partner Admin', 'Tenant Admin']},
+                                    {'name': 'Data Capsules', 'url': '/interaction//eveai_data_capsules', 'roles': ['Super User', 'Partner Admin', 'Tenant Admin']},
                                     {'name': 'Chat Sessions', 'url': '/interaction/chat_sessions', 'roles': ['Super User', 'Partner Admin', 'Tenant Admin']},
                                 ]) }}
                             {% endif %}