Rediseno home: hero destacado, chips de genero, masonry + scroll infinito, busqueda publica /buscar, footer comunidad, status/queue protegidos
This commit is contained in:
@@ -0,0 +1,66 @@
|
||||
import Link from "next/link"
|
||||
import { searchPosts } from "@/lib/db"
|
||||
import { PostCard } from "@/components/post-card"
|
||||
import { EmptyState } from "@/components/empty-state"
|
||||
import { Search, ArrowLeft } from "lucide-react"
|
||||
|
||||
export const dynamic = "force-dynamic"
|
||||
|
||||
export default async function PublicSearchPage({
|
||||
searchParams,
|
||||
}: {
|
||||
searchParams: Promise<{ q?: string }>
|
||||
}) {
|
||||
const { q } = await searchParams
|
||||
const query = (q || "").trim()
|
||||
const results = query ? searchPosts(query, true) : []
|
||||
|
||||
return (
|
||||
<div>
|
||||
<Link
|
||||
href="/"
|
||||
className="mb-4 sm:mb-6 inline-flex items-center gap-1.5 text-xs text-[var(--muted)] hover:text-[var(--foreground)] transition-colors"
|
||||
>
|
||||
<ArrowLeft className="h-3.5 w-3.5" />
|
||||
Volver
|
||||
</Link>
|
||||
|
||||
<h1 className="text-xl sm:text-2xl font-bold tracking-tight mb-1">Buscar</h1>
|
||||
<p className="text-xs sm:text-sm text-[var(--muted)] mb-5">
|
||||
Buscar publicaciones por título, artista o tags
|
||||
</p>
|
||||
|
||||
<form action="/buscar" method="get" className="mb-6">
|
||||
<div className="flex gap-2">
|
||||
<input
|
||||
type="search"
|
||||
name="q"
|
||||
defaultValue={query}
|
||||
placeholder="Título, artista, tag..."
|
||||
className="input flex-1"
|
||||
autoFocus
|
||||
/>
|
||||
<button type="submit" className="btn-primary">
|
||||
<Search className="h-4 w-4" />
|
||||
Buscar
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
{!query ? (
|
||||
<p className="text-xs text-[var(--muted)]">Escribí algo para buscar publicaciones.</p>
|
||||
) : results.length === 0 ? (
|
||||
<EmptyState message={`No se encontraron resultados para "${query}"`} />
|
||||
) : (
|
||||
<>
|
||||
<p className="mb-4 text-xs text-[var(--muted)]">{results.length} resultado(s)</p>
|
||||
<div className="grid grid-cols-2 gap-3 sm:gap-4 sm:grid-cols-3 md:grid-cols-4 xl:grid-cols-5">
|
||||
{results.map((post) => (
|
||||
<PostCard key={post.id} post={post} />
|
||||
))}
|
||||
</div>
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -1,8 +1,8 @@
|
||||
import Link from "next/link"
|
||||
import { Image } from "lucide-react"
|
||||
import { Image, Search } from "lucide-react"
|
||||
import { SITE_NAME, SITE_TAGLINE, SITE_LINKS } from "@/lib/site"
|
||||
|
||||
// Header del sitio público: sin links al panel admin (que queda escondido).
|
||||
// Solo navegación pública (logo -> home).
|
||||
// Header del sitio público: búsqueda pública (SQLite) + logo.
|
||||
export default function PublicLayout({ children }: { children: React.ReactNode }) {
|
||||
return (
|
||||
<>
|
||||
@@ -12,16 +12,62 @@ export default function PublicLayout({ children }: { children: React.ReactNode }
|
||||
<div className="flex h-8 w-8 items-center justify-center rounded-lg bg-[var(--accent-subtle)]">
|
||||
<Image className="h-4 w-4 text-[var(--accent)]" />
|
||||
</div>
|
||||
<span className="text-sm font-bold tracking-tight">worst-scan</span>
|
||||
<span className="text-sm font-bold tracking-tight">{SITE_NAME}</span>
|
||||
</Link>
|
||||
<nav className="flex items-center gap-2 sm:gap-4"></nav>
|
||||
<nav className="flex items-center gap-2 sm:gap-4">
|
||||
<Link
|
||||
href="/buscar"
|
||||
className="flex items-center gap-1.5 rounded-lg px-2.5 py-1.5 text-xs text-[var(--muted)] hover:bg-[var(--surface)] hover:text-[var(--foreground)] transition-colors"
|
||||
>
|
||||
<Search className="h-4 w-4" />
|
||||
<span className="hidden sm:inline">Buscar</span>
|
||||
</Link>
|
||||
</nav>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<main className="mx-auto max-w-5xl px-3 py-4 sm:px-4 sm:py-8">{children}</main>
|
||||
|
||||
<footer className="border-t border-[var(--border)] py-6 text-center text-xs text-[var(--muted)] mb-12 sm:mb-0">
|
||||
worst-scan · traducción automática de manga
|
||||
<div className="mx-auto max-w-5xl px-3 flex flex-col items-center gap-3">
|
||||
<p>
|
||||
{SITE_NAME} · {SITE_TAGLINE}
|
||||
</p>
|
||||
<div className="flex items-center gap-4">
|
||||
{SITE_LINKS.twitter && (
|
||||
<>
|
||||
<a
|
||||
href={SITE_LINKS.twitter}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="text-[var(--muted)] hover:text-[var(--accent)] transition-colors"
|
||||
>
|
||||
X / Twitter
|
||||
</a>
|
||||
<span className="text-[var(--border)]">|</span>
|
||||
</>
|
||||
)}
|
||||
<a
|
||||
href={SITE_LINKS.discord}
|
||||
target={SITE_LINKS.discord.startsWith("http") ? "_blank" : undefined}
|
||||
rel="noopener noreferrer"
|
||||
className="text-[var(--muted)] hover:text-[var(--accent)] transition-colors"
|
||||
title={SITE_LINKS.discord === "#" ? "Discord (próximamente)" : "Discord"}
|
||||
>
|
||||
Discord
|
||||
</a>
|
||||
<span className="text-[var(--border)]">|</span>
|
||||
<a
|
||||
href={SITE_LINKS.patreon}
|
||||
target={SITE_LINKS.patreon.startsWith("http") ? "_blank" : undefined}
|
||||
rel="noopener noreferrer"
|
||||
className="text-[var(--muted)] hover:text-[var(--accent)] transition-colors"
|
||||
title={SITE_LINKS.patreon === "#" ? "Patreon (próximamente)" : "Patreon"}
|
||||
>
|
||||
Patreon
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
</>
|
||||
)
|
||||
|
||||
+94
-19
@@ -1,14 +1,28 @@
|
||||
import { getAllPosts } from "@/lib/db"
|
||||
import { PostCard } from "@/components/post-card"
|
||||
import Link from "next/link"
|
||||
import { getPostsPage, getAllPosts } from "@/lib/db"
|
||||
import { InfinitePostGrid } from "@/components/infinite-grid"
|
||||
import { TagBadge } from "@/components/tag-badge"
|
||||
import { EmptyState } from "@/components/empty-state"
|
||||
import { BookOpen } from "lucide-react"
|
||||
import { BookOpen, Sparkles, ArrowRight } from "lucide-react"
|
||||
|
||||
export const dynamic = "force-dynamic"
|
||||
|
||||
export default function PublicHomePage() {
|
||||
const posts = getAllPosts(true)
|
||||
export default async function PublicHomePage() {
|
||||
const { items, total } = getPostsPage(1, 12, true)
|
||||
const latest = getAllPosts(true)[0] // publicación destacada del hero
|
||||
|
||||
if (posts.length === 0) {
|
||||
// Tags más frecuentes para los chips de exploración rápida.
|
||||
const tagCounts = new Map<string, number>()
|
||||
for (const p of getAllPosts(true)) {
|
||||
for (const t of p.tags || []) {
|
||||
const clean = t.toLowerCase().replace(/^artist:|^parody:/, "").trim()
|
||||
if (!clean || clean.includes(" ")) continue
|
||||
tagCounts.set(clean, (tagCounts.get(clean) || 0) + 1)
|
||||
}
|
||||
}
|
||||
const popularTags = [...tagCounts.entries()].sort((a, b) => b[1] - a[1]).slice(0, 10).map(([t]) => t)
|
||||
|
||||
if (total === 0) {
|
||||
return (
|
||||
<div className="py-20">
|
||||
<EmptyState message="Todavía no hay publicaciones" icon={<BookOpen className="mb-3 h-10 w-10 text-[var(--muted)]" />} />
|
||||
@@ -20,19 +34,80 @@ export default function PublicHomePage() {
|
||||
}
|
||||
|
||||
return (
|
||||
<div>
|
||||
<div className="mb-6 sm:mb-8">
|
||||
<h1 className="text-xl sm:text-2xl font-bold tracking-tight">Publicaciones</h1>
|
||||
<p className="mt-1 text-xs sm:text-sm text-[var(--muted)]">
|
||||
Traducciones automáticas generadas por worst-scan
|
||||
</p>
|
||||
</div>
|
||||
<div className="space-y-8 sm:space-y-10">
|
||||
{/* ===== HERO: publicación destacada (hook visual inmediato) ===== */}
|
||||
{latest && (
|
||||
<section className="rounded-3xl overflow-hidden border border-[var(--border)] bg-gradient-to-br from-[var(--surface)] via-[var(--surface)] to-[#1a1a20]">
|
||||
<Link href={`/p/${latest.slug}`} className="group grid gap-0 md:grid-cols-2">
|
||||
<div className="relative aspect-[4/3] md:aspect-auto md:h-full overflow-hidden">
|
||||
<img
|
||||
src={`/api/cover/${latest.gid}`}
|
||||
alt={latest.title}
|
||||
className="h-full w-full object-cover transition-transform duration-700 group-hover:scale-[1.05]"
|
||||
/>
|
||||
<div className="absolute top-3 left-3 inline-flex items-center gap-1.5 rounded-full bg-black/80 backdrop-blur-sm px-3 py-1 text-[10px] font-semibold uppercase tracking-wider text-[var(--accent)] border border-[var(--accent)]/40">
|
||||
<Sparkles className="h-3 w-3" />
|
||||
Último lanzamiento
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex flex-col justify-center gap-4 p-5 sm:p-8">
|
||||
<div className="flex items-center gap-2">
|
||||
<span className="rounded-full bg-[var(--accent)]/10 px-2 py-0.5 text-[10px] font-semibold text-[var(--accent)] border border-[var(--accent)]/30">
|
||||
Destacado
|
||||
</span>
|
||||
{latest.num_pages > 0 && (
|
||||
<span className="text-xs text-[var(--muted)]">{latest.num_pages} páginas</span>
|
||||
)}
|
||||
</div>
|
||||
<h1 className="text-2xl sm:text-4xl font-bold tracking-tight leading-tight line-clamp-3">
|
||||
{latest.title}
|
||||
</h1>
|
||||
{latest.artist && (
|
||||
<p className="text-sm text-[var(--muted)]">por {latest.artist}</p>
|
||||
)}
|
||||
{latest.summary && latest.summary.length > 40 && (
|
||||
<p className="hidden sm:block text-sm text-[var(--muted)] leading-relaxed line-clamp-3">
|
||||
{latest.summary}
|
||||
</p>
|
||||
)}
|
||||
<div className="flex flex-wrap items-center gap-3 pt-2">
|
||||
<span className="inline-flex items-center gap-2 rounded-full bg-[var(--accent)] px-6 py-2.5 text-sm font-semibold text-white transition-all group-hover:bg-[var(--accent-hover)] group-hover:scale-[1.02]">
|
||||
<BookOpen className="h-4 w-4" />
|
||||
Leer
|
||||
<ArrowRight className="h-4 w-4 transition-transform group-hover:translate-x-0.5" />
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</Link>
|
||||
</section>
|
||||
)}
|
||||
|
||||
<div className="grid grid-cols-2 gap-3 sm:gap-4 sm:grid-cols-3 md:grid-cols-4 xl:grid-cols-5">
|
||||
{posts.map((post) => (
|
||||
<PostCard key={post.id} post={post} />
|
||||
))}
|
||||
</div>
|
||||
{/* ===== Chips de tags populares (navegación por interés) ===== */}
|
||||
{popularTags.length > 0 && (
|
||||
<section>
|
||||
<h2 className="mb-3 text-sm font-semibold text-[var(--muted)] uppercase tracking-wider">
|
||||
Explorar por género
|
||||
</h2>
|
||||
<div className="flex flex-wrap gap-2">
|
||||
{popularTags.map((tag) => (
|
||||
<TagBadge key={tag} tag={tag} href={`/tag/${encodeURIComponent(tag)}`} />
|
||||
))}
|
||||
</div>
|
||||
</section>
|
||||
)}
|
||||
|
||||
{/* ===== Feed central: masonry + scroll infinito ===== */}
|
||||
<section>
|
||||
<div className="mb-4 flex items-end justify-between">
|
||||
<div>
|
||||
<h2 className="text-xl sm:text-2xl font-bold tracking-tight">Todas las publicaciones</h2>
|
||||
<p className="mt-1 text-xs sm:text-sm text-[var(--muted)]">
|
||||
{total} traducciones · deslizá para descubrir más
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<InfinitePostGrid initialPosts={items} />
|
||||
</section>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
}
|
||||
@@ -1,9 +1,20 @@
|
||||
import { NextRequest } from "next/server"
|
||||
import { getAllPosts, createPost, getPostByGid } from "@/lib/db"
|
||||
import { getAllPosts, getPostsPage, createPost, getPostByGid } from "@/lib/db"
|
||||
import { slugify } from "@/lib/slug"
|
||||
|
||||
export async function GET(req: NextRequest) {
|
||||
const publishedOnly = req.nextUrl.searchParams.get("published") === "1"
|
||||
const page = Math.max(1, parseInt(req.nextUrl.searchParams.get("page") || "1", 10) || 1)
|
||||
const perPage = Math.min(60, Math.max(1, parseInt(req.nextUrl.searchParams.get("per_page") || "12", 10) || 12))
|
||||
|
||||
if (req.nextUrl.searchParams.has("page") || req.nextUrl.searchParams.has("per_page")) {
|
||||
const { items, total } = getPostsPage(page, perPage, publishedOnly)
|
||||
return Response.json({
|
||||
data: items,
|
||||
meta: { total, page, per_page: perPage, has_more: page * perPage < total },
|
||||
})
|
||||
}
|
||||
|
||||
const posts = getAllPosts(publishedOnly)
|
||||
return Response.json({ data: posts })
|
||||
}
|
||||
|
||||
@@ -164,3 +164,25 @@ body {
|
||||
0% { background-position: 200% 0; }
|
||||
100% { background-position: -200% 0; }
|
||||
}
|
||||
|
||||
/* Entrada suave de cards del feed (fade + slide up), con stagger vía delay */
|
||||
@utility animate-fade-up {
|
||||
animation: fade-up 0.45s ease-out both;
|
||||
}
|
||||
|
||||
@keyframes fade-up {
|
||||
from {
|
||||
opacity: 0;
|
||||
transform: translateY(12px);
|
||||
}
|
||||
to {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
}
|
||||
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
.animate-fade-up {
|
||||
animation: none;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -0,0 +1,100 @@
|
||||
"use client"
|
||||
|
||||
import { useEffect, useRef, useState, useCallback } from "react"
|
||||
import type { Post } from "@/lib/db"
|
||||
import { PostCard } from "@/components/post-card"
|
||||
|
||||
interface Meta {
|
||||
total: number
|
||||
page: number
|
||||
per_page: number
|
||||
has_more: boolean
|
||||
}
|
||||
|
||||
// Feed de scroll infinito estilo TikTok/Pinterest: carga más al acercarse al
|
||||
// fondo, sin que el usuario toque nada -> la persona sigue scrolleando.
|
||||
export function InfinitePostGrid({ initialPosts }: { initialPosts: Post[] }) {
|
||||
const [posts, setPosts] = useState<Post[]>(initialPosts)
|
||||
const [page, setPage] = useState(1)
|
||||
const [meta, setMeta] = useState<Meta | null>(null)
|
||||
const [loading, setLoading] = useState(false)
|
||||
const [error, setError] = useState(false)
|
||||
const sentinelRef = useRef<HTMLDivElement>(null)
|
||||
const loadingRef = useRef(false)
|
||||
|
||||
const loadMore = useCallback(async () => {
|
||||
if (loadingRef.current) return
|
||||
loadingRef.current = true
|
||||
setLoading(true)
|
||||
setError(false)
|
||||
try {
|
||||
const next = page + 1
|
||||
const res = await fetch(`/api/posts?published=1&page=${next}&per_page=12`)
|
||||
if (!res.ok) throw new Error()
|
||||
const json = await res.json()
|
||||
const newPosts = (json.data || []) as Post[]
|
||||
const m = json.meta as Meta | undefined
|
||||
setPosts((prev) => {
|
||||
const seen = new Set(prev.map((p) => p.gid))
|
||||
const fresh = newPosts.filter((p) => !seen.has(p.gid))
|
||||
return [...prev, ...fresh]
|
||||
})
|
||||
setPage(next)
|
||||
setMeta(m || null)
|
||||
} catch {
|
||||
setError(true)
|
||||
} finally {
|
||||
setLoading(false)
|
||||
loadingRef.current = false
|
||||
}
|
||||
}, [page])
|
||||
|
||||
useEffect(() => {
|
||||
const el = sentinelRef.current
|
||||
if (!el || typeof IntersectionObserver === "undefined") return
|
||||
const obs = new IntersectionObserver(
|
||||
(entries) => {
|
||||
const entry = entries[0]
|
||||
if (entry.isIntersecting && (meta ? meta.has_more : true) && !loadingRef.current) {
|
||||
loadMore()
|
||||
}
|
||||
},
|
||||
{ rootMargin: "300px 0px" },
|
||||
)
|
||||
obs.observe(el)
|
||||
return () => obs.disconnect()
|
||||
}, [meta, loadMore])
|
||||
|
||||
return (
|
||||
<div>
|
||||
<div className="columns-2 gap-3 sm:gap-4 md:columns-3 xl:columns-4 [column-fill:balance]">
|
||||
{posts.map((post, i) => (
|
||||
<div key={post.id} className="mb-3 sm:mb-4 break-inside-avoid animate-fade-up" style={{ animationDelay: `${Math.min(i, 8) * 40}ms` }}>
|
||||
<PostCard post={post} />
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
|
||||
{/* Sentinel: cuando entra en viewport, carga la siguiente página */}
|
||||
<div ref={sentinelRef} className="mt-6 flex min-h-[40px] items-center justify-center">
|
||||
{loading && (
|
||||
<div className="flex items-center gap-2 text-xs text-[var(--muted)]">
|
||||
<span className="h-3 w-3 rounded-full border-2 border-[var(--border)] border-t-[var(--accent)] animate-spin" />
|
||||
Cargando más...
|
||||
</div>
|
||||
)}
|
||||
{error && (
|
||||
<button
|
||||
onClick={loadMore}
|
||||
className="btn-ghost border border-[var(--border)] px-4 py-2 text-xs"
|
||||
>
|
||||
Reintentar
|
||||
</button>
|
||||
)}
|
||||
{meta && !meta.has_more && !loading && (
|
||||
<p className="text-xs text-[var(--muted)]">Llegaste al final — no hay nada más. Por ahora. 😉</p>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -2,13 +2,19 @@ import Link from "next/link"
|
||||
import type { Post } from "@/lib/db"
|
||||
import { formatDate } from "@/lib/utils"
|
||||
import { TagBadge } from "@/components/tag-badge"
|
||||
import { BookOpen, Clock } from "lucide-react"
|
||||
|
||||
// Card estilo "pin" (Pinterest/manga sites): portada dominante, hover con zoom
|
||||
// y overlay de lectura, metadata compacta. Image-first para retención visual.
|
||||
export function PostCard({ post, compact = false }: { post: Post; compact?: boolean }) {
|
||||
const isAnthology =
|
||||
post.tags?.some((t) =>
|
||||
["anthology", "compilation", "tankoubon"].some((k) => t.toLowerCase().includes(k))
|
||||
) || post.num_pages >= 100
|
||||
|
||||
// Duraciones de lectura aproximadas para dar contexto (hook de curiosidad).
|
||||
const readMinutes = post.num_pages > 0 ? Math.max(1, Math.round(post.num_pages / 30)) : null
|
||||
|
||||
if (compact) {
|
||||
return (
|
||||
<Link
|
||||
@@ -47,39 +53,58 @@ export function PostCard({ post, compact = false }: { post: Post; compact?: bool
|
||||
return (
|
||||
<Link
|
||||
href={`/p/${post.slug}`}
|
||||
className="card card-hover group flex flex-col overflow-hidden p-0"
|
||||
className="group block overflow-hidden rounded-2xl border border-[var(--border)] bg-[var(--surface)] transition-all duration-300 hover:border-[var(--border-hover)] hover:shadow-lg hover:shadow-black/40 hover:-translate-y-0.5"
|
||||
>
|
||||
{/* Portada dominante con overlay en hover */}
|
||||
<div className="relative aspect-[3/4] overflow-hidden bg-[var(--surface)]">
|
||||
<img
|
||||
src={`/api/cover/${post.gid}`}
|
||||
alt={post.title}
|
||||
className="h-full w-full object-cover transition-transform duration-300 group-hover:scale-[1.03]"
|
||||
className="h-full w-full object-cover transition-transform duration-500 group-hover:scale-[1.06]"
|
||||
loading="lazy"
|
||||
/>
|
||||
{/* Gradiente inferior para legibilidad del overlay */}
|
||||
<div className="absolute inset-x-0 bottom-0 h-24 bg-gradient-to-t from-black/80 to-transparent opacity-0 transition-opacity duration-300 group-hover:opacity-100" />
|
||||
|
||||
{/* Overlay de acción en hover */}
|
||||
<div className="absolute inset-0 flex items-center justify-center opacity-0 transition-opacity duration-300 group-hover:opacity-100">
|
||||
<span className="inline-flex items-center gap-1.5 rounded-full bg-white/95 px-4 py-2 text-xs font-semibold text-black shadow-lg">
|
||||
<BookOpen className="h-3.5 w-3.5" />
|
||||
Leer
|
||||
</span>
|
||||
</div>
|
||||
|
||||
{isAnthology && (
|
||||
<span className="absolute top-2 left-2 rounded bg-black/80 backdrop-blur-sm px-1.5 py-0.5 text-[9px] font-bold text-[var(--accent)] border border-[var(--accent)]/40 shadow">
|
||||
<span className="absolute top-2 left-2 rounded-full bg-black/80 backdrop-blur-sm px-2 py-0.5 text-[9px] font-bold text-[var(--accent)] border border-[var(--accent)]/40 shadow">
|
||||
ANTOLOGÍA
|
||||
</span>
|
||||
)}
|
||||
{post.num_pages > 0 && (
|
||||
<span className="absolute top-2 right-2 inline-flex items-center gap-1 rounded-full bg-black/70 backdrop-blur-sm px-2 py-0.5 text-[10px] font-medium text-[var(--muted-light)]">
|
||||
<Clock className="h-3 w-3" />
|
||||
{post.num_pages}p
|
||||
</span>
|
||||
)}
|
||||
</div>
|
||||
<div className="flex flex-1 flex-col gap-2 p-3">
|
||||
|
||||
{/* Metadatos */}
|
||||
<div className="flex flex-col gap-1.5 p-3">
|
||||
<h3 className="line-clamp-2 text-sm font-semibold leading-snug group-hover:text-[var(--accent)] transition-colors">
|
||||
{post.title}
|
||||
</h3>
|
||||
{post.artist && (
|
||||
<p className="text-xs text-[var(--muted)]">{post.artist}</p>
|
||||
)}
|
||||
<div className="flex items-center justify-between text-[10px] text-[var(--muted)]">
|
||||
<span className="truncate">{post.artist || post.parody || post.source || "worst-scan"}</span>
|
||||
{readMinutes && (
|
||||
<span className="flex-shrink-0">{readMinutes} min</span>
|
||||
)}
|
||||
</div>
|
||||
{post.tags && post.tags.length > 0 && (
|
||||
<div className="flex flex-wrap gap-1">
|
||||
{post.tags.slice(0, 3).map((tag) => (
|
||||
{post.tags.slice(0, 2).map((tag) => (
|
||||
<TagBadge key={tag} tag={tag} href={`/tag/${encodeURIComponent(tag)}`} />
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
<div className="mt-auto flex items-center gap-2 text-[10px] text-[var(--muted)]">
|
||||
{post.num_pages > 0 && <span>{post.num_pages} pág</span>}
|
||||
{post.published_at && <span>{formatDate(post.published_at)}</span>}
|
||||
</div>
|
||||
</div>
|
||||
</Link>
|
||||
)
|
||||
|
||||
@@ -214,6 +214,38 @@ export function getPostCount(): number {
|
||||
return row.count
|
||||
}
|
||||
|
||||
// Búsqueda pública por título/título_jpn/artista/tags (LIKE sobre JSON).
|
||||
export function searchPosts(query: string, publishedOnly = true): Post[] {
|
||||
const d = getDb()
|
||||
const q = `%${query}%`
|
||||
const where = publishedOnly ? "published = 1 AND" : ""
|
||||
const rows = d
|
||||
.prepare(
|
||||
`SELECT * FROM posts WHERE ${where} (
|
||||
title LIKE @q OR
|
||||
title_jpn LIKE @q OR
|
||||
artist LIKE @q OR
|
||||
parody LIKE @q OR
|
||||
tags LIKE @q
|
||||
) ORDER BY published_at DESC LIMIT 100`,
|
||||
)
|
||||
.all({ q }) as Record<string, unknown>[]
|
||||
return rows.map(rowToPost)
|
||||
}
|
||||
|
||||
// Paginación de la home pública.
|
||||
export function getPostsPage(page: number, perPage: number, publishedOnly = true): { items: Post[]; total: number } {
|
||||
const d = getDb()
|
||||
const offset = (page - 1) * perPage
|
||||
const where = publishedOnly ? "WHERE published = 1" : ""
|
||||
const order = publishedOnly ? "published_at DESC" : "created_at DESC"
|
||||
const rows = d
|
||||
.prepare(`SELECT * FROM posts ${where} ORDER BY ${order} LIMIT @perPage OFFSET @offset`)
|
||||
.all({ perPage, offset }) as Record<string, unknown>[]
|
||||
const total = (d.prepare(`SELECT COUNT(*) as count FROM posts ${where}`).get() as { count: number }).count
|
||||
return { items: rows.map(rowToPost), total }
|
||||
}
|
||||
|
||||
export function getGidsNotInPosts(): string[] {
|
||||
return []
|
||||
}
|
||||
|
||||
@@ -0,0 +1,10 @@
|
||||
// Links comunitarios del sitio. Reemplazá los placeholders cuando tengas
|
||||
// Discord y Patreon reales.
|
||||
export const SITE_LINKS = {
|
||||
twitter: "https://x.com/worstscan",
|
||||
discord: "#", // TODO: link real de Discord
|
||||
patreon: "#", // TODO: link real de Patreon
|
||||
}
|
||||
|
||||
export const SITE_NAME = "worst-scan"
|
||||
export const SITE_TAGLINE = "traducción automática de manga"
|
||||
+5
-8
@@ -24,17 +24,14 @@ const publicPrefixes = [
|
||||
// "/" es MATCH EXACTO (startsWith("/") matchearía TODO).
|
||||
// "/gallery/" incluye el lector: cualquiera puede LEER (GET); las acciones
|
||||
// del panel (eliminar, etc.) quedan protegidas por el middleware vía método.
|
||||
const publicPages = ["/p/", "/tag/", "/gallery/"]
|
||||
const publicPages = ["/p/", "/tag/", "/gallery/", "/buscar"]
|
||||
|
||||
// GET de lectura del proxy hacia el pipeline: públicos para que el lector
|
||||
// funcione sin login. POST/DELETE/PATCH (mutaciones) siempre requieren sesión.
|
||||
// GET de lectura del proxy hacia el pipeline: solo las rutas que el LECTOR
|
||||
// público necesita (páginas, summary, artifacts, cover). /status y /queue
|
||||
// exponen info operativa interna -> requieren sesión.
|
||||
function isPublicProxyRead(pathname: string, method: string): boolean {
|
||||
if (method !== "GET" && method !== "HEAD") return false
|
||||
return (
|
||||
pathname.startsWith("/api/proxy/galleries/") ||
|
||||
pathname === "/api/proxy/status" ||
|
||||
pathname === "/api/proxy/queue"
|
||||
)
|
||||
return pathname.startsWith("/api/proxy/galleries/")
|
||||
}
|
||||
|
||||
function isPublicPath(pathname: string, method: string): boolean {
|
||||
|
||||
Reference in New Issue
Block a user