כרטיסי טענות-הסף והסוגיות ב"עמדות וטענות" ישבו ב-CSS Grid דו-טורי (`lg:grid-cols-2`). ב-Grid כל שורה חולקת גובה, ולכן פתיחת כרטיס בטור אחד הגדילה את גובה השורה ודחפה מטה את כל מה שמתחת — בשני הטורים. מעבר לטור אחד (`space-y-3`) מקומם את הקפיצה למה שמתחת לכרטיס שנפתח בלבד, ונותן לתוכן הנפתח (שדות + עורך עמדת-היו״ר + פסיקה תומכת) רוחב מלא במקום חצי — נוח בהרבה לעריכה בעברית. זוג הכרטיסים התחתון (פסיקה מצורפת + ייצוא/עדכון הניתוח) נשאר דו-טורי; הוא אינו נפתח ואינו סובל מהבעיה. invariants: INV-IA1 (מקור-אמת יחיד) נשמר — שינוי פריסה בלבד, ללא נגיעה בנתונים, ב-hooks או ב-API. G2/G10/G12 — לא רלוונטיים. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
307 lines
12 KiB
TypeScript
307 lines
12 KiB
TypeScript
"use client";
|
||
|
||
import { useRef, useState } from "react";
|
||
import { Card, CardContent } from "@/components/ui/card";
|
||
import { Button } from "@/components/ui/button";
|
||
import { Skeleton } from "@/components/ui/skeleton";
|
||
import { SubsectionCard } from "@/components/compose/subsection-card";
|
||
import { PrecedentsSection } from "@/components/compose/precedents-section";
|
||
import { Markdown } from "@/components/ui/markdown";
|
||
import { useCase } from "@/lib/api/cases";
|
||
import { useResearchAnalysis } from "@/lib/api/research";
|
||
import { useCasePrecedents } from "@/lib/api/precedents";
|
||
|
||
/*
|
||
* PositionsPanel — the chair's editing surface for the analyst's threshold
|
||
* claims + issues (chair positions feed block י). Extracted verbatim from the
|
||
* former /compose "עמדות וטענות" tab when the decision editor was merged into
|
||
* the main case page (X17 #3). Lives inside the "טיעונים ועמדות" tab above the
|
||
* collapsible by-party aggregated arguments. The 12-block editor + citation
|
||
* verification moved to their own top-level tabs; /compose was deleted.
|
||
*
|
||
* The threshold-claim / issue cards deliberately stack in a SINGLE column.
|
||
* They were a two-column CSS grid, but grid rows share a height: expanding one
|
||
* card grew its row and shoved every card below it down — in *both* columns.
|
||
* A single column keeps the jump local to what sits underneath, and gives the
|
||
* expanded body (fields + chair editor + supporting precedents) full width
|
||
* instead of half. Do not reintroduce `lg:grid-cols-2` here (chair, 2026-08-04).
|
||
*/
|
||
|
||
function ProseSection({ title, content }: { title: string; content?: string }) {
|
||
if (!content?.trim()) return null;
|
||
return (
|
||
<section className="space-y-2">
|
||
<h3 className="text-[0.78rem] uppercase tracking-[0.08em] text-gold-deep font-semibold">
|
||
{title}
|
||
</h3>
|
||
<Markdown content={content.trim()} />
|
||
</section>
|
||
);
|
||
}
|
||
|
||
// ── "ייצוא ועדכון הניתוח" rail card — round-trips the analysis-and-research.md
|
||
// research analysis: export DOCX, upload an updated version, download the raw MD.
|
||
// (Post-final learning status lives on the drafts tab, not here — #226.) ──────
|
||
function FinishRail({
|
||
caseNumber,
|
||
hasAnalysis,
|
||
onUploaded,
|
||
}: {
|
||
caseNumber: string;
|
||
hasAnalysis: boolean;
|
||
onUploaded: () => void;
|
||
}) {
|
||
const fileRef = useRef<HTMLInputElement>(null);
|
||
const [uploading, setUploading] = useState(false);
|
||
const [uploadMsg, setUploadMsg] = useState<{ ok: boolean; text: string } | null>(null);
|
||
|
||
async function handleUpload(file: File) {
|
||
setUploading(true);
|
||
setUploadMsg(null);
|
||
try {
|
||
const form = new FormData();
|
||
form.append("file", file);
|
||
const res = await fetch(`/api/cases/${caseNumber}/research/analysis/upload`, {
|
||
method: "PUT",
|
||
body: form,
|
||
});
|
||
const data = await res.json();
|
||
if (!res.ok) {
|
||
setUploadMsg({ ok: false, text: data.detail || "שגיאה בהעלאה" });
|
||
return;
|
||
}
|
||
setUploadMsg({
|
||
ok: true,
|
||
text: `הקובץ הועלה — ${data.sections.threshold_claims} טענות סף, ${data.sections.issues} סוגיות`,
|
||
});
|
||
onUploaded();
|
||
} catch {
|
||
setUploadMsg({ ok: false, text: "שגיאת רשת" });
|
||
} finally {
|
||
setUploading(false);
|
||
if (fileRef.current) fileRef.current.value = "";
|
||
}
|
||
}
|
||
|
||
return (
|
||
<Card className="bg-surface border-rule shadow-sm h-full">
|
||
<CardContent className="px-4 py-4">
|
||
<h3 className="text-navy text-[0.9rem] font-semibold mb-1">ייצוא ועדכון הניתוח</h3>
|
||
<p className="text-[0.72rem] text-ink-muted mb-3">
|
||
פעולות על קובץ ניתוח-המחקר (analysis-and-research.md).
|
||
</p>
|
||
|
||
<input
|
||
ref={fileRef}
|
||
type="file"
|
||
accept=".md"
|
||
className="hidden"
|
||
onChange={(e) => {
|
||
const f = e.target.files?.[0];
|
||
if (f) handleUpload(f);
|
||
}}
|
||
/>
|
||
|
||
<div className="space-y-2">
|
||
{hasAnalysis && (
|
||
<Button
|
||
variant="outline"
|
||
className="w-full justify-center"
|
||
onClick={() => {
|
||
const a = document.createElement("a");
|
||
a.href = `/api/cases/${caseNumber}/research/analysis/export-docx`;
|
||
a.click();
|
||
}}
|
||
>
|
||
ייצוא DOCX
|
||
</Button>
|
||
)}
|
||
<Button
|
||
className="w-full justify-center bg-gold text-white hover:bg-gold-deep"
|
||
disabled={uploading}
|
||
onClick={() => fileRef.current?.click()}
|
||
>
|
||
{uploading ? "מעלה…" : "העלאת ניתוח מעודכן"}
|
||
</Button>
|
||
{hasAnalysis && (
|
||
<Button
|
||
variant="outline"
|
||
className="w-full justify-center"
|
||
onClick={() => {
|
||
const a = document.createElement("a");
|
||
a.href = `/api/cases/${caseNumber}/research/analysis/download`;
|
||
a.download = `analysis-${caseNumber}.md`;
|
||
a.click();
|
||
}}
|
||
>
|
||
הורד ניתוח (MD)
|
||
</Button>
|
||
)}
|
||
</div>
|
||
|
||
{uploadMsg && (
|
||
<p className={`text-xs mt-2 ${uploadMsg.ok ? "text-success" : "text-danger"}`}>
|
||
{uploadMsg.text}
|
||
</p>
|
||
)}
|
||
</CardContent>
|
||
</Card>
|
||
);
|
||
}
|
||
|
||
export function PositionsPanel({ caseNumber }: { caseNumber: string }) {
|
||
const caseQuery = useCase(caseNumber);
|
||
const analysis = useResearchAnalysis(caseNumber);
|
||
const precedentsQuery = useCasePrecedents(caseNumber);
|
||
|
||
const allPrecedents = precedentsQuery.data ?? [];
|
||
const caseLevelPrecedents = allPrecedents.filter((p) => p.section_id === null);
|
||
const precedentsBySection = new Map<string, typeof allPrecedents>();
|
||
for (const p of allPrecedents) {
|
||
if (p.section_id) {
|
||
const existing = precedentsBySection.get(p.section_id) ?? [];
|
||
existing.push(p);
|
||
precedentsBySection.set(p.section_id, existing);
|
||
}
|
||
}
|
||
const practiceArea = caseQuery.data?.practice_area ?? null;
|
||
|
||
const isNotFound =
|
||
analysis.error instanceof Error &&
|
||
/404|לא נמצא|טרם בוצע/.test(analysis.error.message);
|
||
|
||
return (
|
||
<div className="space-y-4">
|
||
{analysis.isPending ? (
|
||
<Card className="bg-surface border-rule shadow-sm">
|
||
<CardContent className="px-6 py-5 space-y-3">
|
||
<Skeleton className="h-6 w-48" />
|
||
<Skeleton className="h-4 w-96" />
|
||
<Skeleton className="h-32 w-full" />
|
||
</CardContent>
|
||
</Card>
|
||
) : isNotFound ? (
|
||
<Card className="bg-surface border-rule shadow-sm">
|
||
<CardContent className="px-6 py-12 text-center space-y-3">
|
||
<div className="text-gold text-3xl" aria-hidden>❦</div>
|
||
<h2 className="text-navy text-lg mb-0">
|
||
טרם בוצע ניתוח משפטי לתיק זה
|
||
</h2>
|
||
<p className="text-ink-muted text-sm max-w-md mx-auto">
|
||
לאחר שקובץ <code>analysis-and-research.md</code> ייווצר, תוכלי
|
||
לערוך כאן את עמדת הוועדה לכל טענת סף וסוגיה.
|
||
</p>
|
||
</CardContent>
|
||
</Card>
|
||
) : analysis.error ? (
|
||
<Card className="bg-danger-bg border-danger/40">
|
||
<CardContent className="px-6 py-5 text-center">
|
||
<p className="text-danger">{analysis.error.message}</p>
|
||
</CardContent>
|
||
</Card>
|
||
) : analysis.data ? (
|
||
<div className="space-y-6">
|
||
{analysis.data.threshold_claims &&
|
||
analysis.data.threshold_claims.length > 0 && (
|
||
<div className="space-y-3">
|
||
<div className="flex items-center gap-2">
|
||
<h2 className="text-navy text-lg font-semibold mb-0">טענות סף</h2>
|
||
<span className="text-[0.72rem] rounded-full bg-gold-wash text-gold-deep px-2 py-0.5 border border-gold/40 tabular-nums">
|
||
{analysis.data.threshold_claims.length}
|
||
</span>
|
||
</div>
|
||
<div className="space-y-3">
|
||
{analysis.data.threshold_claims.map((tc) => (
|
||
<SubsectionCard
|
||
key={tc.id}
|
||
caseNumber={caseNumber}
|
||
item={tc}
|
||
precedents={precedentsBySection.get(tc.id) ?? []}
|
||
practiceArea={practiceArea}
|
||
/>
|
||
))}
|
||
</div>
|
||
</div>
|
||
)}
|
||
|
||
{analysis.data.issues && analysis.data.issues.length > 0 && (
|
||
<div className="space-y-3">
|
||
<div className="flex items-center gap-2">
|
||
<h2 className="text-navy text-lg font-semibold mb-0">סוגיות להכרעה</h2>
|
||
<span className="text-[0.72rem] rounded-full bg-gold-wash text-gold-deep px-2 py-0.5 border border-gold/40 tabular-nums">
|
||
{analysis.data.issues.length}
|
||
</span>
|
||
</div>
|
||
<div className="space-y-3">
|
||
{analysis.data.issues.map((iss) => (
|
||
<SubsectionCard
|
||
key={iss.id}
|
||
caseNumber={caseNumber}
|
||
item={iss}
|
||
precedents={precedentsBySection.get(iss.id) ?? []}
|
||
practiceArea={practiceArea}
|
||
/>
|
||
))}
|
||
</div>
|
||
</div>
|
||
)}
|
||
|
||
{!analysis.data.threshold_claims?.length &&
|
||
!analysis.data.issues?.length && (
|
||
<Card className="bg-surface border-rule">
|
||
<CardContent className="px-6 py-10 text-center text-ink-muted">
|
||
לא נמצאו טענות סף או סוגיות בניתוח זה.
|
||
</CardContent>
|
||
</Card>
|
||
)}
|
||
|
||
<Card className="bg-surface border-rule shadow-sm">
|
||
<CardContent className="px-6 py-5 space-y-5">
|
||
<h2 className="text-navy text-lg font-semibold mb-0">רקע לניתוח</h2>
|
||
<ProseSection title="צד מיוצג" content={analysis.data.represented_party} />
|
||
<ProseSection title="רקע דיוני" content={analysis.data.procedural_background} />
|
||
<ProseSection title="עובדות מוסכמות" content={analysis.data.agreed_facts} />
|
||
<ProseSection title="עובדות במחלוקת" content={analysis.data.disputed_facts} />
|
||
</CardContent>
|
||
</Card>
|
||
|
||
{analysis.data.conclusions?.trim() && (
|
||
<Card className="bg-gold-wash border-gold/40 shadow-sm">
|
||
<CardContent className="px-6 py-5 space-y-3">
|
||
<h2 className="text-gold-deep text-lg font-semibold mb-0">מסקנות</h2>
|
||
<Markdown content={analysis.data.conclusions.trim()} />
|
||
</CardContent>
|
||
</Card>
|
||
)}
|
||
</div>
|
||
) : null}
|
||
|
||
{/* case-level פסיקה מצורפת + analysis export/update (INV-IA3: not removed).
|
||
items-stretch keeps both cards the same height (#226). */}
|
||
<div className="grid gap-4 lg:grid-cols-2 items-stretch pt-2">
|
||
<Card className="bg-surface border-rule shadow-sm h-full">
|
||
<CardContent className="px-5 py-4">
|
||
<h3 className="text-navy text-[0.9rem] font-semibold mb-1">פסיקה מצורפת</h3>
|
||
<p className="text-[0.72rem] text-ink-muted mb-3">
|
||
ציטוטים התומכים בעמדה באופן רוחבי — ישולבו בפתיחת בלוק י (דיון).
|
||
</p>
|
||
<PrecedentsSection
|
||
caseNumber={caseNumber}
|
||
sectionId={null}
|
||
precedents={caseLevelPrecedents}
|
||
practiceArea={practiceArea}
|
||
emptyHelperText="עדיין לא צורפה פסיקה כללית לתיק"
|
||
/>
|
||
</CardContent>
|
||
</Card>
|
||
|
||
<FinishRail
|
||
caseNumber={caseNumber}
|
||
hasAnalysis={!!analysis.data}
|
||
onUploaded={() => analysis.refetch()}
|
||
/>
|
||
</div>
|
||
</div>
|
||
);
|
||
}
|