lucretia/embeddingsearch
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Implemented query listing in front-end

Browse Source
This commit is contained in:
LD-Reborn
2025-12-14 23:14:08 +01:00
parent 21194f99d3
commit 24228c05f2
1 changed files with 105 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files

136
src/Server/Views/Home/Index.cshtml
View File

@@ -1,5 +1,7 @@
@using Server.Models
@using System.Web
@using Server.Services
@inject LocalizationService T
@model HomeIndexViewModel
@{
ViewData["Title"] = "Home Page";
@@ -81,15 +83,17 @@
placeholder="filter"
/>
</div>
@* <div class="list-row">
<span>Some test query</span>
<button class="btn btn-primary btn-sm">Details</button>
</div>
<div class="list-row">
<span>Some other test query</span>
<button class="btn btn-primary btn-sm">Details</button>
</div> *@
<div class="spinner d-none"></div>
<table id="queriesTable" class="table table-striped" style="max-height: 60vh; overflow-y: auto; display: block;">
<thead>
<tr>
<th class="visually-hidden">Name</th>
<th class="visually-hidden">Action</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
</div>
@@ -116,15 +120,6 @@
<tbody>
</tbody>
</table>
@* <div class="list-row">
<span>Someentity</span>
<button class="btn btn-primary btn-sm">Details</button>
</div>
<div class="list-row">
<span>Some other test query</span>
<button class="btn btn-primary btn-sm">Details</button>
</div> *@
</div>
</div>
@@ -186,6 +181,7 @@
<script>
var domains = JSON.parse('@Html.Raw(System.Text.Json.JsonSerializer.Serialize(domains))');
var entities = null;
var queries = null;
document.addEventListener('DOMContentLoaded', () => {
const filterInput = document.getElementById('entitiesFilter');
@@ -195,36 +191,67 @@
});
});
document.addEventListener('DOMContentLoaded', () => {
const entitiesFilter = document.getElementById('entitiesFilter');
entitiesFilter.addEventListener('input', () => {
populateEntitiesTable(entitiesFilter.value);
});
const queriesFilter = document.querySelector(
'#queriesTable'
).closest('.card-body').querySelector('input');
queriesFilter.addEventListener('input', () => {
populateQueriesTable(queriesFilter.value);
});
});
function selectDomain(domainKey) {
// Deselect all domain items
document.querySelectorAll('.domain-item').forEach(item => {
item.classList.remove('active');
});
// Select the clicked domain item
var selectedItem = document.getElementById('sidebar_domain_' + domainKey);
selectedItem.classList.add('active');
// Update main content header
var domainName = domains[domainKey];
document.querySelector('.section-card h4').innerText = domainName;
// Request the entities from that searchdomain
let url = `/Entity/List?searchdomain=${encodeURIComponent(domainName)}&returnEmbeddings=false`;
let table = document.querySelector("#entitiesTable").parentElement;
/* ---------- ENTITIES ---------- */
let entitiesUrl = `/Entity/List?searchdomain=${encodeURIComponent(domainName)}&returnEmbeddings=false`;
let entitiesCard = document.querySelector("#entitiesTable").parentElement;
clearEntitiesTable();
showEntitiesLoading(table);
fetch(url)
.then(response => response.json())
showEntitiesLoading(entitiesCard);
fetch(entitiesUrl)
.then(r => r.json())
.then(data => {
entities = data.Results;
populateEntitiesTable();
hideEntitiesLoading(table);
hideEntitiesLoading(entitiesCard);
})
.catch(error => {
console.error('Error fetching entities:', error);
.catch(err => {
console.error(err);
flagSearchdomainAsErroneous(domainKey);
hideEntitiesLoading(table);
hideEntitiesLoading(entitiesCard);
});
/* ---------- QUERIES ---------- */
let queriesUrl = `/Searchdomain/GetSearches?searchdomain=${encodeURIComponent(domainName)}`;
let queriesCard = document.querySelector("#queriesTable").parentElement;
clearQueriesTable();
showQueriesLoading(queriesCard);
fetch(queriesUrl)
.then(r => r.json())
.then(data => {
queries = Object.entries(data.Searches).map(key => ({"Name": key[0], "AccessDateTimes": key[1].AccessDateTimes, "Results": key[1].Results}));
populateQueriesTable();
hideQueriesLoading(queriesCard);
})
.catch(err => {
console.error('Error fetching queries:', err);
hideQueriesLoading(queriesCard);
});
}
@@ -233,6 +260,10 @@
tableBody.innerHTML = '';
}
function clearQueriesTable() {
document.querySelector('#queriesTable tbody').innerHTML = '';
}
function populateEntitiesTable(filterText = '') {
if (!entities) return;
@@ -266,6 +297,39 @@
});
}
function populateQueriesTable(filterText = '') {
if (!queries) return;
const tbody = document.querySelector('#queriesTable tbody');
tbody.innerHTML = '';
const normalizedFilter = filterText.toLowerCase();
queries
.filter(q => q.Name?.toLowerCase().includes(normalizedFilter))
.forEach(query => {
const row = document.createElement('tr');
const nameCell = document.createElement('td');
nameCell.textContent = query.Name;
nameCell.classList.add('col-md-12');
row.appendChild(nameCell);
const actionCell = document.createElement('td');
const btn = document.createElement('button');
btn.className = 'btn btn-sm btn-primary';
btn.textContent = '@T["Details"]';
btn.addEventListener('click', () => {
runQuery(query);
});
actionCell.appendChild(btn);
row.appendChild(actionCell);
tbody.appendChild(row);
});
}
function flagSearchdomainAsErroneous(domainKey) {
var domainItem = document.getElementById('sidebar_domain_' + domainKey);
domainItem.classList.add('list-group-item-danger');
@@ -281,6 +345,16 @@
element.querySelector('.spinner').classList.add('d-none');
}
function showQueriesLoading(element = null) {
if (!element) element = document;
element.querySelector('.spinner').classList.remove('d-none');
}
function hideQueriesLoading(element = null) {
if (!element) element = document;
element.querySelector('.spinner').classList.add('d-none');
}
function showEntityDetails(entity) {
// Title
document.getElementById('entityDetailsTitle').innerText = entity.Name;