All checks were successful
Build & Deploy / build-and-deploy (push) Successful in 34s
- Fix column name mismatch in paperclip_client.py and app.py: Paperclip's companies table uses `issue_prefix`, not `identifier` - Fix _LEGAL_DB_URL to read from POSTGRES_URL env var (used in container) - Add settings page (/settings) for managing tag → Paperclip company mappings - Replace "תיק חדש" nav item with "הגדרות" (new case is on home page) Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
101 lines
3.0 KiB
TypeScript
101 lines
3.0 KiB
TypeScript
"use client";
|
||
|
||
import type { ReactNode } from "react";
|
||
import Link from "next/link";
|
||
import { usePathname } from "next/navigation";
|
||
|
||
/**
|
||
* Ezer Mishpati navigation shell.
|
||
*
|
||
* Editorial/judicial aesthetic:
|
||
* - Navy header with a gold hairline rule (border-b-3)
|
||
* - Parchment/cream body background (set on <body> via globals.css)
|
||
* - Hebrew RTL throughout (set on <html> in layout.tsx)
|
||
*
|
||
* Nav items pick up an `aria-current="page"` and a gold underline when
|
||
* the current route matches, so screen readers announce the active
|
||
* section and sighted users can see where they are.
|
||
*/
|
||
|
||
type NavItem = {
|
||
href: string;
|
||
label: string;
|
||
};
|
||
|
||
const NAV_ITEMS: NavItem[] = [
|
||
{ href: "/", label: "בית" },
|
||
{ href: "/training", label: "אימון סגנון" },
|
||
{ href: "/skills", label: "מיומנויות" },
|
||
{ href: "/diagnostics", label: "אבחון" },
|
||
{ href: "/settings", label: "הגדרות" },
|
||
];
|
||
|
||
function isActive(pathname: string, href: string): boolean {
|
||
if (href === "/") return pathname === "/";
|
||
return pathname === href || pathname.startsWith(`${href}/`);
|
||
}
|
||
|
||
export function AppShell({ children }: { children: ReactNode }) {
|
||
const pathname = usePathname();
|
||
|
||
return (
|
||
<>
|
||
<header
|
||
className="
|
||
relative z-10 flex items-center gap-4
|
||
px-10 py-[18px]
|
||
bg-navy text-parchment
|
||
border-b-[3px] border-gold
|
||
shadow-md
|
||
"
|
||
>
|
||
<Link href="/" className="flex items-baseline gap-3 hover:text-parchment">
|
||
<span className="font-display text-[1.45rem] font-bold tracking-[0.02em] text-parchment">
|
||
עוזר משפטי
|
||
</span>
|
||
<span className="text-gold-soft text-sm font-medium">ניהול תיקים</span>
|
||
</Link>
|
||
|
||
<nav
|
||
className="me-auto flex items-center gap-1"
|
||
aria-label="ניווט ראשי"
|
||
>
|
||
{NAV_ITEMS.map((item) => {
|
||
const active = isActive(pathname, item.href);
|
||
return (
|
||
<Link
|
||
key={item.href}
|
||
href={item.href}
|
||
aria-current={active ? "page" : undefined}
|
||
className={`
|
||
relative px-3 py-1.5 rounded text-sm transition-colors
|
||
${
|
||
active
|
||
? "text-parchment font-semibold bg-navy-soft/80"
|
||
: "text-parchment/80 hover:text-parchment hover:bg-navy-soft/60"
|
||
}
|
||
`}
|
||
>
|
||
{item.label}
|
||
{active && (
|
||
<span
|
||
className="absolute -bottom-[19px] inset-x-2 h-[2px] bg-gold"
|
||
aria-hidden="true"
|
||
/>
|
||
)}
|
||
</Link>
|
||
);
|
||
})}
|
||
</nav>
|
||
</header>
|
||
|
||
<main
|
||
id="main"
|
||
className="flex-1 w-full max-w-[1400px] mx-auto px-10 py-10"
|
||
>
|
||
{children}
|
||
</main>
|
||
</>
|
||
);
|
||
}
|