Piotr Oleszczyk
99584521a1
- Install @inlang/paraglide-js v2 with Vite plugin and paraglideMiddleware hook - Add messages/pl.json and messages/en.json with ~400 translation keys - Create project.inlang/settings.json (PL as base locale) - Add LanguageSwitcher component (cookie-based, no URL prefix needed) - Replace all hardcoded strings across 14 pages/components with m.*() calls - ProductForm uses derived label maps for all enum types (category, texture, etc.) Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
63 lines
2.1 KiB
Svelte
63 lines
2.1 KiB
Svelte
<script lang="ts">
|
|
import '../app.css';
|
|
import { page } from '$app/state';
|
|
import { m } from '$lib/paraglide/messages.js';
|
|
import LanguageSwitcher from '$lib/components/LanguageSwitcher.svelte';
|
|
|
|
let { children } = $props();
|
|
|
|
const navItems = $derived([
|
|
{ href: '/', label: m.nav_dashboard(), icon: '🏠' },
|
|
{ href: '/products', label: m.nav_products(), icon: '🧴' },
|
|
{ href: '/routines', label: m.nav_routines(), icon: '📋' },
|
|
{ href: '/routines/grooming-schedule', label: m.nav_grooming(), icon: '🪒' },
|
|
{ href: '/health/medications', label: m.nav_medications(), icon: '💊' },
|
|
{ href: '/health/lab-results', label: m["nav_labResults"](), icon: '🔬' },
|
|
{ href: '/skin', label: m.nav_skin(), icon: '✨' }
|
|
]);
|
|
|
|
function isActive(href: string) {
|
|
if (href === '/') return page.url.pathname === '/';
|
|
const pathname = page.url.pathname;
|
|
if (!pathname.startsWith(href)) return false;
|
|
// Don't mark parent as active if a more-specific nav item also matches
|
|
const moreSpecific = navItems.some(
|
|
(item) => item.href !== href && item.href.startsWith(href) && pathname.startsWith(item.href)
|
|
);
|
|
return !moreSpecific;
|
|
}
|
|
</script>
|
|
|
|
<div class="flex min-h-screen bg-background">
|
|
<!-- Sidebar -->
|
|
<nav class="w-56 shrink-0 border-r border-border bg-card px-3 py-6">
|
|
<div class="mb-8 px-3">
|
|
<h1 class="text-lg font-semibold tracking-tight">{m["nav_appName"]()}</h1>
|
|
<p class="text-xs text-muted-foreground">{m["nav_appSubtitle"]()}</p>
|
|
</div>
|
|
<ul class="space-y-1">
|
|
{#each navItems as item}
|
|
<li>
|
|
<a
|
|
href={item.href}
|
|
class="flex items-center gap-3 rounded-md px-3 py-2 text-sm transition-colors
|
|
{isActive(item.href)
|
|
? 'bg-accent text-accent-foreground font-medium'
|
|
: 'text-muted-foreground hover:bg-accent hover:text-accent-foreground'}"
|
|
>
|
|
<span class="text-base">{item.icon}</span>
|
|
{item.label}
|
|
</a>
|
|
</li>
|
|
{/each}
|
|
</ul>
|
|
<div class="mt-6 px-3">
|
|
<LanguageSwitcher />
|
|
</div>
|
|
</nav>
|
|
|
|
<!-- Main content -->
|
|
<main class="flex-1 overflow-auto p-8">
|
|
{@render children()}
|
|
</main>
|
|
</div>
|