Merge branch 'main' of https://gitea.carpa.com/LGCC/search
This commit is contained in:
commit
4513f4d839
|
|
@ -0,0 +1,79 @@
|
|||
name: Deploy Search Typesense
|
||||
|
||||
on:
|
||||
push:
|
||||
branches:
|
||||
- staging
|
||||
- production
|
||||
|
||||
jobs:
|
||||
deploy:
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- name: Checkout Code
|
||||
uses: actions/checkout@v4
|
||||
|
||||
# Route each branch to a specific directory and PM2 environment
|
||||
- name: Setup Environment Variables
|
||||
run: |
|
||||
if [[ "${{ github.ref_name }}" == "production" ]]; then
|
||||
TARGET="/var/www/search.carpa.com"
|
||||
echo "PM2_ENV=production" >> $GITHUB_ENV
|
||||
elif [[ "${{ github.ref_name }}" == "staging" ]]; then
|
||||
TARGET="/var/www/dev.search.carpa.com"
|
||||
echo "PM2_ENV=staging" >> $GITHUB_ENV
|
||||
fi
|
||||
|
||||
PM2_NAME="search-${{ github.ref_name }}"
|
||||
|
||||
echo "TARGET_DIR=$TARGET" >> $GITHUB_ENV
|
||||
echo "PM2_NAME=$PM2_NAME" >> $GITHUB_ENV
|
||||
|
||||
echo "NUXT_PUBLIC_FEEDBACK_WEBHOOK=${{ secrets.NUXT_PUBLIC_FEEDBACK_WEBHOOK }}" >> $GITHUB_ENV
|
||||
echo "NUXT_PUBLIC_RECAPTCHA_SITE_KEY=${{ secrets.NUXT_PUBLIC_RECAPTCHA_SITE_KEY }}" >> $GITHUB_ENV
|
||||
echo "NUXT_PUBLIC_FEEDBACK_MAX_PER_HOUR=${{ secrets.NUXT_PUBLIC_FEEDBACK_MAX_PER_HOUR }}" >> $GITHUB_ENV
|
||||
echo "NUXT_PUBLIC_FEEDBACK_MAX_PER_SESSION=${{ secrets.NUXT_PUBLIC_FEEDBACK_MAX_PER_SESSION }}" >> $GITHUB_ENV
|
||||
echo "NUXT_PUBLIC_FEEDBACK_COOLDOWN_SEC=${{ secrets.NUXT_PUBLIC_FEEDBACK_COOLDOWN_SEC }}" >> $GITHUB_ENV
|
||||
echo "NUXT_PUBLIC_FEEDBACK_MIN_SECONDS=${{ secrets.NUXT_PUBLIC_FEEDBACK_MIN_SECONDS }}" >> $GITHUB_ENV
|
||||
echo "NUXT_FEEDBACK_TOKEN=${{ secrets.NUXT_FEEDBACK_TOKEN }}" >> $GITHUB_ENV
|
||||
echo "NUXT_PUBLIC_TYPESENSE_URL=${{ secrets.NUXT_PUBLIC_TYPESENSE_URL }}" >> $GITHUB_ENV
|
||||
echo "NUXT_PUBLIC_TYPESENSE_API_KEY=${{ secrets.NUXT_PUBLIC_TYPESENSE_API_KEY }}" >> $GITHUB_ENV
|
||||
echo "NUXT_PUBLIC_ENTRELINEAS_DEV_KEY=${{ secrets.NUXT_PUBLIC_ENTRELINEAS_DEV_KEY }}" >> $GITHUB_ENV
|
||||
|
||||
- name: Setup Node.js
|
||||
uses: actions/setup-node@v4
|
||||
with:
|
||||
node-version: '24'
|
||||
cache: 'npm'
|
||||
|
||||
- name: Install Dependencies
|
||||
run: npm ci
|
||||
|
||||
- name: Build Nuxt Application
|
||||
run: npm run build
|
||||
env:
|
||||
NITRO_PRESET: node-server
|
||||
|
||||
- name: Copy Build Files to Vultr
|
||||
uses: appleboy/scp-action@master
|
||||
with:
|
||||
host: ${{ secrets.VPS_HOST }}
|
||||
username: ${{ secrets.VPS_USER }}
|
||||
key: ${{ secrets.VPS_SSH_KEY }}
|
||||
port: 22
|
||||
source: ".output/*,package.json,ecosystem.config.cjs"
|
||||
target: "${{ env.TARGET_DIR }}"
|
||||
|
||||
- name: Restart PM2 on Vultr
|
||||
uses: appleboy/ssh-action@master
|
||||
with:
|
||||
host: ${{ secrets.VPS_HOST }}
|
||||
username: ${{ secrets.VPS_USER }}
|
||||
key: ${{ secrets.VPS_SSH_KEY }}
|
||||
port: 22
|
||||
script: |
|
||||
export NVM_DIR="$HOME/.nvm"
|
||||
[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh"
|
||||
cd ${{ env.TARGET_DIR }}
|
||||
PM2_NAME=${{ env.PM2_NAME }} pm2 reload ${{ env.PM2_NAME }} --env ${{ env.PM2_ENV }} || \
|
||||
PM2_NAME=${{ env.PM2_NAME }} pm2 start ecosystem.config.cjs --env ${{ env.PM2_ENV }}
|
||||
|
|
@ -0,0 +1,106 @@
|
|||
<script setup lang="ts">
|
||||
import { breakpointsTailwind } from '@vueuse/core'
|
||||
|
||||
interface Props {
|
||||
activeCount?: number
|
||||
title?: string
|
||||
}
|
||||
|
||||
withDefaults(defineProps<Props>(), {
|
||||
activeCount: 0,
|
||||
title: 'search.filters'
|
||||
})
|
||||
|
||||
/*
|
||||
─── RESPONSIVE: un solo componente, dos renders ───
|
||||
- Desktop (>lg): acordeón colapsable (#content dentro)
|
||||
- Mobile (<lg): botón → USlideover (#content dentro del slide)
|
||||
|
||||
El slot #content es el MISMO en ambos casos
|
||||
(el input + botón para agregar bible_study)
|
||||
*/
|
||||
|
||||
const breakpoints = useBreakpoints(breakpointsTailwind)
|
||||
const isMobile = breakpoints.smaller('lg')
|
||||
|
||||
const isExpanded = ref(true)
|
||||
const isSlideoverOpen = ref(false)
|
||||
|
||||
const { $i18n } = useNuxtApp()
|
||||
const t = $i18n.t
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="border-b border-default">
|
||||
<!-- ─── DESKTOP (>lg): ACORDEÓN COLAPSABLE ──────── -->
|
||||
<div v-if="!isMobile" class="select-none">
|
||||
<button
|
||||
class="w-full flex items-center justify-between px-4 sm:px-6 py-2 text-sm font-medium text-muted hover:text-foreground transition-colors"
|
||||
@click="isExpanded = !isExpanded"
|
||||
>
|
||||
<span class="flex items-center gap-2">
|
||||
<UIcon name="i-lucide-filter" class="size-4" />
|
||||
{{ t(title) }}
|
||||
<UBadge v-if="activeCount > 0" size="sm" variant="solid" color="primary">
|
||||
{{ activeCount }}
|
||||
</UBadge>
|
||||
</span>
|
||||
<UIcon
|
||||
:name="isExpanded ? 'i-lucide-chevron-up' : 'i-lucide-chevron-down'"
|
||||
class="size-4 transition-transform"
|
||||
/>
|
||||
</button>
|
||||
<div v-show="isExpanded" class="px-4 sm:px-6 pb-3">
|
||||
<slot name="content" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- ─── MOBILE (<lg): BOTÓN + SLIDEOVER ─────────── -->
|
||||
<div v-else class="px-4 sm:px-6 py-2">
|
||||
<UButton
|
||||
size="sm"
|
||||
color="neutral"
|
||||
variant="outline"
|
||||
class="w-full justify-between"
|
||||
@click="isSlideoverOpen = true"
|
||||
>
|
||||
<span class="flex items-center gap-2">
|
||||
<UIcon name="i-lucide-filter" class="size-4" />
|
||||
{{ t(title) }}
|
||||
</span>
|
||||
<span class="flex items-center gap-2">
|
||||
<UBadge v-if="activeCount > 0" size="sm" variant="solid" color="primary">
|
||||
{{ activeCount }}
|
||||
</UBadge>
|
||||
<UIcon name="i-lucide-chevron-right" class="size-4" />
|
||||
</span>
|
||||
</UButton>
|
||||
|
||||
<ClientOnly>
|
||||
<USlideover v-model:open="isSlideoverOpen">
|
||||
<template #content>
|
||||
<div class="p-4 space-y-4">
|
||||
<div class="flex items-center justify-between">
|
||||
<h3 class="text-lg font-semibold flex items-center gap-2">
|
||||
<UIcon name="i-lucide-filter" class="size-5" />
|
||||
{{ t(title) }}
|
||||
</h3>
|
||||
<UButton
|
||||
icon="i-lucide-x"
|
||||
size="sm"
|
||||
color="neutral"
|
||||
variant="ghost"
|
||||
@click="isSlideoverOpen = false"
|
||||
/>
|
||||
</div>
|
||||
<slot name="content" />
|
||||
<div v-if="$slots.chips" class="pt-2">
|
||||
<slot name="chips" />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</USlideover>
|
||||
</ClientOnly>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -2,6 +2,7 @@
|
|||
import { computed, ref, watch, onMounted, onBeforeUnmount } from 'vue'
|
||||
import { breakpointsTailwind } from '@vueuse/core'
|
||||
import PublicationDetail from '~/components/PublicationDetail.vue'
|
||||
import FiltersContainer from '~/components/searchPanel/FiltersContainer.vue'
|
||||
import { useSettingsStore } from '~/stores/settings'
|
||||
|
||||
interface Props {
|
||||
|
|
@ -49,43 +50,6 @@ const bibleStudyInput = ref<number | null>(null)
|
|||
const activeBibleStudies = ref<BibleStudyChip[]>([])
|
||||
const isValidating = ref(false)
|
||||
|
||||
const {
|
||||
query, debouncedQuery, loading, loadingMore, errorMsg,
|
||||
exactSearch, sortMode,
|
||||
groupedHits, visibleGroupCount, visibleGroups, hasMoreVisible, hasMore,
|
||||
browseItems, hasMoreBrowse,
|
||||
displayGroups, activePage, displayTotal, totalPages,
|
||||
runSearch, runBrowse, loadMore, goToPage, retry
|
||||
} = useGroupedTypesenseSearch({
|
||||
paragraphsCollection: props.paragraphsCollection,
|
||||
mainCollection: props.mainCollection,
|
||||
groupByField: props.groupByField,
|
||||
queryBy: QUERY_BY,
|
||||
filterBy: () => {
|
||||
let base = `locale:=${locale.value}`
|
||||
if (activeBibleStudies.value.length > 0) {
|
||||
const ids = activeBibleStudies.value.map(bs => bs.id).join(',')
|
||||
base += ` && $${props.mainCollection}(bible_study:=[${ids}])`
|
||||
}
|
||||
return base
|
||||
},
|
||||
isUnlocked: () => unlocked.value,
|
||||
pageSize: () => settings.pageSize,
|
||||
paginationType: () => settings.paginationType,
|
||||
initialQuery: q0,
|
||||
initialPage: p0
|
||||
})
|
||||
|
||||
function refetchResults() {
|
||||
if (!debouncedQuery.value.trim()) {
|
||||
browseItems.value = []
|
||||
runBrowse(1, false)
|
||||
} else {
|
||||
groupedHits.value = []
|
||||
runSearch(query.value, 1, false)
|
||||
}
|
||||
}
|
||||
|
||||
async function applyBibleStudyFilter() {
|
||||
const val = bibleStudyInput.value
|
||||
if (val === null || val <= 0) return
|
||||
|
|
@ -136,40 +100,268 @@ function clearAllBibleStudyFilters() {
|
|||
refetchResults()
|
||||
}
|
||||
|
||||
// ---- Types ----------------------------------------------------------------
|
||||
|
||||
interface DocumentDoc extends CachedDocMeta {
|
||||
code: string
|
||||
locale: string
|
||||
files?: {
|
||||
youtube?: string
|
||||
video?: string
|
||||
audio?: string
|
||||
booklet?: string
|
||||
simple?: string
|
||||
function refetchResults() {
|
||||
if (!debouncedQuery.value.trim()) {
|
||||
browseItems.value = []
|
||||
runBrowse(1, false)
|
||||
} else {
|
||||
groupedHits.value = []
|
||||
currentPage.value = 1
|
||||
runSearch(query.value, 1, false)
|
||||
}
|
||||
body?: string
|
||||
[key: string]: unknown
|
||||
}
|
||||
|
||||
// ---- Colors ----------------------------------------------------------------
|
||||
// ----------------------------------------------------------------------------
|
||||
|
||||
const colors = computed(() => {
|
||||
if (props.accentColor === 'green') {
|
||||
return {
|
||||
selectedItem: 'border-carpagreen bg-carpagreen/10',
|
||||
hoverItem: 'border-gray-200 hover:border-carpagreen hover:bg-carpagreen/5',
|
||||
icon: 'text-carpagreen',
|
||||
}
|
||||
}
|
||||
return {
|
||||
selectedItem: 'border-carpablue bg-carpablue/10',
|
||||
hoverItem: 'border-gray-200 hover:border-carpablue hover:bg-carpablue/5',
|
||||
icon: 'text-carpablue',
|
||||
const groupedHits = ref<SearchGroup[]>([])
|
||||
const total = ref(0)
|
||||
const currentPage = ref(1)
|
||||
|
||||
const hasMore = computed(() =>
|
||||
settings.paginationType === 'infinite_scroll' ? groupedHits.value.length < total.value : false
|
||||
)
|
||||
|
||||
const visibleGroupCount = ref(10)
|
||||
|
||||
const visibleGroups = computed(() =>
|
||||
settings.paginationType === 'infinite_scroll'
|
||||
? groupedHits.value.slice(0, visibleGroupCount.value)
|
||||
: groupedHits.value
|
||||
)
|
||||
|
||||
const hasMoreVisible = computed(() =>
|
||||
settings.paginationType === 'infinite_scroll' &&
|
||||
visibleGroupCount.value < groupedHits.value.length
|
||||
)
|
||||
|
||||
const browseItems = ref<BrowseItem[]>([])
|
||||
const browseTotal = ref(0)
|
||||
const browsePage = ref(1)
|
||||
|
||||
const hasMoreBrowse = computed(() =>
|
||||
settings.paginationType === 'infinite_scroll'
|
||||
? browseItems.value.length < browseTotal.value
|
||||
: false
|
||||
)
|
||||
|
||||
const displayGroups = computed((): DisplayGroup[] => {
|
||||
if (!debouncedQuery.value.trim()) {
|
||||
return browseItems.value.map(item => ({
|
||||
docId: item.docId,
|
||||
meta: item.meta,
|
||||
firstHit: null
|
||||
}))
|
||||
}
|
||||
return visibleGroups.value.map(g => ({
|
||||
docId: g.docId,
|
||||
meta: docCache.value[g.docId],
|
||||
firstHit: g.firstHit
|
||||
}))
|
||||
})
|
||||
|
||||
// ---- Scroll infinito y detalle ---------------------------------------------
|
||||
const activePage = ref(p0)
|
||||
|
||||
const displayTotal = computed(() =>
|
||||
debouncedQuery.value.trim() ? total.value : browseTotal.value
|
||||
)
|
||||
|
||||
const totalPages = computed(() =>
|
||||
Math.max(1, Math.ceil(displayTotal.value / settings.pageSize))
|
||||
)
|
||||
|
||||
const docCache = ref<Record<string, DocMeta>>({})
|
||||
|
||||
const { documentsApi } = useTypesenseApi()
|
||||
const toast = useToast()
|
||||
|
||||
// ---- Batch fetch de metadatos ---------------------------------------------
|
||||
|
||||
async function fetchDocumentMeta(docIds: string[]) {
|
||||
const unique = docIds.filter(id => id && !(id in docCache.value))
|
||||
if (!unique.length) return
|
||||
try {
|
||||
const res = await documentsApi.multiSearch({
|
||||
multiSearchParameters: {},
|
||||
multiSearchSearchesParameter: {
|
||||
searches: [{
|
||||
collection: props.mainCollection,
|
||||
q: '*',
|
||||
queryBy: 'title',
|
||||
filterBy: `id:=[${unique.join(',')}]${unlocked.value ? '' : ' && private:=false'}`,
|
||||
includeFields: 'id,title,date,timestamp,place,city,state,country,type,slug,draft',
|
||||
perPage: unique.length,
|
||||
page: 1
|
||||
}]
|
||||
}
|
||||
})
|
||||
const docHits = (res?.results?.[0] as { hits?: Array<{ document: DocMeta }> })?.hits ?? []
|
||||
for (const hit of docHits) {
|
||||
if (hit.document.id) docCache.value[hit.document.id] = hit.document
|
||||
}
|
||||
} catch (err) {
|
||||
console.error('Error fetching document metadata', err)
|
||||
}
|
||||
}
|
||||
|
||||
// ---- Búsqueda de párrafos (con query) -------------------------------------
|
||||
|
||||
let searchSeq = 0
|
||||
let timeoutId: ReturnType<typeof setTimeout> | null = null
|
||||
|
||||
async function runSearch(q: string, page = 1, append = false) {
|
||||
const seq = ++searchSeq
|
||||
if (append) loadingMore.value = true
|
||||
else loading.value = true
|
||||
errorMsg.value = null
|
||||
|
||||
if (timeoutId) clearTimeout(timeoutId)
|
||||
timeoutId = setTimeout(() => {
|
||||
if (seq === searchSeq) {
|
||||
loading.value = false
|
||||
loadingMore.value = false
|
||||
errorMsg.value = 'La búsqueda tardó demasiado. Inténtalo de nuevo.'
|
||||
}
|
||||
}, REQUEST_TIMEOUT_MS)
|
||||
|
||||
const isInfinite = settings.paginationType === 'infinite_scroll'
|
||||
const typePage = isInfinite ? (append ? currentPage.value + 1 : 1) : page
|
||||
|
||||
try {
|
||||
const shouldSortByDate = sortMode.value === 'date' && q.trim()
|
||||
|
||||
const multi = await documentsApi.multiSearch({
|
||||
multiSearchParameters: {},
|
||||
multiSearchSearchesParameter: {
|
||||
searches: [{
|
||||
collection: props.paragraphsCollection,
|
||||
q: exactSearch.value && q ? `"${q}"` : q || '*',
|
||||
queryBy: QUERY_BY,
|
||||
filterBy: unlocked.value ? filterBy.value : `${filterBy.value} && $${props.mainCollection}(private:=false)`,
|
||||
...(shouldSortByDate ? { sortBy: `$${props.mainCollection}(timestamp:desc)` } : {}),
|
||||
perPage: settings.pageSize,
|
||||
page: typePage,
|
||||
highlightFullFields: QUERY_BY,
|
||||
highlightFields: QUERY_BY,
|
||||
highlightStartTag: '<mark class="search-match">',
|
||||
highlightEndTag: '</mark>',
|
||||
highlightAffixNumTokens: 30,
|
||||
groupBy: props.groupByField
|
||||
}]
|
||||
}
|
||||
})
|
||||
if (seq !== searchSeq) return
|
||||
|
||||
const res = (multi?.results?.[0] ?? {}) as TypesenseSearchResponse
|
||||
const rawGroups = res?.groupedHits ?? []
|
||||
const newGroups: SearchGroup[] = rawGroups.map(g => ({
|
||||
docId: g.groupKey[0]!,
|
||||
firstHit: g.hits[0]!,
|
||||
allHits: g.hits
|
||||
}))
|
||||
|
||||
if (!append) docCache.value = {}
|
||||
await fetchDocumentMeta(newGroups.map(g => g.docId).filter(Boolean))
|
||||
|
||||
if (seq !== searchSeq) return
|
||||
|
||||
groupedHits.value = append ? groupedHits.value.concat(newGroups) : newGroups
|
||||
total.value = res?.found ?? groupedHits.value.length
|
||||
currentPage.value = typePage
|
||||
if (!append) activePage.value = page
|
||||
} catch (err: unknown) {
|
||||
if (seq !== searchSeq) return
|
||||
console.error('Typesense error', err)
|
||||
errorMsg.value = (err as Error)?.message || 'Error al buscar.'
|
||||
if (!append) { groupedHits.value = []; total.value = 0 }
|
||||
} finally {
|
||||
if (seq === searchSeq) {
|
||||
if (timeoutId) clearTimeout(timeoutId)
|
||||
loading.value = false
|
||||
loadingMore.value = false
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// ---- Exploración por fecha (sin query) ------------------------------------
|
||||
|
||||
async function runBrowse(page = 1, append = false) {
|
||||
const seq = ++searchSeq
|
||||
if (append) loadingMore.value = true
|
||||
else loading.value = true
|
||||
errorMsg.value = null
|
||||
|
||||
if (timeoutId) clearTimeout(timeoutId)
|
||||
timeoutId = setTimeout(() => {
|
||||
if (seq === searchSeq) {
|
||||
loading.value = false
|
||||
loadingMore.value = false
|
||||
errorMsg.value = 'La búsqueda tardó demasiado. Inténtalo de nuevo.'
|
||||
}
|
||||
}, REQUEST_TIMEOUT_MS)
|
||||
|
||||
const isInfinite = settings.paginationType === 'infinite_scroll'
|
||||
const typePage = isInfinite ? (append ? browsePage.value + 1 : 1) : page
|
||||
|
||||
try {
|
||||
const multi = await documentsApi.multiSearch({
|
||||
multiSearchParameters: {},
|
||||
multiSearchSearchesParameter: {
|
||||
searches: [{
|
||||
collection: props.paragraphsCollection,
|
||||
q: '*',
|
||||
queryBy: QUERY_BY,
|
||||
filterBy: `${filterBy.value} && $${props.mainCollection}(locale:=${locale.value}${unlocked.value ? '' : ' && private:=false'})`,
|
||||
sortBy: `$${props.mainCollection}(timestamp:desc)`,
|
||||
groupBy: props.groupByField,
|
||||
perPage: settings.pageSize,
|
||||
page: typePage,
|
||||
includeFields: `$${props.mainCollection}(id,title,date,timestamp,place,city,state,country,type,slug,draft)`
|
||||
}]
|
||||
}
|
||||
})
|
||||
if (seq !== searchSeq) return
|
||||
const result = (multi?.results?.[0] as TypesenseSearchResponse | undefined)
|
||||
const rawGroups = result?.groupedHits ?? []
|
||||
const newItems = rawGroups.map(g => {
|
||||
const docId = g.groupKey[0]!
|
||||
const parentMeta = (g.hits[0]?.document as unknown as Record<string, unknown>)[props.mainCollection] as Partial<DocMeta> | undefined
|
||||
return { docId, meta: { id: docId, ...parentMeta } as DocMeta }
|
||||
})
|
||||
|
||||
browseItems.value = append ? browseItems.value.concat(newItems) : newItems
|
||||
browseTotal.value = result?.found ?? browseItems.value.length
|
||||
browsePage.value = typePage
|
||||
if (!append) activePage.value = page
|
||||
} catch (err: unknown) {
|
||||
if (seq !== searchSeq) return
|
||||
console.error('Typesense error', err)
|
||||
errorMsg.value = (err as Error)?.message || 'Error al buscar.'
|
||||
if (!append) { browseItems.value = []; browseTotal.value = 0 }
|
||||
} finally {
|
||||
if (seq === searchSeq) {
|
||||
if (timeoutId) clearTimeout(timeoutId)
|
||||
loading.value = false
|
||||
loadingMore.value = false
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function loadMore() {
|
||||
if (settings.paginationType !== 'infinite_scroll') return
|
||||
if (loadingMore.value || loading.value || !hasMore.value) return
|
||||
runSearch(query.value, currentPage.value, true)
|
||||
}
|
||||
|
||||
function goToPage(p: number) {
|
||||
activePage.value = p
|
||||
if (!debouncedQuery.value.trim()) {
|
||||
browseItems.value = []
|
||||
runBrowse(p, false)
|
||||
} else {
|
||||
groupedHits.value = []
|
||||
runSearch(query.value, p, false)
|
||||
}
|
||||
}
|
||||
|
||||
const listContainer = ref<HTMLElement | null>(null)
|
||||
|
||||
|
|
@ -355,6 +547,7 @@ function metaLocation(meta: CachedDocMeta | undefined): string {
|
|||
<span class="italic">{{ author }}</span>
|
||||
</div>
|
||||
|
||||
<!-- ─── BUSCADOR ─────────────────────────────────── -->
|
||||
<div class="px-4 sm:px-6 py-3 border-b border-default flex items-center gap-2" id="inputField">
|
||||
<UInput
|
||||
v-model="query"
|
||||
|
|
@ -380,41 +573,11 @@ function metaLocation(meta: CachedDocMeta | undefined): string {
|
|||
>{{ t('search.phrase') }}</button>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="query.trim()" class="px-4 sm:px-6 py-3">
|
||||
<USelect
|
||||
v-model="sortMode"
|
||||
:items="[
|
||||
{ label: t('search.sort.relevance'), value: 'relevance' },
|
||||
{ label: t('search.sort.date'), value: 'date' }
|
||||
]"
|
||||
size="sm"
|
||||
class="shrink-0 min-w-[130px]"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div v-if="showBibleStudyFilter" class="px-4 sm:px-6 py-2 border-b border-default space-y-2">
|
||||
<div class="flex items-center gap-2">
|
||||
<UInput
|
||||
v-model="bibleStudyInput"
|
||||
type="number"
|
||||
min="1"
|
||||
:placeholder="$t('search.bible_study_placeholder')"
|
||||
size="sm"
|
||||
class="w-36"
|
||||
@keyup.enter="applyBibleStudyFilter"
|
||||
/>
|
||||
<UButton
|
||||
size="sm"
|
||||
color="neutral"
|
||||
variant="outline"
|
||||
:loading="isValidating"
|
||||
:disabled="bibleStudyInput === null || bibleStudyInput <= 0"
|
||||
@click="applyBibleStudyFilter"
|
||||
>
|
||||
+ {{ $t('search.filter') }}
|
||||
</UButton>
|
||||
</div>
|
||||
<div v-if="activeBibleStudies.length > 0" class="flex flex-wrap items-center gap-1.5">
|
||||
<!-- ─── CHIPS ACTIVOS (solo desktop: fuera del FiltersContainer) ─── -->
|
||||
<!-- En desktop los chips van debajo del input; en mobile van DENTRO del slideover -->
|
||||
<div v-if="showBibleStudyFilter && activeBibleStudies.length > 0 && !isMobile" class="px-4 sm:px-6 py-2 border-b border-default">
|
||||
<div class="flex flex-wrap items-center gap-1.5">
|
||||
<UBadge
|
||||
v-for="bs in activeBibleStudies"
|
||||
:key="bs.id"
|
||||
|
|
@ -445,6 +608,92 @@ function metaLocation(meta: CachedDocMeta | undefined): string {
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<!-- ─── SORT ────────────────────────────────────── -->
|
||||
<div v-if="query.trim()" class="px-4 sm:px-6 py-3 flex items-center gap-2">
|
||||
<p class="text-sm">Busqueda: </p>
|
||||
<USelect
|
||||
v-model="sortMode"
|
||||
:items="[
|
||||
{ label: t('search.sort.relevance'), value: 'relevance' },
|
||||
{ label: t('search.sort.date'), value: 'date' }
|
||||
]"
|
||||
size="sm"
|
||||
class="shrink-0 min-w-[130px]"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<!-- ─── FILTROS: AGREGAR NUEVOS (acordeón desktop / slideover mobile) ─── -->
|
||||
<!--
|
||||
El componente FiltersContainer renderiza DISTINTO según la pantalla:
|
||||
- Desktop (>lg): acordeón colapsable con header "Filtros"
|
||||
- Mobile (<lg): botón "Filtros" que abre un USlideover
|
||||
El slot #content (input + botón) es el MISMO en ambos casos.
|
||||
El slot #chips se usa solo en mobile (dentro del slideover debajo del content).
|
||||
-->
|
||||
<template v-if="showBibleStudyFilter">
|
||||
<FiltersContainer
|
||||
:active-count="activeBibleStudies.length"
|
||||
title="search.filters"
|
||||
>
|
||||
<!-- #chips se renderiza dentro del slideover en mobile -->
|
||||
<template #chips>
|
||||
<div class="flex flex-wrap items-center gap-1.5">
|
||||
<UBadge
|
||||
v-for="bs in activeBibleStudies"
|
||||
:key="bs.id"
|
||||
size="sm"
|
||||
variant="subtle"
|
||||
color="primary"
|
||||
class="max-w-full"
|
||||
>
|
||||
<span class="truncate">{{ $t('search.bible_study_chip', { number: bs.id }) }}</span>
|
||||
<UButton
|
||||
icon="i-lucide-x"
|
||||
size="2xs"
|
||||
color="neutral"
|
||||
variant="ghost"
|
||||
class="ml-1 shrink-0"
|
||||
@click="removeBibleStudyFilter(bs.id)"
|
||||
/>
|
||||
</UBadge>
|
||||
<div v-if="activeBibleStudies.length > 0">
|
||||
<UButton
|
||||
size="sm"
|
||||
color="neutral"
|
||||
variant="ghost"
|
||||
class="text-xs"
|
||||
@click="clearAllBibleStudyFilters">
|
||||
{{ $t('search.bible_study_clear') }}
|
||||
</UButton>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<template #content>
|
||||
<div class="flex items-center gap-2">
|
||||
<UInput
|
||||
v-model="bibleStudyInput"
|
||||
type="number"
|
||||
min="1"
|
||||
:placeholder="$t('search.bible_study_placeholder')"
|
||||
size="sm"
|
||||
class="w-36"
|
||||
@keyup.enter="applyBibleStudyFilter(props.mainCollection)"
|
||||
/>
|
||||
<UButton
|
||||
size="sm"
|
||||
color="neutral"
|
||||
variant="outline"
|
||||
:loading="isValidating"
|
||||
:disabled="bibleStudyInput === null || bibleStudyInput <= 0"
|
||||
@click="applyBibleStudyFilter(props.mainCollection)"
|
||||
>
|
||||
+ {{ $t('search.filter') }}
|
||||
</UButton>
|
||||
</div>
|
||||
</template>
|
||||
</FiltersContainer>
|
||||
</template>
|
||||
|
||||
<UAlert
|
||||
v-if="errorMsg"
|
||||
:title="errorMsg"
|
||||
|
|
|
|||
|
|
@ -0,0 +1,73 @@
|
|||
interface BibleStudyChip {
|
||||
id: number
|
||||
title: string
|
||||
}
|
||||
|
||||
const activeBibleStudies = useState<BibleStudyChip[]>('bible-study-chips', () => [])
|
||||
|
||||
export function useFilters() {
|
||||
const { documentsApi } = useTypesenseApi()
|
||||
const toast = useToast()
|
||||
|
||||
const bibleStudyInput = ref<number | null>(null)
|
||||
const isValidating = ref(false)
|
||||
|
||||
const activeCount = computed(() => activeBibleStudies.value.length)
|
||||
|
||||
async function applyBibleStudyFilter(mainCollection: string) {
|
||||
const val = bibleStudyInput.value
|
||||
if (val === null || val <= 0) return
|
||||
if (activeBibleStudies.value.some(bs => bs.id === val)) {
|
||||
toast.add({ title: 'Estudio ya agregado', description: `El estudio #${val} ya está en el filtro`, color: 'info' })
|
||||
bibleStudyInput.value = null
|
||||
return
|
||||
}
|
||||
|
||||
isValidating.value = true
|
||||
try {
|
||||
const res = await documentsApi.multiSearch({
|
||||
multiSearchParameters: {},
|
||||
multiSearchSearchesParameter: {
|
||||
searches: [{
|
||||
collection: mainCollection,
|
||||
q: '*',
|
||||
queryBy: 'title',
|
||||
filterBy: `bible_study:=${val}`,
|
||||
perPage: 1,
|
||||
includeFields: 'bible_study,title'
|
||||
}]
|
||||
}
|
||||
})
|
||||
|
||||
const hit = (res?.results?.[0] as { hits?: Array<{ document: { title?: string } }> })?.hits?.[0]
|
||||
if (hit) {
|
||||
activeBibleStudies.value = [...activeBibleStudies.value, { id: val, title: hit.document.title || '' }]
|
||||
bibleStudyInput.value = null
|
||||
} else {
|
||||
toast.add({ title: 'Estudio no encontrado', description: `No existe el estudio #${val}`, color: 'warning' })
|
||||
}
|
||||
} catch (err) {
|
||||
console.error('Error validando bible_study', err)
|
||||
} finally {
|
||||
isValidating.value = false
|
||||
}
|
||||
}
|
||||
|
||||
function removeBibleStudyFilter(id: number) {
|
||||
activeBibleStudies.value = activeBibleStudies.value.filter(bs => bs.id !== id)
|
||||
}
|
||||
|
||||
function clearAllBibleStudyFilters() {
|
||||
activeBibleStudies.value = []
|
||||
}
|
||||
|
||||
return {
|
||||
activeBibleStudies,
|
||||
activeCount,
|
||||
bibleStudyInput,
|
||||
isValidating,
|
||||
applyBibleStudyFilter,
|
||||
removeBibleStudyFilter,
|
||||
clearAllBibleStudyFilters
|
||||
}
|
||||
}
|
||||
|
|
@ -8,7 +8,7 @@ export const typeConfig: Record<ChangeEntry['type'], { label: string; color: str
|
|||
export interface ChangeEntry {
|
||||
type: 'nuevo' | 'mejora' | 'fix' | 'eliminado'
|
||||
text: string
|
||||
}
|
||||
}
|
||||
|
||||
export interface Release {
|
||||
version: string
|
||||
|
|
@ -16,9 +16,21 @@ export interface Release {
|
|||
title: string
|
||||
description?: string
|
||||
changes: ChangeEntry[]
|
||||
}
|
||||
}
|
||||
|
||||
export const releases: Release[] = [
|
||||
{
|
||||
version: '0.9',
|
||||
date: '20 de julio, 2026',
|
||||
title: 'Filtro por N° de Estudio',
|
||||
changes: [
|
||||
{ type: 'nuevo', text: 'Nuevo filtro por número de Estudio en la sección de Estudios: ingresá el número y se agrega como chip para buscar dentro de ese estudio' },
|
||||
{ type: 'nuevo', text: 'Se pueden agregar varios estudios a la vez, cada uno como un chip individual' },
|
||||
{ type: 'nuevo', text: 'Los chips con los filtros activos se muestran siempre visibles debajo de la barra de búsqueda' },
|
||||
{ type: 'mejora', text: 'En escritorio los filtros se agrupan en una sección colapsable para no ocupar espacio innecesario' },
|
||||
{ type: 'mejora', text: 'En móvil los filtros se configuran desde un panel deslizante para aprovechar mejor la pantalla' }
|
||||
]
|
||||
},
|
||||
{
|
||||
version: '0.8',
|
||||
date: '5 de junio, 2026',
|
||||
|
|
@ -143,4 +155,4 @@ export const releases: Release[] = [
|
|||
{ type: 'nuevo', text: 'Estructura base de la aplicación' }
|
||||
]
|
||||
}
|
||||
]
|
||||
]
|
||||
|
|
|
|||
|
|
@ -0,0 +1,25 @@
|
|||
module.exports = {
|
||||
apps: [
|
||||
{
|
||||
// You can append the PM2_ENV dynamically in the script if you want unique names in the PM2 list,
|
||||
// or rely on the directory path to keep them separate.
|
||||
name: process.env.PM2_NAME || 'SearchTs',
|
||||
// port: '3000',
|
||||
// exec_mode: 'cluster',
|
||||
// instances: 'max',
|
||||
script: './.output/server/index.mjs',
|
||||
|
||||
// Triggered by 'staging' branch
|
||||
env_staging: {
|
||||
NODE_ENV: 'staging',
|
||||
PORT: 3005
|
||||
},
|
||||
|
||||
// Triggered by 'production' branch
|
||||
env_production: {
|
||||
NODE_ENV: 'production',
|
||||
PORT: 3010
|
||||
}
|
||||
}
|
||||
]
|
||||
};
|
||||
|
|
@ -23,6 +23,7 @@
|
|||
"bible_study_placeholder": "Study no...",
|
||||
"bible_study_chip": "Study #{number} {title}",
|
||||
"bible_study_clear": "Clear filters",
|
||||
"filters": "Filters",
|
||||
"placeholder": "Search for...",
|
||||
"searching": "Searching...",
|
||||
"tip": "Tip: wrap in \"quotes\" for exact phrase in that order.",
|
||||
|
|
|
|||
|
|
@ -67,6 +67,7 @@
|
|||
"bible_study_placeholder": "N° de estudio...",
|
||||
"bible_study_chip": "Estudio #{number} {title}",
|
||||
"bible_study_clear": "Limpiar filtros",
|
||||
"filters": "Filtros",
|
||||
"words_tooltip": "Buscar por palabras",
|
||||
"phrases_tooltip": "Buscar por frases",
|
||||
"instructions": "Selecciona un resultado de búsqueda...",
|
||||
|
|
|
|||
|
|
@ -21,6 +21,7 @@
|
|||
"bible_study_placeholder": "N° d'étude...",
|
||||
"bible_study_chip": "Étude #{number} {title}",
|
||||
"bible_study_clear": "Effacer les filtres",
|
||||
"filters": "Filtres",
|
||||
"word": "Mot",
|
||||
"phrase": "Phrase",
|
||||
"placeholder": "Rechercher des activités",
|
||||
|
|
|
|||
|
|
@ -21,6 +21,7 @@
|
|||
"bible_study_placeholder": "N° do estudo...",
|
||||
"bible_study_chip": "Estudo #{number} {title}",
|
||||
"bible_study_clear": "Limpar filtros",
|
||||
"filters": "Filtros",
|
||||
"word": "Palavra",
|
||||
"phrase": "Frase",
|
||||
"placeholder": "Digite para pesquisar...",
|
||||
|
|
|
|||
Loading…
Reference in New Issue