Merge pull request 'feat(ui): עיצוב מחדש טאב הסקירה — 2 כרטיסים + כפתור בפס + תיקון expected_outcome' (#291) from worktree-case-overview-redesign into main
This commit was merged in pull request #291.
This commit is contained in:
@@ -314,7 +314,7 @@ async def case_update(
|
|||||||
hearing_date: str = "",
|
hearing_date: str = "",
|
||||||
decision_date: str = "",
|
decision_date: str = "",
|
||||||
tags: list[str] | None = None,
|
tags: list[str] | None = None,
|
||||||
expected_outcome: str = "",
|
expected_outcome: str | None = None,
|
||||||
appellants: list[str] | None = None,
|
appellants: list[str] | None = None,
|
||||||
respondents: list[str] | None = None,
|
respondents: list[str] | None = None,
|
||||||
property_address: str = "",
|
property_address: str = "",
|
||||||
@@ -381,7 +381,7 @@ async def case_update(
|
|||||||
raise ValueError(f"Invalid decision_date format: {decision_date!r}") from exc
|
raise ValueError(f"Invalid decision_date format: {decision_date!r}") from exc
|
||||||
if tags is not None:
|
if tags is not None:
|
||||||
fields["tags"] = tags
|
fields["tags"] = tags
|
||||||
if expected_outcome:
|
if expected_outcome is not None:
|
||||||
fields["expected_outcome"] = expected_outcome
|
fields["expected_outcome"] = expected_outcome
|
||||||
if appellants is not None:
|
if appellants is not None:
|
||||||
fields["appellants"] = appellants
|
fields["appellants"] = appellants
|
||||||
|
|||||||
@@ -17,6 +17,7 @@ import { DraftsPanel } from "@/components/cases/drafts-panel";
|
|||||||
import { DecisionBlocksPanel } from "@/components/cases/decision-blocks-panel";
|
import { DecisionBlocksPanel } from "@/components/cases/decision-blocks-panel";
|
||||||
import { LegalArgumentsPanel } from "@/components/cases/legal-arguments-panel";
|
import { LegalArgumentsPanel } from "@/components/cases/legal-arguments-panel";
|
||||||
import { AgentActivityFeed } from "@/components/cases/agent-activity-feed";
|
import { AgentActivityFeed } from "@/components/cases/agent-activity-feed";
|
||||||
|
import { AgentActivityPreview } from "@/components/cases/agent-activity-preview";
|
||||||
import { AgentStatusWidget } from "@/components/cases/agent-status-widget";
|
import { AgentStatusWidget } from "@/components/cases/agent-status-widget";
|
||||||
import { UploadSheet } from "@/components/documents/upload-sheet";
|
import { UploadSheet } from "@/components/documents/upload-sheet";
|
||||||
import { expectedOutcomes } from "@/lib/schemas/case";
|
import { expectedOutcomes } from "@/lib/schemas/case";
|
||||||
@@ -90,6 +91,26 @@ export default function CaseDetailPage({
|
|||||||
<>
|
<>
|
||||||
{data && <CaseEditDialog data={data} />}
|
{data && <CaseEditDialog data={data} />}
|
||||||
<UploadSheet caseNumber={caseNumber} />
|
<UploadSheet caseNumber={caseNumber} />
|
||||||
|
{canStartWorkflow && (
|
||||||
|
<Button
|
||||||
|
className="bg-gold-deep hover:bg-gold-deep/90 text-parchment"
|
||||||
|
disabled={startWorkflow.isPending}
|
||||||
|
onClick={() =>
|
||||||
|
startWorkflow.mutate(undefined, {
|
||||||
|
onSuccess: (res) =>
|
||||||
|
toast.success(`תהליך הופעל — ${res.issue_identifier}`),
|
||||||
|
onError: (err) => toast.error(`שגיאה: ${err.message}`),
|
||||||
|
})
|
||||||
|
}
|
||||||
|
>
|
||||||
|
{startWorkflow.isPending ? (
|
||||||
|
<Loader2 className="w-4 h-4 animate-spin me-1.5" />
|
||||||
|
) : (
|
||||||
|
<Play className="w-4 h-4 me-1.5" />
|
||||||
|
)}
|
||||||
|
התחל תהליך
|
||||||
|
</Button>
|
||||||
|
)}
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
|
|
||||||
@@ -111,56 +132,11 @@ export default function CaseDetailPage({
|
|||||||
<div className="grid gap-6 lg:grid-cols-[1fr_340px] items-start mt-6">
|
<div className="grid gap-6 lg:grid-cols-[1fr_340px] items-start mt-6">
|
||||||
<div className="min-w-0">
|
<div className="min-w-0">
|
||||||
<TabsContent value="overview" className="mt-0 space-y-5">
|
<TabsContent value="overview" className="mt-0 space-y-5">
|
||||||
<Card className="bg-surface border-rule shadow-sm overflow-hidden p-0">
|
|
||||||
<div className="px-5 py-3.5 border-b border-rule-soft bg-parchment text-[0.92rem] font-semibold text-navy">
|
|
||||||
סקירת התיק
|
|
||||||
</div>
|
|
||||||
<CardContent className="px-5 py-4 space-y-4">
|
|
||||||
<div>
|
|
||||||
<h3 className="text-navy text-[0.95rem] font-semibold mb-1.5">תוצאה צפויה</h3>
|
|
||||||
<p className="text-ink-soft text-sm leading-relaxed">
|
|
||||||
{expectedOutcomeLabel ?? "לא נקבעה תוצאה צפויה."}
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
<div className="pt-2 border-t border-rule-soft">
|
|
||||||
<dl className="grid grid-cols-2 gap-y-2 gap-x-6 text-sm">
|
|
||||||
<dt className="text-ink-muted">בעיבוד</dt>
|
|
||||||
<dd className="text-ink tabular-nums">
|
|
||||||
{data?.processing_count ?? 0}
|
|
||||||
</dd>
|
|
||||||
</dl>
|
|
||||||
</div>
|
|
||||||
{canStartWorkflow && (
|
|
||||||
<div className="pt-2 border-t border-rule-soft">
|
|
||||||
<Button
|
|
||||||
className="bg-gold-deep hover:bg-gold-deep/90 text-parchment"
|
|
||||||
disabled={startWorkflow.isPending}
|
|
||||||
onClick={() =>
|
|
||||||
startWorkflow.mutate(undefined, {
|
|
||||||
onSuccess: (res) =>
|
|
||||||
toast.success(
|
|
||||||
`תהליך הופעל — ${res.issue_identifier}`,
|
|
||||||
),
|
|
||||||
onError: (err) =>
|
|
||||||
toast.error(`שגיאה: ${err.message}`),
|
|
||||||
})
|
|
||||||
}
|
|
||||||
>
|
|
||||||
{startWorkflow.isPending ? (
|
|
||||||
<Loader2 className="w-4 h-4 animate-spin me-1.5" />
|
|
||||||
) : (
|
|
||||||
<Play className="w-4 h-4 me-1.5" />
|
|
||||||
)}
|
|
||||||
התחל תהליך
|
|
||||||
</Button>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
</CardContent>
|
|
||||||
</Card>
|
|
||||||
|
|
||||||
<DocumentsPanel data={data} />
|
<DocumentsPanel data={data} />
|
||||||
|
|
||||||
{/* gold CTA — open the decision editor (mockup .cta) */}
|
<AgentActivityPreview caseNumber={caseNumber} />
|
||||||
|
|
||||||
|
{/* gold CTA — open the decision editor */}
|
||||||
<Button
|
<Button
|
||||||
asChild
|
asChild
|
||||||
className="w-full bg-gold text-white hover:bg-gold-deep border-transparent py-6 text-base font-semibold"
|
className="w-full bg-gold text-white hover:bg-gold-deep border-transparent py-6 text-base font-semibold"
|
||||||
@@ -213,6 +189,16 @@ export default function CaseDetailPage({
|
|||||||
<CardContent className="px-5 py-4 space-y-4">
|
<CardContent className="px-5 py-4 space-y-4">
|
||||||
<AgentStatusWidget caseNumber={caseNumber} />
|
<AgentStatusWidget caseNumber={caseNumber} />
|
||||||
<WorkflowTimeline status={data?.status} />
|
<WorkflowTimeline status={data?.status} />
|
||||||
|
{expectedOutcomeLabel && (
|
||||||
|
<div className="border-t border-rule-soft pt-3">
|
||||||
|
<dl className="flex justify-between items-center text-sm">
|
||||||
|
<dt className="text-ink-muted">תוצאה צפויה</dt>
|
||||||
|
<dd className="rounded-full bg-warn-bg text-warn text-[0.75rem] font-semibold px-3 py-0.5">
|
||||||
|
{expectedOutcomeLabel}
|
||||||
|
</dd>
|
||||||
|
</dl>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
<StatusChanger caseNumber={caseNumber} currentStatus={data?.status} />
|
<StatusChanger caseNumber={caseNumber} currentStatus={data?.status} />
|
||||||
<StatusGuide />
|
<StatusGuide />
|
||||||
</CardContent>
|
</CardContent>
|
||||||
|
|||||||
110
web-ui/src/components/cases/agent-activity-preview.tsx
Normal file
110
web-ui/src/components/cases/agent-activity-preview.tsx
Normal file
@@ -0,0 +1,110 @@
|
|||||||
|
"use client";
|
||||||
|
|
||||||
|
import Link from "next/link";
|
||||||
|
import { Loader2, CheckCircle2, Clock } from "lucide-react";
|
||||||
|
import { useAgentActivity } from "@/lib/api/agents";
|
||||||
|
import type { PaperclipIssue } from "@/lib/api/agents";
|
||||||
|
|
||||||
|
const STATUS_DOT: Record<string, string> = {
|
||||||
|
in_progress: "bg-gold",
|
||||||
|
todo: "bg-rule",
|
||||||
|
backlog: "bg-rule",
|
||||||
|
done: "bg-success",
|
||||||
|
cancelled: "bg-ink-muted/40",
|
||||||
|
};
|
||||||
|
|
||||||
|
const STATUS_LABEL: Record<string, string> = {
|
||||||
|
in_progress: "בביצוע",
|
||||||
|
todo: "לביצוע",
|
||||||
|
backlog: "ממתין",
|
||||||
|
done: "הושלם",
|
||||||
|
cancelled: "בוטל",
|
||||||
|
};
|
||||||
|
|
||||||
|
function timeAgo(iso: string | null): string {
|
||||||
|
if (!iso) return "—";
|
||||||
|
const diffMs = Date.now() - new Date(iso).getTime();
|
||||||
|
const m = Math.floor(diffMs / 60_000);
|
||||||
|
if (m < 60) return `לפני ${m}ד'`;
|
||||||
|
const h = Math.floor(m / 60);
|
||||||
|
if (h < 24) return `לפני ${h}ש'`;
|
||||||
|
return `לפני ${Math.floor(h / 24)} ימים`;
|
||||||
|
}
|
||||||
|
|
||||||
|
function IssueRow({ issue }: { issue: PaperclipIssue }) {
|
||||||
|
const dot = STATUS_DOT[issue.status] ?? "bg-rule";
|
||||||
|
const lbl = STATUS_LABEL[issue.status] ?? issue.status;
|
||||||
|
const isDone = issue.status === "done";
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className="flex items-start gap-3 py-3 border-b border-rule-soft last:border-0">
|
||||||
|
<span
|
||||||
|
className={`mt-1.5 w-2 h-2 rounded-full flex-none ${dot} ${issue.status === "in_progress" ? "animate-pulse" : ""}`}
|
||||||
|
/>
|
||||||
|
<div className="flex-1 min-w-0">
|
||||||
|
<p className={`text-[0.88rem] font-medium leading-snug ${isDone ? "text-ink-muted line-through" : "text-navy"}`}>
|
||||||
|
{issue.title}
|
||||||
|
</p>
|
||||||
|
<p className="text-[0.75rem] text-ink-muted mt-0.5">
|
||||||
|
{issue.assignee_name ?? lbl}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div className="flex-none flex flex-col items-end gap-1">
|
||||||
|
{isDone ? (
|
||||||
|
<CheckCircle2 className="w-3.5 h-3.5 text-success mt-0.5" />
|
||||||
|
) : issue.status === "in_progress" ? (
|
||||||
|
<Loader2 className="w-3.5 h-3.5 text-gold animate-spin mt-0.5" />
|
||||||
|
) : (
|
||||||
|
<Clock className="w-3.5 h-3.5 text-ink-muted mt-0.5" />
|
||||||
|
)}
|
||||||
|
<span className="text-[0.72rem] text-ink-muted tabular-nums">
|
||||||
|
{timeAgo(issue.completed_at ?? issue.started_at ?? issue.created_at)}
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export function AgentActivityPreview({
|
||||||
|
caseNumber,
|
||||||
|
}: {
|
||||||
|
caseNumber: string;
|
||||||
|
}) {
|
||||||
|
const { data, isLoading } = useAgentActivity(caseNumber);
|
||||||
|
|
||||||
|
const issues = [...(data?.issues ?? [])]
|
||||||
|
.sort((a, b) => {
|
||||||
|
const ta = a.started_at ?? a.created_at ?? "";
|
||||||
|
const tb = b.started_at ?? b.created_at ?? "";
|
||||||
|
return tb.localeCompare(ta);
|
||||||
|
})
|
||||||
|
.slice(0, 4);
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className="rounded-lg border border-rule bg-surface shadow-sm overflow-hidden">
|
||||||
|
<div className="px-5 py-3.5 border-b border-rule-soft bg-parchment flex items-center justify-between">
|
||||||
|
<span className="text-[0.92rem] font-semibold text-navy">פעילות סוכנים</span>
|
||||||
|
<Link
|
||||||
|
href={`/cases/${caseNumber}#agents`}
|
||||||
|
className="text-[0.78rem] font-semibold text-gold-deep hover:underline"
|
||||||
|
>
|
||||||
|
כל הפעילות →
|
||||||
|
</Link>
|
||||||
|
</div>
|
||||||
|
<div className="px-5">
|
||||||
|
{isLoading ? (
|
||||||
|
<div className="flex items-center justify-center py-8 text-ink-muted gap-2">
|
||||||
|
<Loader2 className="w-4 h-4 animate-spin" />
|
||||||
|
<span className="text-sm">טוען...</span>
|
||||||
|
</div>
|
||||||
|
) : issues.length === 0 ? (
|
||||||
|
<p className="py-8 text-center text-sm text-ink-muted">
|
||||||
|
אין פעילות סוכנים עדיין
|
||||||
|
</p>
|
||||||
|
) : (
|
||||||
|
issues.map((issue) => <IssueRow key={issue.id} issue={issue} />)
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
@@ -1926,7 +1926,7 @@ class CaseUpdateRequest(BaseModel):
|
|||||||
hearing_date: str = ""
|
hearing_date: str = ""
|
||||||
decision_date: str = ""
|
decision_date: str = ""
|
||||||
tags: list[str] | None = None
|
tags: list[str] | None = None
|
||||||
expected_outcome: str = ""
|
expected_outcome: str | None = None
|
||||||
appellants: list[str] | None = None
|
appellants: list[str] | None = None
|
||||||
respondents: list[str] | None = None
|
respondents: list[str] | None = None
|
||||||
property_address: str = ""
|
property_address: str = ""
|
||||||
|
|||||||
Reference in New Issue
Block a user