diff --git a/ui/src/routes/books/[slug]/chapters/+page.svelte b/ui/src/routes/books/[slug]/chapters/+page.svelte
index 48ac87a..0606937 100644
--- a/ui/src/routes/books/[slug]/chapters/+page.svelte
+++ b/ui/src/routes/books/[slug]/chapters/+page.svelte
@@ -1,6 +1,7 @@
- Jump to Ch.{data.lastChapter}
+ {m.chapters_jump_to({ n: String(data.lastChapter) })}
{/if}
{#if visibleChapters.length === 0}
{#if searchQuery}
-
No chapters available yet.
@@ -165,7 +166,7 @@
class="flex-1 min-w-0 text-sm truncate transition-colors
{isCurrent ? 'text-(--color-brand-dim) font-medium' : 'text-(--color-text) group-hover:text-(--color-text)'}"
>
- {chapter.title || `Chapter ${chapter.number}`}
+ {chapter.title || m.reader_chapter_n({ n: String(chapter.number) })}
@@ -177,7 +178,7 @@
{#if isCurrent}
-
reading
+
{m.chapters_reading_indicator()}
{/if}
{/each}
diff --git a/ui/src/routes/books/[slug]/chapters/[n]/+page.svelte b/ui/src/routes/books/[slug]/chapters/[n]/+page.svelte
index 65ce83b..2150ffb 100644
--- a/ui/src/routes/books/[slug]/chapters/[n]/+page.svelte
+++ b/ui/src/routes/books/[slug]/chapters/[n]/+page.svelte
@@ -2,6 +2,7 @@
import { onMount, untrack } from 'svelte';
import AudioPlayer from '$lib/components/AudioPlayer.svelte';
import type { PageData } from './$types';
+ import * as m from '$lib/paraglide/messages.js';
let { data }: { data: PageData } = $props();
@@ -9,15 +10,6 @@
let fetchingContent = $state(untrack(() => !data.isPreview && !data.html));
let fetchError = $state('');
- // ── Word count ────────────────────────────────────────────────────────────
- function countWords(htmlStr: string | null): number {
- if (!htmlStr) return 0;
- // Strip HTML tags, collapse whitespace, split on whitespace
- return htmlStr.replace(/<[^>]+>/g, ' ').trim().split(/\s+/).filter(Boolean).length;
- }
-
- const wordCount = $derived(countWords(html));
-
onMount(async () => {
// Umami analytics: track chapter reads
window.umami?.track('chapter_read', {
@@ -50,31 +42,35 @@
const { marked } = await import('marked');
html = await marked(d.text, { async: true });
} else {
- fetchError = 'Chapter content not available.';
+ fetchError = m.reader_audio_error();
}
} catch (e) {
- fetchError = 'Could not fetch chapter content.';
+ fetchError = m.reader_fetching_chapter();
} finally {
fetchingContent = false;
}
}
});
+
+ const wordCount = $derived(
+ html ? (html.replace(/<[^>]*>/g, '').match(/\S+/g)?.length ?? 0) : 0
+ );
- {data.chapter.title || `Chapter ${data.chapter.number}`} — {data.book.title} — libnovel
+ {data.chapter.title || m.reader_chapter_n({ n: String(data.chapter.number) })} — {data.book.title} — libnovel
- Chapters
+ {m.reader_back_to_chapters()}
@@ -83,7 +79,7 @@
href="/books/{data.book.slug}/chapters/{data.prev}"
class="px-3 py-1.5 rounded bg-(--color-surface-3) text-(--color-text) text-sm hover:bg-(--color-surface-3) transition-colors"
>
- ← Ch.{data.prev}
+ ← {m.reader_chapter_n({ n: String(data.prev) })}
{/if}
{#if data.next}
@@ -91,7 +87,7 @@
href="/books/{data.book.slug}/chapters/{data.next}"
class="px-3 py-1.5 rounded bg-(--color-brand) text-(--color-surface) text-sm font-semibold hover:bg-(--color-brand-dim) transition-colors"
>
- Ch.{data.next} →
+ {m.reader_chapter_n({ n: String(data.next) })} →
{/if}
@@ -100,10 +96,10 @@
- {data.chapter.title || `Chapter ${data.chapter.number}`}
+ {data.chapter.title || m.reader_chapter_n({ n: String(data.chapter.number) })}
{#if wordCount > 0}
-
{wordCount.toLocaleString()} words
+
{m.reader_words({ n: wordCount.toLocaleString() })}
{/if}
@@ -112,7 +108,7 @@
{:else}
- Preview chapter — audio not available for books outside the library.
+ {m.reader_preview_audio_notice()}
{/if}
@@ -132,11 +128,11 @@
- Fetching chapter…
+ {m.reader_fetching_chapter()}
{:else if !html}
-
{fetchError || 'Chapter content not available.'}
+
{fetchError || m.reader_audio_error()}
{:else}
@@ -151,7 +147,7 @@
href="/books/{data.book.slug}/chapters/{data.prev}"
class="px-4 py-2 rounded bg-(--color-surface-3) text-(--color-text) text-sm hover:bg-(--color-surface-3) transition-colors"
>
- ← Previous chapter
+ ← {m.reader_prev_chapter()}
{:else}
@@ -161,7 +157,7 @@
href="/books/{data.book.slug}/chapters/{data.next}"
class="px-4 py-2 rounded bg-(--color-brand) text-(--color-surface) text-sm font-semibold hover:bg-(--color-brand-dim) transition-colors"
>
- Next chapter →
+ {m.reader_next_chapter()} →
{/if}
diff --git a/ui/src/routes/catalogue/+page.svelte b/ui/src/routes/catalogue/+page.svelte
index 0df433c..bdbad1c 100644
--- a/ui/src/routes/catalogue/+page.svelte
+++ b/ui/src/routes/catalogue/+page.svelte
@@ -5,17 +5,15 @@
import { untrack } from 'svelte';
import type { PageData, ActionData } from './$types';
import type { NovelListing } from './+page.server';
+ import * as m from '$lib/paraglide/messages.js';
let { data, form }: { data: PageData; form: ActionData } = $props();
// ── Local filter state (mirrors URL params) ──────────────────────────────
- // These are separate from data.* so we can bind them to selects and keep
- // the DOM in sync. They sync back from data whenever a navigation completes.
let filterSort = $state(untrack(() => data.sort));
let filterGenre = $state(untrack(() => data.genre));
let filterStatus = $state(untrack(() => data.status));
- // Keep local state in sync whenever SvelteKit re-runs the load (URL changed).
$effect(() => {
filterSort = data.sort;
filterGenre = data.genre;
@@ -31,10 +29,8 @@
goto(`/catalogue?${params.toString()}`);
}
- // Track which novel card is currently being navigated to
let loadingSlug = $state
(null);
- // Clear loading state when navigation ends (success or failure)
$effect(() => {
if (!navigating) loadingSlug = null;
});
@@ -44,15 +40,11 @@
}
// ── Infinite scroll state ────────────────────────────────────────────────
- // novels is the accumulated list across all fetched pages.
- // Seeded from SSR page 1; new pages are appended client-side.
let novels = $state(untrack(() => data.novels));
let currentPage = $state(untrack(() => data.page));
let hasNext = $state(untrack(() => data.hasNext));
let loadingMore = $state(false);
- // A key derived from the active filters — when it changes, reset the list
- // to the fresh SSR data (SvelteKit already re-ran the server load).
let filterKey = $derived(`${data.sort}|${data.genre}|${data.status}|${data.searchQuery}`);
let lastFilterKey = '';
$effect(() => {
@@ -66,7 +58,6 @@
async function loadNextPage() {
if (loadingMore || !hasNext) return;
- // Infinite scroll only applies in browse mode (not rank, not search)
if (data.sort === 'rank' || data.searchQuery) return;
loadingMore = true;
@@ -106,44 +97,38 @@
return () => observer.disconnect();
});
- // Filter options — built from Meilisearch facet distribution when available,
- // with a hardcoded fallback list for when Meilisearch is not yet populated.
const FALLBACK_GENRES = [
'action', 'adventure', 'comedy', 'drama', 'fantasy', 'harem',
'historical', 'horror', 'isekai', 'martial-arts', 'mystery',
'psychological', 'romance', 'sci-fi', 'system', 'xianxia'
];
const genres = $derived([
- { value: 'all', label: 'All Genres' },
+ { value: 'all', label: m.catalogue_genre_all() },
...((data.genres?.length ? data.genres : FALLBACK_GENRES).map((g: string) => ({
value: g,
label: g.charAt(0).toUpperCase() + g.slice(1).replace(/-/g, ' ')
})))
]);
- const sorts = [
- { value: 'popular', label: 'Popular' },
- { value: 'new', label: 'New' },
- { value: 'update', label: 'Updated' },
- { value: 'top-rated', label: 'Top Rated' },
- { value: 'rank', label: 'Ranking' }
- ];
+ const sorts = $derived([
+ { value: 'popular', label: m.catalogue_sort_popular() },
+ { value: 'new', label: m.catalogue_sort_new() },
+ { value: 'update', label: m.catalogue_sort_updated() },
+ { value: 'top-rated', label: m.catalogue_sort_top_rated() },
+ { value: 'rank', label: m.catalogue_sort_rank() }
+ ]);
const FALLBACK_STATUSES = ['ongoing', 'completed'];
const statuses = $derived([
- { value: 'all', label: 'All' },
+ { value: 'all', label: m.catalogue_status_all() },
...((data.statuses?.length ? data.statuses : FALLBACK_STATUSES).map((s: string) => ({
value: s,
label: s.charAt(0).toUpperCase() + s.slice(1)
})))
]);
- // When sort=rank the ranking API is used — pagination + genre/status filters
- // don't apply to that endpoint.
const isRankView = $derived(data.sort === 'rank');
const isSearchView = $derived(!!data.searchQuery);
-
// View toggle: 'grid' | 'list'. Persisted in localStorage.
- // Rank view always uses list; otherwise restore saved preference (default: grid).
const VIEW_KEY = 'libnovel:browse:view';
function savedView(): 'grid' | 'list' {
if (data.sort === 'rank') return 'list';
@@ -154,7 +139,6 @@
return 'grid';
}
let view = $state<'grid' | 'list'>(savedView());
- // Keep view in sync when sort changes via filter form, and persist changes.
$effect(() => {
if (data.sort === 'rank' && view === 'grid') view = 'list';
});
@@ -194,7 +178,6 @@
// ── Collapsible filters panel ────────────────────────────────────────────
let filtersOpen = $state(false);
- // Human-readable summary of active filters shown on the toggle button
const filterSummary = $derived((() => {
const parts: string[] = [];
const sortLabel = sorts.find((s) => s.value === data.sort)?.label ?? data.sort;
@@ -210,7 +193,6 @@
return parts.join(' · ');
})());
- // Whether any non-default filter is active (used to show a dot indicator)
const hasActiveFilters = $derived(
(data.genre && data.genre !== 'all') ||
(data.status && data.status !== 'all') ||
@@ -229,26 +211,26 @@
- Catalogue — libnovel
+ {m.catalogue_page_title()}
-
Catalogue
+
{m.catalogue_heading()}
{#if isSearchView}
- {novels.length} result{novels.length !== 1 ? 's' : ''} for "{data.searchQuery}"
+ {m.catalogue_search_results({ n: String(novels.length), s: novels.length !== 1 ? 's' : '', q: data.searchQuery })}
{#if data.searchLocalCount > 0 || data.searchRemoteCount > 0}
- ({data.searchLocalCount} local, {data.searchRemoteCount} from novelfire)
+ {m.catalogue_search_local_count({ local: String(data.searchLocalCount), remote: String(data.searchRemoteCount) })}
{/if}
{:else if isRankView}
{#if novels.length > 0}
- {novels.length} novels ranked from last catalogue scrape
+ {m.catalogue_rank_ranked({ n: String(novels.length) })}
{:else}
- No ranking data — run a full catalogue scrape to populate
+ {m.catalogue_rank_no_data_body()}
{/if}
{:else}
- Browse novels from novelfire.net
+ {m.catalogue_browse_source()}
{/if}
- Full catalogue scrape queued. Library and ranking will update as books are processed.
+ {m.catalogue_scrape_queued_flash()}
{:else if form.status === 'busy'}
- A scrape job is already running. Check back once it finishes.
+ {m.catalogue_scrape_busy_flash()}
{:else if form.status === 'error'}
- Failed to queue scrape. Check that the scraper service is reachable.
+ {m.catalogue_scrape_error_flash()}
{/if}
{/if}
@@ -278,21 +260,21 @@
type="search"
name="q"
value={data.searchQuery}
- placeholder="Search…"
+ placeholder={m.catalogue_search_placeholder()}
class="flex-1 min-w-0 bg-(--color-surface-2) border border-(--color-border) text-(--color-text) text-sm rounded px-3 py-2 focus:outline-none focus:border-(--color-brand) placeholder-zinc-500"
/>
{#if data.searchQuery}
- Clear
+ {m.catalogue_clear_filters()}
{/if}
@@ -311,8 +293,7 @@
- Filters
-
+ {m.catalogue_filters_label()}
{#if hasActiveFilters}
{/if}
@@ -322,7 +303,7 @@
{/if}
@@ -374,13 +355,13 @@
{#if !filtersOpen && hasActiveFilters}
{filterSummary}
- clear
+ {m.catalogue_clear_filters().toLowerCase()}
{/if}
{#if filtersOpen}
-
+
{#if data.isAdmin}
{/if}
@@ -409,7 +390,7 @@
-
+