Handle >100 search results

This commit is contained in:
Ceda EI 2025-05-03 09:22:06 +05:30
parent 98a5cf7c50
commit 68f1c516b8

View File

@ -54,7 +54,7 @@ async function getSection(start: number) {
}
function getNextSection() {
query.value = ""
query.value = ''
resetSearch()
getSection(end.value).then((data) => {
content.value = content.value + data.content
@ -69,7 +69,7 @@ function getNextSection() {
}
function getPreviousSection() {
query.value = ""
query.value = ''
resetSearch()
if (start.value) {
getSection(start.value - size).then((data) => {
@ -97,18 +97,20 @@ async function getNthByte(n) {
totalSize.value = data.total
}
async function search() {
async function search(startOffset) {
const params = new URLSearchParams()
params.append('query', query.value)
params.append('start', startOffset)
const response = await fetch(`/api/log/${route.params.name}/search/?${params}`)
return await response.json()
}
function searchAndHighlight() {
search().then((data) => {
function searchAndHighlight(startOffset = 0) {
search(startOffset).then((data) => {
searched.value = true
searchResults.matches = data.matches
searchResults.count = data.matches.length > 99 ? '99+' : data.matches.length.toString()
searchResults.current = -1
moveSearchResult(1)
})
}
@ -140,23 +142,22 @@ function findError() {
getNextSection()
function convertBytes(bytes) {
const suffixes = ["bytes", "KiB", "MiB", "GiB"];
const suffixes = ['bytes', 'KiB', 'MiB', 'GiB']
for (let suffix of suffixes) {
if (bytes < 1024)
return `${bytes.toFixed(2).replace(/\.?0*$/,'')} ${suffix}`
bytes /= 1024;
if (bytes < 1024) return `${bytes.toFixed(2).replace(/\.?0*$/, '')} ${suffix}`
bytes /= 1024
}
return `${bytes.toFixed(2).replace(/\.?0*$/,'')} TiB`
return `${bytes.toFixed(2).replace(/\.?0*$/, '')} TiB`
}
const dataSkipped = computed(() => convertBytes(start.value))
const dataLeft = computed(() => convertBytes(totalSize.value - end.value))
const highlighter = await createHighlighterCore({
langs: [bash],
themes: [catppuccinLatte],
engine: createJavaScriptRegexEngine(),
});
langs: [bash],
themes: [catppuccinLatte],
engine: createJavaScriptRegexEngine(),
})
// Add ellipsis to start or end if there is more content available
const displayedContent = computed(() => {
@ -182,9 +183,8 @@ const displayedContent = computed(() => {
lang: 'bash',
theme: 'catppuccin-latte',
decorations,
})
})
}, '')
</script>
<script></script>
@ -202,6 +202,13 @@ const displayedContent = computed(() => {
Previous
</button>
<button
v-if="searchResults.current === 98 && searchResults.matches.length === 100"
@click="searchAndHighlight(searchResults.matches[99])"
>
Search More
</button>
<button
v-else
:disabled="searchResults.current >= searchResults.matches.length - 1"
@click="moveSearchResult(1)"
type="button"