assistant history

HISTORY.rst

@@ -21,6 +21,7 @@ vNext
   - Relevant tables are added client-side visually, in real time, based on what's in the SQL editor and/or any tables
     mentioned in the assistant request. The dependency on sql_metadata is therefore removed, as server-side SQL parsing
     is no longer necessary.
+  - Ability to view Assistant request/response history.
   - Improved system prompt that emphasizes the particular SQL dialect being used.
   - Addresses issue #657.
 

explorer/assistant/forms.py

@@ -25,7 +25,7 @@ def __init__(self, *args, **kwargs):
 
         f = forms.ChoiceField(
             choices=choices,
-            widget=forms.Select(attrs={"class": "form-select"})
+            widget=forms.Select(attrs={"class": "form-select", "data-placeholder": "Select table"})
         )
 
         # We don't actually care about validating the 'choices' that the ChoiceField does by default.

explorer/src/js/assistant.js

@@ -46,8 +46,6 @@ function setupTableList() {
             removeItemButton: true,
             searchEnabled: true,
             shouldSort: false,
-            placeholder: true,
-            placeholderValue: 'Relevant tables',
             position: 'bottom'
         });
 
@@ -132,8 +130,10 @@ export function setUpAssistant(expand = false) {
 
 function getAssistantHistory() {
 
+    const historyModalId = 'historyModal';
+
     // Remove any existing modal with the same ID
-    const existingModal = document.getElementById('historyModal');
+    const existingModal = document.getElementById(historyModalId);
     if (existingModal) {
         existingModal.remove()
     }
@@ -186,7 +186,7 @@ function getAssistantHistory() {
 
         // Insert the table into a new Bootstrap modal
         const modalHtml = `
-            <div class="modal fade" id="historyModal" tabindex="-1" aria-labelledby="historyModalLabel" aria-hidden="true">
+            <div class="modal fade" id="${historyModalId}" tabindex="-1" aria-labelledby="historyModalLabel" aria-hidden="true">
                 <div class="modal-dialog modal-lg">
                     <div class="modal-content">
                         <div class="modal-header">
@@ -204,12 +204,10 @@ function getAssistantHistory() {
             </div>
         `;
 
-        // Append the modal to the body
         document.body.insertAdjacentHTML('beforeend', modalHtml);
-
-        // Show the modal
-        const historyModal = new bootstrap.Modal(document.getElementById('historyModal'));
+        const historyModal = new bootstrap.Modal(document.getElementById(historyModalId));
         historyModal.show();
+
     })
     .catch(error => {
         console.error('There was a problem with the fetch operation:', error);

explorer/src/js/explorer.js

@@ -25,7 +25,7 @@ function updateSchema() {
         });
     });
 
-    $("#schema_frame").attr("src", `../schema/${getConnElement().value}`);
+    $("#schema_frame").attr("src", `${window.baseUrlPath}schema/${getConnElement().value}`);
 }
 
 

explorer/src/js/tableDescription.js

@@ -35,7 +35,14 @@ function populateTableList() {
     });
 }
 
+function updateSchema() {
+    document.getElementById("schema_frame").src = `${window.baseUrlPath}schema/${getConnElement().value}`;
+}
+
 export function setupTableDescription() {
     getConnElement().addEventListener('change', populateTableList);
     populateTableList();
+
+    getConnElement().addEventListener('change', updateSchema);
+    updateSchema();
 }

explorer/src/scss/assistant.scss

@@ -18,3 +18,15 @@
     max-height: 120px;
     overflow: hidden;
 }
+
+.assistant-icons {
+    width: 1rem;
+    position: absolute;
+    right: .75rem;
+}
+
+#table-list {
+    .choices__inner {
+        min-height: 7rem !important;
+    }
+}