Chaim
ce61b88438
All checks were successful
Build & Deploy / build-and-deploy (push) Successful in 3m26s
Added analyst_verified, research_complete, analysis_enriched, and ready_for_writing statuses across all UI components: status-badge, workflow-timeline, status-donut, status-changer, status-guide, and kpi-cards. Also changed qa_review label from "QA" to "בדיקת איכות". Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
73 lines
2.7 KiB
TypeScript
73 lines
2.7 KiB
TypeScript
"use client";
|
||
|
||
import { useState } from "react";
|
||
import { ChevronDown, ChevronUp } from "lucide-react";
|
||
import type { CaseStatus } from "@/lib/api/cases";
|
||
import { STATUS_LABELS, STATUS_ICONS, STATUS_DESCRIPTIONS, STATUS_TONE } from "@/components/cases/status-badge";
|
||
|
||
/*
|
||
* Collapsible guide showing all 13 statuses grouped by phase,
|
||
* each with its icon, Hebrew label, color badge, and description.
|
||
* Intended to sit below the WorkflowTimeline in the case sidebar.
|
||
*/
|
||
|
||
type PhaseGroup = {
|
||
label: string;
|
||
statuses: CaseStatus[];
|
||
};
|
||
|
||
const PHASE_GROUPS: PhaseGroup[] = [
|
||
{ label: "קליטה ועיבוד", statuses: ["new", "uploading", "processing"] },
|
||
{ label: "הכנת תיק", statuses: ["documents_ready", "analyst_verified", "research_complete", "outcome_set"] },
|
||
{ label: "ניתוח וכיוון", statuses: ["brainstorming", "direction_approved", "analysis_enriched", "ready_for_writing"] },
|
||
{ label: "כתיבת טיוטה", statuses: ["drafting", "qa_review", "drafted"] },
|
||
{ label: "סגירה", statuses: ["exported", "reviewed", "final"] },
|
||
];
|
||
|
||
export function StatusGuide() {
|
||
const [open, setOpen] = useState(false);
|
||
|
||
return (
|
||
<div className="mt-4 border-t border-rule pt-3">
|
||
<button
|
||
type="button"
|
||
onClick={() => setOpen(!open)}
|
||
className="flex items-center gap-1.5 text-[0.72rem] text-ink-muted hover:text-navy transition-colors w-full"
|
||
>
|
||
{open ? <ChevronUp className="w-3 h-3" /> : <ChevronDown className="w-3 h-3" />}
|
||
מפת סטטוסים
|
||
</button>
|
||
|
||
{open && (
|
||
<div className="mt-3 space-y-3">
|
||
{PHASE_GROUPS.map((group) => (
|
||
<div key={group.label}>
|
||
<h4 className="text-[0.7rem] font-semibold text-navy mb-1.5">
|
||
{group.label}
|
||
</h4>
|
||
<ul className="space-y-1.5">
|
||
{group.statuses.map((s) => {
|
||
const Icon = STATUS_ICONS[s];
|
||
return (
|
||
<li key={s} className="flex items-start gap-2">
|
||
<span
|
||
className={`inline-flex items-center gap-1 rounded-full px-2 py-0.5 text-[0.65rem] font-medium shrink-0 ${STATUS_TONE[s]}`}
|
||
>
|
||
<Icon className="w-2.5 h-2.5" />
|
||
{STATUS_LABELS[s]}
|
||
</span>
|
||
<span className="text-[0.65rem] text-ink-muted leading-snug">
|
||
{STATUS_DESCRIPTIONS[s]}
|
||
</span>
|
||
</li>
|
||
);
|
||
})}
|
||
</ul>
|
||
</div>
|
||
))}
|
||
</div>
|
||
)}
|
||
</div>
|
||
);
|
||
}
|