Localize /[locale]/search page via next-intl; translate UI strings, filters, statuses; use bookTranslations to render book labels by locale; keep DB filters steady; support popular searches per locale.
This commit is contained in:
@@ -34,6 +34,8 @@ import {
|
||||
History,
|
||||
} from '@mui/icons-material'
|
||||
import { useState, useEffect } from 'react'
|
||||
import { useTranslations, useLocale } from 'next-intl'
|
||||
import { translateBookName } from '@/lib/book-translations'
|
||||
|
||||
interface SearchResult {
|
||||
id: string
|
||||
@@ -52,6 +54,8 @@ interface SearchFilter {
|
||||
|
||||
export default function SearchPage() {
|
||||
const theme = useTheme()
|
||||
const t = useTranslations('pages.search')
|
||||
const locale = useLocale()
|
||||
const [searchQuery, setSearchQuery] = useState('')
|
||||
const [results, setResults] = useState<SearchResult[]>([])
|
||||
const [loading, setLoading] = useState(false)
|
||||
@@ -74,10 +78,7 @@ export default function SearchPage() {
|
||||
'Filipeni', 'Coloseni', 'Evrei', 'Iacob', '1 Petru', 'Apocalipsa'
|
||||
]
|
||||
|
||||
const popularSearches = [
|
||||
'dragoste', 'credință', 'speranță', 'iertare', 'pace',
|
||||
'rugăciune', 'înțelepciune', 'bucurie', 'răbdare', 'milostivire'
|
||||
]
|
||||
const popularSearches: string[] = t.raw('popular.items')
|
||||
|
||||
useEffect(() => {
|
||||
// Load search history from localStorage
|
||||
@@ -181,10 +182,10 @@ export default function SearchPage() {
|
||||
<Box sx={{ mb: 4, textAlign: 'center' }}>
|
||||
<Typography variant="h3" component="h1" gutterBottom>
|
||||
<Search sx={{ fontSize: 40, mr: 2, verticalAlign: 'middle' }} />
|
||||
Căutare în Scriptură
|
||||
{t('title')}
|
||||
</Typography>
|
||||
<Typography variant="body1" color="text.secondary">
|
||||
Găsește rapid versete și pasaje din întreaga Biblie
|
||||
{t('subtitle')}
|
||||
</Typography>
|
||||
</Box>
|
||||
|
||||
@@ -197,29 +198,29 @@ export default function SearchPage() {
|
||||
<Box sx={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', mb: 2 }}>
|
||||
<Typography variant="h6">
|
||||
<FilterList sx={{ mr: 1, verticalAlign: 'middle' }} />
|
||||
Filtre
|
||||
{t('filters.title')}
|
||||
</Typography>
|
||||
<Button size="small" onClick={clearFilters}>
|
||||
Șterge
|
||||
{t('filters.clear')}
|
||||
</Button>
|
||||
</Box>
|
||||
|
||||
<FormControl fullWidth sx={{ mb: 2 }}>
|
||||
<InputLabel>Testament</InputLabel>
|
||||
<InputLabel>{t('filters.testament')}</InputLabel>
|
||||
<Select
|
||||
value={filters.testament}
|
||||
label="Testament"
|
||||
label={t('filters.testament')}
|
||||
onChange={(e) => setFilters({ ...filters, testament: e.target.value as any })}
|
||||
>
|
||||
<MenuItem value="all">Toată Biblia</MenuItem>
|
||||
<MenuItem value="old">Vechiul Testament</MenuItem>
|
||||
<MenuItem value="new">Noul Testament</MenuItem>
|
||||
<MenuItem value="all">{t('filters.options.all')}</MenuItem>
|
||||
<MenuItem value="old">{t('filters.options.old')}</MenuItem>
|
||||
<MenuItem value="new">{t('filters.options.new')}</MenuItem>
|
||||
</Select>
|
||||
</FormControl>
|
||||
|
||||
<Accordion>
|
||||
<AccordionSummary expandIcon={<ExpandMore />}>
|
||||
<Typography variant="body2">Cărți specifice</Typography>
|
||||
<Typography variant="body2">{t('filters.specificBooks')}</Typography>
|
||||
</AccordionSummary>
|
||||
<AccordionDetails>
|
||||
<Box sx={{ maxHeight: 200, overflow: 'auto' }}>
|
||||
@@ -228,7 +229,7 @@ export default function SearchPage() {
|
||||
.map((book) => (
|
||||
<Chip
|
||||
key={book}
|
||||
label={book}
|
||||
label={translateBookName(book, locale)}
|
||||
size="small"
|
||||
variant={filters.books.includes(book) ? 'filled' : 'outlined'}
|
||||
onClick={() => {
|
||||
@@ -252,7 +253,7 @@ export default function SearchPage() {
|
||||
<CardContent>
|
||||
<Typography variant="h6" gutterBottom>
|
||||
<History sx={{ mr: 1, verticalAlign: 'middle' }} />
|
||||
Căutări recente
|
||||
{t('history.title')}
|
||||
</Typography>
|
||||
{searchHistory.slice(0, 5).map((query, index) => (
|
||||
<Chip
|
||||
@@ -272,7 +273,7 @@ export default function SearchPage() {
|
||||
<Card>
|
||||
<CardContent>
|
||||
<Typography variant="h6" gutterBottom>
|
||||
Căutări populare
|
||||
{t('popular.title')}
|
||||
</Typography>
|
||||
{popularSearches.map((query, index) => (
|
||||
<Chip
|
||||
@@ -297,7 +298,7 @@ export default function SearchPage() {
|
||||
<TextField
|
||||
fullWidth
|
||||
variant="outlined"
|
||||
placeholder="Caută cuvinte, fraze sau referințe biblice..."
|
||||
placeholder={t('input.placeholder')}
|
||||
value={searchQuery}
|
||||
onChange={(e) => setSearchQuery(e.target.value)}
|
||||
onKeyPress={handleKeyPress}
|
||||
@@ -325,14 +326,14 @@ export default function SearchPage() {
|
||||
disabled={!searchQuery.trim() || loading}
|
||||
sx={{ minWidth: 100 }}
|
||||
>
|
||||
{loading ? <CircularProgress size={20} color="inherit" /> : 'Caută'}
|
||||
{loading ? <CircularProgress size={20} color="inherit" /> : t('button.search')}
|
||||
</Button>
|
||||
</Box>
|
||||
|
||||
{filters.books.length > 0 && (
|
||||
<Box sx={{ mt: 2 }}>
|
||||
<Typography variant="body2" color="text.secondary" sx={{ mb: 1 }}>
|
||||
Căutare în: {filters.books.join(', ')}
|
||||
{t('searchIn', { books: filters.books.map(b => translateBookName(b, locale)).join(', ') })}
|
||||
</Typography>
|
||||
</Box>
|
||||
)}
|
||||
@@ -344,7 +345,7 @@ export default function SearchPage() {
|
||||
<Card>
|
||||
<CardContent>
|
||||
<Typography variant="h6" gutterBottom>
|
||||
Se caută...
|
||||
{t('searching')}
|
||||
</Typography>
|
||||
<List>
|
||||
{Array.from({ length: 3 }).map((_, index) => (
|
||||
@@ -375,7 +376,7 @@ export default function SearchPage() {
|
||||
<Card>
|
||||
<CardContent>
|
||||
<Typography variant="h6" gutterBottom>
|
||||
Rezultate ({results.length})
|
||||
{t('results', { count: results.length })}
|
||||
</Typography>
|
||||
|
||||
<List>
|
||||
@@ -388,7 +389,7 @@ export default function SearchPage() {
|
||||
{result.book} {result.chapter}:{result.verse}
|
||||
</Typography>
|
||||
<Chip
|
||||
label={`${Math.round(result.relevance * 100)}% relevanță`}
|
||||
label={`${Math.round(result.relevance * 100)}% ${t('relevance')}`}
|
||||
size="small"
|
||||
color="primary"
|
||||
variant="outlined"
|
||||
@@ -411,10 +412,10 @@ export default function SearchPage() {
|
||||
{!loading && searchQuery && results.length === 0 && (
|
||||
<Paper sx={{ p: 4, textAlign: 'center' }}>
|
||||
<Typography variant="h6" color="text.secondary" gutterBottom>
|
||||
Nu s-au găsit rezultate
|
||||
{t('noResults.title')}
|
||||
</Typography>
|
||||
<Typography variant="body2" color="text.secondary">
|
||||
Încearcă să modifici termenul de căutare sau să ajustezi filtrele.
|
||||
{t('noResults.description')}
|
||||
</Typography>
|
||||
</Paper>
|
||||
)}
|
||||
@@ -423,10 +424,10 @@ export default function SearchPage() {
|
||||
<Paper sx={{ p: 4, textAlign: 'center' }}>
|
||||
<MenuBook sx={{ fontSize: 64, color: 'text.secondary', mb: 2 }} />
|
||||
<Typography variant="h6" color="text.secondary" gutterBottom>
|
||||
Începe să cauți în Scriptură
|
||||
{t('empty.title')}
|
||||
</Typography>
|
||||
<Typography variant="body2" color="text.secondary">
|
||||
Introdu un cuvânt, o frază sau o referință biblică pentru a găsi versete relevante.
|
||||
{t('empty.description')}
|
||||
</Typography>
|
||||
</Paper>
|
||||
)}
|
||||
@@ -435,4 +436,4 @@ export default function SearchPage() {
|
||||
</Container>
|
||||
</Box>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user