@polymorphism-tech/morph-spec 8.47.0 → 9.1.0

package/src/dashboard/app/pages/FeatureDetail.jsx

@@ -6,45 +6,34 @@ import {
 } from '@phosphor-icons/react';
 import PhaseRail, { segmentStates } from '../components/PhaseRail.jsx';
 import KnowledgeMarkdown from '../components/KnowledgeMarkdown.jsx';
-import EntityLink, { standardKey } from '../components/EntityLink.jsx';
+import EntityLink from '../components/EntityLink.jsx';
 import ActivityFeed from '../components/ActivityFeed.jsx';
 import { useMorphQuery } from '../hooks/useMorphQuery.js';
 import { usePref, useNow } from '../hooks/usePref.js';
 import { Segmented, isWorking } from './Features.jsx';
 import { apiBase, projectHref } from '../lib/project.js';
 import { PHASES, GATE_LABEL, STATUS_LABEL, LOCATION_LABEL, phaseMeta } from '../lib/phases.js';
-import { timeAgo, dateTime, num, duration, bytes, verdictLabel } from '../lib/format.js';
+import { timeAgo, dateTime, num, bytes, verdictLabel } from '../lib/format.js';
 
 const TABS = [
   { id: 'overview', label: 'Visão geral' },
-  { id: 'tasks', label: 'Tasks' },
+  { id: 'slices', label: 'Fatias' },
+  { id: 'checks', label: 'Cenários' },
   { id: 'docs', label: 'Documentos' },
   { id: 'activity', label: 'Atividade' },
 ];
 
-const TASK_STATUS = {
-  done: { label: 'feita', tone: 'text-[var(--color-ok)]', icon: CheckCircle },
-  completed: { label: 'feita', tone: 'text-[var(--color-ok)]', icon: CheckCircle },
-  in_progress: { label: 'em andamento', tone: 'text-[var(--color-phase-implement)]', icon: CircleDashed },
-  blocked: { label: 'bloqueada', tone: 'text-[var(--color-warn)]', icon: PauseCircle },
-  skipped: { label: 'pulada', tone: 'text-[var(--color-faint)]', icon: Circle },
-  pending: { label: 'pendente', tone: 'text-[var(--color-faint)]', icon: Circle },
+const SLICE_STATUS = {
+  feito: { label: 'feita', tone: 'text-[var(--color-ok)]', icon: CheckCircle },
+  parcial: { label: 'parcial', tone: 'text-[var(--color-phase-implement)]', icon: CircleDashed },
+  pendente: { label: 'pendente', tone: 'text-[var(--color-faint)]', icon: Circle },
 };
 
-/** Duration of each task from the telemetry (TaskStart → TaskEnd), newest segment wins. */
-function taskDurations(cost) {
-  const out = {};
-  for (const t of cost?.tasks || []) if (t.task && t.durationSeconds) out[t.task] = t.durationSeconds;
-  return out;
+function isReady(sl, byId) {
+  if (sl.status === 'feito') return false;
+  return (sl.depends || []).every((d) => byId[d]?.status === 'feito');
 }
 
-/** A pending task whose dependencies are all done can start now. */
-function isReady(t, byId) {
-  if (t.status !== 'pending') return false;
-  return (t.dependencies || []).every((d) => ['done', 'completed', 'skipped'].includes(byId[d]?.status));
-}
-
-/** `vscode://file/…` opens the file in the editor from the browser. */
 export function editorLink(absPath) {
   return `vscode://file/${encodeURI(String(absPath).replace(/\\/g, '/'))}`;
 }
@@ -71,22 +60,20 @@ function EditorButton({ path, label = 'Abrir no VS Code' }) {
   );
 }
 
-/** What a person should expect next, in one sentence. */
 export function nextAction(f) {
   if (f.status === 'completed') return `Concluída${f.archivedAt ? ` ${timeAgo(f.archivedAt)}` : ''}.`;
   if (f.status === 'abandoned') return 'Abandonada.';
   const paused = f.gates.find((g) => g.paused);
   if (paused) return `O ${GATE_LABEL[paused.gate] || paused.gate} pausou${paused.reason ? `: ${paused.reason}` : ''}. A decisão é sua, no Claude Code.`;
-  if (f.inEvaluation) return 'O avaliador independente entregou o relatório. O Gate 3 decide pelo veredito e pelos bloqueadores.';
-  if (f.phase === 'implement' && f.tasksList?.length) {
-    const open = f.tasksList.find((t) => t.status === 'in_progress') || f.tasksList.find((t) => t.status === 'pending');
-    if (open) return `${f.tasks.done} de ${f.tasks.total} tasks feitas. Próxima: ${open.id}, ${open.title}.`;
-    return 'Todas as tasks feitas. Falta o verify da feature e a revisão.';
+  if (f.inEvaluation) return 'Os relatórios do Gate 3 chegaram. A decisão sai dos vereditos, dos bloqueadores e dos cenários provados.';
+  if (f.phase === 'implement' && f.slicesList?.length) {
+    const open = f.slicesList.find((sl) => sl.status === 'parcial') || f.slicesList.find((sl) => sl.status === 'pendente');
+    if (open) return `${f.slices.done} de ${f.slices.total} fatias feitas. Próxima: ${open.id}, ${open.title}.`;
+    return 'Todas as fatias feitas. Falta o verify da feature e a revisão.';
   }
   const text = {
-    proposal: 'Proposta em construção. O Gate 1 aprova o escopo.',
+    plan: 'Plano sendo escrito: cenários, decisões e fatias. O gate do plano aprova.',
     uiux: 'Desenho de UI/UX em andamento.',
-    plan: 'Plano sendo escrito: spec, use cases e tasks. O Gate 2 aprova.',
     implement: 'Implementação em andamento.',
     review: 'Em revisão.',
   };
@@ -149,13 +136,41 @@ function NodeChips({ nodes }) {
   );
 }
 
+const REVIEW_ROLE_LABEL = { verifier: 'Verificador', reviewer: 'Revisor', security: 'Segurança' };
+const REVIEW_STATUS_LABEL = { missing: 'sem relatório', partial: 'parcial', unverdicted: 'sem veredito', ok: null };
+
+function ReviewRows({ reviews }) {
+  if (!reviews?.length) return null;
+  return (
+    <ul className="mt-4 space-y-2 text-sm">
+      {reviews.map((r) => {
+        const state = REVIEW_STATUS_LABEL[r.status] ?? r.verdict;
+        const tone = r.verdict === 'SHIP' && r.status === 'ok' ? 'text-[var(--color-ok)]' : r.verdict === 'FIX' ? 'text-[var(--color-bad)]' : 'text-[var(--color-faint)]';
+        return (
+          <li key={r.role} className="grid grid-cols-[6.5rem_minmax(0,1fr)_auto] items-baseline gap-3">
+            <span className="text-[var(--color-dim)]">{REVIEW_ROLE_LABEL[r.role] || r.role}</span>
+            <span className={tone}>
+              {state}{r.blockers ? ` · ${r.blockers} bloq.` : ''}
+              {r.reviewedSha && <span className="ml-2 font-mono text-xs text-[var(--color-faint)]">{r.reviewedSha.slice(0, 7)}</span>}
+            </span>
+            {r.status !== 'missing' && (
+              <Link to={`?tab=docs&doc=${encodeURIComponent(r.path)}`} className="text-xs text-[var(--color-dim)] underline decoration-[var(--color-hair-strong)] underline-offset-2 hover:text-[var(--color-fg)]">abrir</Link>
+            )}
+          </li>
+        );
+      })}
+    </ul>
+  );
+}
+
 function VerdictBlock({ f }) {
   return (
     <div>
       <p className="flex items-baseline gap-2">
         <span className="text-4xl font-semibold tracking-tight">{f.verdict ?? '—'}</span>
-        <span className="text-sm text-[var(--color-dim)]">{f.verdict ? `${f.blockers ?? 0} bloqueador(es)` : 'sem veredito do avaliador'}</span>
+        <span className="text-sm text-[var(--color-dim)]">{f.verdict ? `${f.blockers ?? 0} bloqueador(es)` : 'sem veredito do Gate 3'}</span>
       </p>
+      <ReviewRows reviews={f.reviews} />
       {f.blockerList?.length > 0 && (
         <ul className="mt-4 space-y-1.5 text-xs">
           {f.blockerList.map((b) => (
@@ -178,7 +193,6 @@ function CostBlock({ cost }) {
     ['Tokens da sessão', cost.sessionUsage ? num(tokens(cost.sessionUsage)) : 'desconhecido', cost.sessionUsage ? `${num(cost.sessionUsage.cacheReadTokens)} lidos do cache` : cost.legacyUsageSamples ? 'telemetria v1, sem delta somável' : null],
     ['Tokens dos sub-agents', cost.agentUsage ? num(tokens(cost.agentUsage)) : 'desconhecido', cost.agentUsage ? `${cost.agentUsage.agents} sub-agents` : null],
     ['Despachos', String(cost.dispatches?.count ?? 0), cost.dispatches?.promptChars ? `${num(cost.dispatches.promptChars)} caracteres de prompt` : null],
-    ['Tempo em tasks', duration(cost.taskDurationSeconds), null],
     ['Lido para o contexto', bytes(cost.bytesTotal), null],
   ];
   return (
@@ -211,9 +225,7 @@ function OverviewTab({ f, cost }) {
         <Panel title="Avaliação"><VerdictBlock f={f} /></Panel>
         <Panel title="Último verify">
           {f.verification && (
-            <p className="mb-3 text-xs text-[var(--color-faint)]">
-              escopo {f.verification.scope || '—'}, {timeAgo(f.verification.ts)}
-            </p>
+            <p className="mb-3 text-xs text-[var(--color-faint)]">{timeAgo(f.verification.ts)}</p>
           )}
           <NodeChips nodes={f.verificationNodes} />
         </Panel>
@@ -223,81 +235,89 @@ function OverviewTab({ f, cost }) {
   );
 }
 
-function reportPathFor(f, taskId) {
-  const candidates = [`3-implement/reports/${taskId}.md`, `3-implement/evidencias/${taskId}.md`];
-  return candidates.filter((p) => f.documents.some((d) => d.path === p));
+const CHECK_STATUS_TONE = {
+  PROVADO: 'text-[var(--color-ok)]',
+  FALHA: 'text-[var(--color-bad)]',
+  'NÃO PROVADO': 'text-[var(--color-warn)]',
+};
+
+function ChecksTab({ f }) {
+  const cov = f.checksCoverage;
+  if (!f.checksList?.length) {
+    return <Panel><p className="text-sm text-[var(--color-dim)]">Sem cenários extraídos: o `plan-check` ainda não gravou o `checks.json`.</p></Panel>;
+  }
+  const proven = cov ? cov.total - cov.missing.length - cov.notProven.length : null;
+  return (
+    <Panel title={cov ? `${proven} de ${cov.total} provados pelo verificador` : 'Aguardando o relatório do verificador'}>
+      <ul className="divide-y divide-[var(--color-hair)]">
+        {f.checksList.map((c) => (
+          <li key={c.id} className="grid grid-cols-[3rem_minmax(0,1fr)_7rem] gap-3 py-3 text-sm">
+            <span className="font-mono text-[var(--color-dim)]">{c.id}</span>
+            <div className="min-w-0">
+              <p className="text-[var(--color-fg)]">{c.text}</p>
+              {c.evidence && <p className="mt-1 truncate text-xs text-[var(--color-faint)]" title={c.evidence}>{c.evidence}</p>}
+            </div>
+            <div className="text-right">
+              <p className={CHECK_STATUS_TONE[c.status] || 'text-[var(--color-faint)]'}>{c.status ?? (cov ? 'sem linha' : '—')}</p>
+              {c.proof && <p className="text-xs text-[var(--color-faint)]">prova: {c.proof}</p>}
+            </div>
+          </li>
+        ))}
+      </ul>
+    </Panel>
+  );
+}
+
+function reportPathFor(f, sliceId) {
+  const path = `3-implement/reports/${sliceId}.md`;
+  return f.documents.some((d) => d.path === path) ? path : null;
 }
 
-function TaskRow({ t, f, open, onToggle, duration: secs, ready }) {
-  const st = TASK_STATUS[t.status] || TASK_STATUS.pending;
+function SliceRow({ sl, f, open, onToggle, ready }) {
+  const st = SLICE_STATUS[sl.status] || SLICE_STATUS.pendente;
   const StIcon = st.icon;
-  const reports = reportPathFor(f, t.id);
-  const verify = t.verification;
+  const report = reportPathFor(f, sl.id);
   return (
     <li>
       <button
         type="button"
         onClick={onToggle}
         aria-expanded={open}
-        className="fluid grid w-full grid-cols-[1.25rem_2.75rem_minmax(0,1fr)] items-center gap-3 px-5 py-3 text-left transition-colors hover:bg-white/[0.025] md:grid-cols-[1.25rem_2.75rem_minmax(0,1fr)_9rem_4.5rem_3rem_1rem]"
+        className="fluid grid w-full grid-cols-[1.25rem_2.75rem_minmax(0,1fr)] items-center gap-3 px-5 py-3 text-left transition-colors hover:bg-white/[0.025] md:grid-cols-[1.25rem_2.75rem_minmax(0,1fr)_9rem_1rem]"
       >
         <StIcon weight="light" size={17} className={st.tone} aria-label={st.label} />
-        <span className="font-mono text-xs text-[var(--color-dim)]">{t.id}</span>
+        <span className="font-mono text-xs text-[var(--color-dim)]">{sl.id}</span>
         <span className="flex min-w-0 items-center gap-2">
-          <span className="truncate text-sm text-[var(--color-fg)]">{t.title}</span>
+          <span className="truncate text-sm text-[var(--color-fg)]">{sl.title}</span>
           {ready && <span className="shrink-0 text-xs text-[var(--color-phase-implement)]">pronta</span>}
-          {secs ? <span className="shrink-0 text-xs text-[var(--color-faint)]">{duration(secs)}</span> : null}
-        </span>
-        <span className="hidden truncate text-xs text-[var(--color-dim)] md:block">{t.agent ? `morph-${t.agent}` : '—'}</span>
-        <span className="hidden text-xs md:block">
-          {verify ? <span className={verify.status === 'pass' ? 'text-[var(--color-ok)]' : 'text-[var(--color-bad)]'}>verify {verify.status}</span> : <span className="text-[var(--color-faint)]">—</span>}
         </span>
-        <span className="hidden text-right font-mono text-xs tabular-nums text-[var(--color-dim)] md:block">{verify?.status ?? '—'}</span>
+        <span className="hidden truncate text-xs text-[var(--color-dim)] md:block">{sl.persona ? `morph-${sl.persona}` : '—'}</span>
         <span className="hidden text-[var(--color-faint)] md:block">{open ? <CaretDown weight="light" size={14} /> : <CaretRight weight="light" size={14} />}</span>
       </button>
       {open && (
         <div className="grid gap-5 px-5 pb-5 pl-[4.75rem] md:grid-cols-2">
-          <div className="space-y-4 text-sm">
-            {t.description && <p className="leading-relaxed text-[var(--color-dim)]">{t.description}</p>}
-            {Array.isArray(t.doneCriteria) && t.doneCriteria.length > 0 && (
-              <div>
-                <p className="mb-1.5 text-xs text-[var(--color-faint)]">Critérios de pronto</p>
-                <ul className="list-disc space-y-1 pl-4 text-[var(--color-dim)] marker:text-[var(--color-faint)]">
-                  {t.doneCriteria.map((c, i) => <li key={i}>{c}</li>)}
-                </ul>
-              </div>
-            )}
-            {t.notes && <p className="text-[var(--color-dim)]"><span className="text-[var(--color-faint)]">Notas: </span>{t.notes}</p>}
-          </div>
           <dl className="space-y-3 text-sm">
-            {t.agent && (
+            {sl.persona && (
               <div><dt className="text-xs text-[var(--color-faint)]">Persona</dt>
-                <dd><EntityLink kind="persona" id={t.agent}>morph-{t.agent}</EntityLink></dd></div>
+                <dd><EntityLink kind="persona" id={sl.persona}>morph-{sl.persona}</EntityLink></dd></div>
             )}
-            {t.standards?.length > 0 && (
-              <div><dt className="text-xs text-[var(--color-faint)]">Standards</dt>
-                <dd className="mt-1 flex flex-wrap gap-1.5">
-                  {t.standards.map((s) => (
-                    <EntityLink key={s} kind="standard" id={standardKey(s)} chip title={s}>{standardKey(s).replace(/\.md$/, '')}</EntityLink>
-                  ))}
-                </dd></div>
+            {sl.covers?.length > 0 && (
+              <div><dt className="text-xs text-[var(--color-faint)]">Cobre</dt><dd className="font-mono text-xs text-[var(--color-dim)]">{sl.covers.join(', ')}</dd></div>
             )}
-            {t.dependencies?.length > 0 && (
-              <div><dt className="text-xs text-[var(--color-faint)]">Depende de</dt><dd className="font-mono text-xs text-[var(--color-dim)]">{t.dependencies.join(', ')}</dd></div>
+            {sl.depends?.length > 0 && (
+              <div><dt className="text-xs text-[var(--color-faint)]">Depende de</dt><dd className="font-mono text-xs text-[var(--color-dim)]">{sl.depends.join(', ')}</dd></div>
             )}
-            {t.usecase && <div><dt className="text-xs text-[var(--color-faint)]">Use case</dt><dd className="font-mono text-xs text-[var(--color-dim)]">{t.usecase}</dd></div>}
-            {verify?.nodes && <div><dt className="mb-1 text-xs text-[var(--color-faint)]">Verify da task</dt><dd><NodeChips nodes={verify.nodes} /></dd></div>}
-            {t.outputs?.length > 0 && (
+          </dl>
+          <dl className="space-y-3 text-sm">
+            {sl.files?.length > 0 && (
               <div><dt className="text-xs text-[var(--color-faint)]">Arquivos</dt>
-                <dd className="mt-1 space-y-0.5 font-mono text-[11px] text-[var(--color-dim)]">{t.outputs.map((o) => <p key={o} className="truncate" title={o}>{o}</p>)}</dd></div>
+                <dd className="mt-1 space-y-0.5 font-mono text-[11px] text-[var(--color-dim)]">{sl.files.map((o) => <p key={o} className="truncate" title={o}>{o}</p>)}</dd></div>
             )}
-            {reports.length > 0 && (
+            {report && (
               <div className="flex flex-wrap gap-2 pt-1">
-                {reports.map((p) => (
-                  <Link key={p} to={`?tab=docs&doc=${encodeURIComponent(p)}`} className="fluid rounded-full bg-white/[0.06] px-3 py-1.5 text-xs text-[var(--color-fg)] transition-colors hover:bg-white/[0.1]">
-                    Abrir {p.includes('evidencias') ? 'evidências' : 'relatório'}
-                  </Link>
-                ))}
+                <Link to={`?tab=docs&doc=${encodeURIComponent(report)}`} className="fluid rounded-full bg-white/[0.06] px-3 py-1.5 text-xs text-[var(--color-fg)] transition-colors hover:bg-white/[0.1]">
+                  Abrir relatório
+                </Link>
               </div>
             )}
           </dl>
@@ -308,44 +328,37 @@ function TaskRow({ t, f, open, onToggle, duration: secs, ready }) {
 }
 
 const BOARD_COLUMNS = [
-  { id: 'pending', label: 'Pendentes', match: (t) => !t.status || t.status === 'pending' },
-  { id: 'in_progress', label: 'Em andamento', match: (t) => t.status === 'in_progress' },
-  { id: 'blocked', label: 'Bloqueadas', match: (t) => t.status === 'blocked' },
-  { id: 'done', label: 'Feitas', match: (t) => t.status === 'done' || t.status === 'completed' || t.status === 'skipped' },
+  { id: 'pendente', label: 'Pendentes' },
+  { id: 'parcial', label: 'Parciais' },
+  { id: 'feito', label: 'Feitas' },
 ];
 
-function TaskCard({ t, f, secs, ready }) {
-  const reports = reportPathFor(f, t.id);
+function SliceCard({ sl, f, ready }) {
+  const report = reportPathFor(f, sl.id);
   return (
     <li className="rounded-xl bg-[var(--color-raised)] px-3.5 py-3 shadow-[inset_0_0_0_1px_var(--color-hair),inset_0_1px_0_rgb(255_255_255_/_0.05)]">
       <p className="flex items-baseline gap-2">
-        <span className="font-mono text-xs text-[var(--color-dim)]">{t.id}</span>
+        <span className="font-mono text-xs text-[var(--color-dim)]">{sl.id}</span>
         {ready && <span className="text-xs text-[var(--color-phase-implement)]">pronta</span>}
       </p>
-      <p className="mt-1 text-sm leading-snug text-[var(--color-fg)]">{t.title}</p>
-      {t.agent && (
-        <EntityLink kind="persona" id={t.agent} className="mt-2 inline-block text-xs">morph-{t.agent}</EntityLink>
+      <p className="mt-1 text-sm leading-snug text-[var(--color-fg)]">{sl.title}</p>
+      {sl.persona && (
+        <EntityLink kind="persona" id={sl.persona} className="mt-2 inline-block text-xs">morph-{sl.persona}</EntityLink>
       )}
-      {t.dependencies?.length > 0 && <p className="mt-1 text-xs text-[var(--color-faint)]">depende de {t.dependencies.join(', ')}</p>}
-      <div className="mt-2.5 flex items-center justify-between text-xs">
-        <span className="flex items-center gap-2">
-          {t.verification && <span className={t.verification.status === 'pass' ? 'text-[var(--color-ok)]' : 'text-[var(--color-bad)]'}>verify {t.verification.status}</span>}
-        </span>
-        <span className="text-[var(--color-faint)]">{secs ? duration(secs) : ''}</span>
-      </div>
-      {reports.length > 0 && (
-        <Link to={`?tab=docs&doc=${encodeURIComponent(reports[0])}`} className="mt-2.5 inline-block text-xs text-[var(--color-dim)] underline decoration-[var(--color-hair-strong)] underline-offset-2 hover:text-[var(--color-fg)]">abrir relatório</Link>
+      {sl.depends?.length > 0 && <p className="mt-1 text-xs text-[var(--color-faint)]">depende de {sl.depends.join(', ')}</p>}
+      {report && (
+        <Link to={`?tab=docs&doc=${encodeURIComponent(report)}`} className="mt-2.5 inline-block text-xs text-[var(--color-dim)] underline decoration-[var(--color-hair-strong)] underline-offset-2 hover:text-[var(--color-fg)]">abrir relatório</Link>
       )}
     </li>
   );
 }
 
-function TasksBoard({ f, durations, byId }) {
+function SlicesBoard({ f, byId }) {
   return (
     <div className="-mx-4 overflow-x-auto px-4 pb-2 md:mx-0 md:px-0">
       <div className="grid auto-cols-[16rem] grid-flow-col gap-3 md:auto-cols-[minmax(12rem,1fr)]">
         {BOARD_COLUMNS.map((c) => {
-          const items = f.tasksList.filter(c.match);
+          const items = f.slicesList.filter((sl) => sl.status === c.id);
           return (
             <section key={c.id} className="bezel min-w-0" aria-label={`${c.label}: ${items.length}`}>
               <div className="bezel-core flex h-full min-h-[12rem] flex-col p-2.5">
@@ -354,7 +367,7 @@ function TasksBoard({ f, durations, byId }) {
                 </h3>
                 {items.length === 0
                   ? <p className="px-1.5 text-xs text-[var(--color-faint)]">Nenhuma.</p>
-                  : <ul className="space-y-2">{items.map((t) => <TaskCard key={t.id} t={t} f={f} secs={durations[t.id]} ready={isReady(t, byId)} />)}</ul>}
+                  : <ul className="space-y-2">{items.map((sl) => <SliceCard key={sl.id} sl={sl} f={f} ready={isReady(sl, byId)} />)}</ul>}
               </div>
             </section>
           );
@@ -364,34 +377,27 @@ function TasksBoard({ f, durations, byId }) {
   );
 }
 
-function TasksTab({ f, cost, view = 'list', onView = () => {} }) {
+function SlicesTab({ f, view = 'list', onView = () => {} }) {
   const [open, setOpen] = useState(null);
-  if (!f.tasksList.length) {
-    return <Panel><p className="text-sm text-[var(--color-dim)]">Esta feature ainda não tem <code className="font-mono">2-plan/tasks.json</code>. As tasks nascem na fase de plano.</p></Panel>;
+  if (!f.slicesList.length) {
+    return <Panel><p className="text-sm text-[var(--color-dim)]">O plano desta feature ainda não foi conferido pelo <code className="font-mono">morph-spec plan-check</code>. As fatias nascem na fase de plano.</p></Panel>;
   }
-  const durations = taskDurations(cost);
-  const byId = Object.fromEntries(f.tasksList.map((t) => [t.id, t]));
-  const ready = f.tasksList.filter((t) => isReady(t, byId)).length;
+  const byId = Object.fromEntries(f.slicesList.map((sl) => [sl.id, sl]));
+  const ready = f.slicesList.filter((sl) => isReady(sl, byId)).length;
   return (
     <div className="space-y-4">
       <div className="flex flex-wrap items-center justify-between gap-3">
-        <Segmented label="Visualização das tasks" value={view} onChange={onView} options={[{ id: 'list', label: 'Lista', icon: Rows }, { id: 'board', label: 'Quadro', icon: Kanban }]} />
+        <Segmented label="Visualização das fatias" value={view} onChange={onView} options={[{ id: 'list', label: 'Lista', icon: Rows }, { id: 'board', label: 'Quadro', icon: Kanban }]} />
         <p className="text-sm text-[var(--color-dim)]">
-          {f.tasks.done} de {f.tasks.total} feitas{f.tasks.inProgress ? `, ${f.tasks.inProgress} em andamento` : ''}{ready ? `, ${ready} prontas para começar` : ''}
+          {f.slices.done} de {f.slices.total} feitas{f.slices.partial ? `, ${f.slices.partial} parciais` : ''}{ready ? `, ${ready} prontas para começar` : ''}
         </p>
       </div>
-      {f.tasksErrors?.length > 0 && (
-        <p className="flex items-start gap-2 text-sm text-[var(--color-warn)]">
-          <WarningCircle weight="light" size={17} className="mt-0.5 shrink-0" />
-          O tasks.json não passa no schema ({f.tasksErrors.length} erros). As tasks aparecem como estão no arquivo.
-        </p>
-      )}
-      {view === 'board' ? <TasksBoard f={f} durations={durations} byId={byId} /> : (
+      {view === 'board' ? <SlicesBoard f={f} byId={byId} /> : (
         <div className="bezel">
           <ul className="bezel-core divide-y divide-[var(--color-hair)] overflow-hidden">
-            {f.tasksList.map((t) => (
-              <TaskRow key={t.id} t={t} f={f} duration={durations[t.id]} ready={isReady(t, byId)}
-                open={open === t.id} onToggle={() => setOpen(open === t.id ? null : t.id)} />
+            {f.slicesList.map((sl) => (
+              <SliceRow key={sl.id} sl={sl} f={f} ready={isReady(sl, byId)}
+                open={open === sl.id} onToggle={() => setOpen(open === sl.id ? null : sl.id)} />
             ))}
           </ul>
         </div>
@@ -436,7 +442,7 @@ function DocViewer({ project, feature, path, dir }) {
 
 function DocsTab({ f, doc, onDoc, project }) {
   const groups = groupDocuments(f.documents);
-  const selected = doc || f.documents.find((d) => d.path.endsWith('spec.md'))?.path || f.documents.find((d) => d.path.endsWith('.md'))?.path || null;
+  const selected = doc || f.documents.find((d) => d.path.endsWith('plan.md'))?.path || f.documents.find((d) => d.path.endsWith('.md'))?.path || null;
   return (
     <div className="grid gap-5 lg:grid-cols-[16rem_minmax(0,1fr)]">
       <nav aria-label="Documentos da feature" className="lg:sticky lg:top-4 lg:self-start">
@@ -481,7 +487,7 @@ function DocsTab({ f, doc, onDoc, project }) {
   );
 }
 
-export function FeatureDetailView({ f, tab, onTab, doc, onDoc, cost, latest = null, tasksView = 'list', onTasksView = () => {}, now = Date.now(), project, projectName }) {
+export function FeatureDetailView({ f, tab, onTab, doc, onDoc, cost, latest = null, slicesView = 'list', onSlicesView = () => {}, now = Date.now(), project, projectName }) {
   const verdict = verdictLabel(f);
   const working = latest && isWorking({ ...f, lastActivity: latest }, now);
   return (
@@ -500,7 +506,7 @@ export function FeatureDetailView({ f, tab, onTab, doc, onDoc, cost, latest = nu
               </p>
             </div>
             <div className="flex shrink-0 gap-6 text-right">
-              <div><p className="text-2xl font-semibold tabular-nums">{f.tasks.total ? `${f.tasks.done}/${f.tasks.total}` : '—'}</p><p className="text-xs text-[var(--color-faint)]">tasks</p></div>
+              <div><p className="text-2xl font-semibold tabular-nums">{f.slices.total ? `${f.slices.done}/${f.slices.total}` : '—'}</p><p className="text-xs text-[var(--color-faint)]">fatias</p></div>
               <div><p className="text-2xl font-semibold">{verdict ?? '—'}</p><p className="text-xs text-[var(--color-faint)]">veredito</p></div>
             </div>
           </div>
@@ -546,14 +552,15 @@ export function FeatureDetailView({ f, tab, onTab, doc, onDoc, cost, latest = nu
               tab === t.id ? 'bg-white/[0.1] text-[var(--color-fg)] shadow-[inset_0_1px_0_rgb(255_255_255_/_0.08)]' : 'text-[var(--color-dim)] hover:text-[var(--color-fg)]',
             ].join(' ')}
           >
-            {t.label}{t.id === 'tasks' && f.tasks.total ? ` ${f.tasks.total}` : ''}{t.id === 'docs' ? ` ${f.documents.length}` : ''}
+            {t.label}{t.id === 'slices' && f.slices.total ? ` ${f.slices.total}` : ''}{t.id === 'checks' && f.checksList?.length ? ` ${f.checksList.length}` : ''}{t.id === 'docs' ? ` ${f.documents.length}` : ''}
           </button>
         ))}
       </div>
 
       <div className="rise-3">
         {tab === 'overview' && <OverviewTab f={f} cost={cost} />}
-        {tab === 'tasks' && <TasksTab f={f} cost={cost} view={tasksView} onView={onTasksView} />}
+        {tab === 'slices' && <SlicesTab f={f} view={slicesView} onView={onSlicesView} />}
+        {tab === 'checks' && <ChecksTab f={f} />}
         {tab === 'docs' && <DocsTab f={f} doc={doc} onDoc={onDoc} project={project} />}
         {tab === 'activity' && (
           <div className="bezel"><div className="bezel-core px-5 py-5"><ActivityFeed project={project} feature={f.name} /></div></div>
@@ -569,10 +576,9 @@ export default function FeatureDetail() {
   const tab = TABS.some((t) => t.id === params.get('tab')) ? params.get('tab') : 'overview';
   const doc = params.get('doc');
   const { data, error, loading } = useMorphQuery(`${apiBase(project)}/features/${encodeURIComponent(name)}`, { project });
-  // The cost rides on the activity endpoint (it owns the event stream); one
-  // line of feed is enough to get it, and it refreshes with the log.
+  // The cost rides on the activity endpoint (it owns the event stream).
   const costQuery = useMorphQuery(`${apiBase(project)}/activity?feature=${encodeURIComponent(name)}&limit=1`, { scope: 'activity', project });
-  const [tasksView, setTasksView] = usePref('tasks.view', 'list');
+  const [slicesView, setSlicesView] = usePref('slices.view', 'list');
   const now = useNow();
 
   const onTab = useCallback((id) => setParams((p) => { const n = new URLSearchParams(p); n.set('tab', id); if (id !== 'docs') n.delete('doc'); return n; }), [setParams]);
@@ -592,7 +598,7 @@ export default function FeatureDetail() {
     <FeatureDetailView
       f={data} tab={tab} onTab={onTab} doc={doc} onDoc={onDoc}
       cost={costQuery.data?.cost ?? null} latest={costQuery.data?.items?.[0] ?? null}
-      tasksView={tasksView} onTasksView={setTasksView} now={now} project={project}
+      slicesView={slicesView} onSlicesView={setSlicesView} now={now} project={project}
     />
   );
 }

package/src/dashboard/app/pages/Features.jsx

@@ -14,7 +14,6 @@ import { isFinished } from '../../scanner/feature-status.js';
 
 const COMPLETED_PAGE = 30;
 const BOARD_DONE_LIMIT = 8;
-/** An event this recent means an agent is working on the feature right now. */
 export const WORKING_MS = 3 * 60 * 1000;
 
 const LOCATION_ICON = { worktree: GitBranch, archive: Archive, root: HouseSimple };
@@ -41,15 +40,15 @@ function VerifyMark({ verification }) {
     : <XCircle weight="light" className="text-[var(--color-bad)]" size={16} aria-label="último verify falhou" />;
 }
 
-function TaskMeter({ tasks, wide = false }) {
-  if (!tasks?.total) return <span className="text-xs text-[var(--color-faint)]">sem tasks</span>;
-  const pct = Math.round((tasks.done / tasks.total) * 100);
+function SliceMeter({ slices, wide = false }) {
+  if (!slices?.total) return <span className="text-xs text-[var(--color-faint)]">sem fatias</span>;
+  const pct = Math.round((slices.done / slices.total) * 100);
   return (
-    <div className="flex items-center gap-2" title={`${tasks.done} de ${tasks.total} tasks concluídas`}>
+    <div className="flex items-center gap-2" title={`${slices.done} de ${slices.total} fatias feitas`}>
       <div className={`h-1 overflow-hidden rounded-full bg-white/[0.07] ${wide ? 'flex-1' : 'w-12'}`}>
         <div className="h-full rounded-full bg-[var(--color-fg)]/70" style={{ width: `${pct}%` }} />
       </div>
-      <span className="font-mono text-xs tabular-nums text-[var(--color-dim)]">{tasks.done}/{tasks.total}</span>
+      <span className="font-mono text-xs tabular-nums text-[var(--color-dim)]">{slices.done}/{slices.total}</span>
     </div>
   );
 }
@@ -73,7 +72,6 @@ export function stageText(f) {
   return phaseMeta(f.phase).label;
 }
 
-/** The second line of a feature: what just happened while it is live, else where it stands. */
 function subline(f, now) {
   if (!isFinished(f) && f.lastActivity?.title) {
     return <>{isWorking(f, now) && <WorkingDot />}<span className="truncate">{f.lastActivity.title}, {timeAgo(f.lastActivity.titleTs, now)}</span></>;
@@ -106,9 +104,9 @@ export function FeatureRow({ f, now, project, projectName }) {
         <PhaseRail feature={f} />
         {/* One line on a phone; on desktop the wrapper dissolves into the row's grid. */}
         <div className="flex items-center gap-5 md:contents">
-          <TaskMeter tasks={f.tasks} />
+          <SliceMeter slices={f.slices} />
           <VerifyMark verification={f.verification} />
-          <span className="font-mono text-sm tabular-nums text-[var(--color-dim)]" title={verdict ? 'veredito do avaliador' : 'sem veredito'}>
+          <span className="font-mono text-sm tabular-nums text-[var(--color-dim)]" title={verdict ? 'veredito do Gate 3' : 'sem veredito'}>
             {verdict ?? '—'}
           </span>
           <span className="flex items-center gap-1.5 text-xs text-[var(--color-faint)]" title={LOCATION_LABEL[f.location]}>
@@ -165,7 +163,7 @@ function BoardCard({ f, now, project }) {
         {f.lastActivity?.title && !isFinished(f) && (
           <p className="mt-1.5 line-clamp-2 text-xs text-[var(--color-dim)]">{f.lastActivity.title}</p>
         )}
-        <div className="mt-3"><TaskMeter tasks={f.tasks} wide /></div>
+        <div className="mt-3"><SliceMeter slices={f.slices} wide /></div>
         <div className="mt-2.5 flex items-center justify-between text-xs text-[var(--color-faint)]">
           <span className="flex items-center gap-2">
             <VerifyMark verification={f.verification} />
@@ -243,10 +241,6 @@ const chipClass = (on) => [
   on ? 'bg-white/[0.09] text-[var(--color-fg)] shadow-[inset_0_0_0_1px_var(--color-hair-strong)]' : 'text-[var(--color-faint)] shadow-[inset_0_0_0_1px_var(--color-hair)] hover:text-[var(--color-dim)]',
 ].join(' ');
 
-/**
- * The feature home. All state comes in as props so the view renders the same
- * with the live API and with the smoke test's fixture.
- */
 export function FeaturesView({
   data, query, onQuery, completedShown, onShowMore,
   view = 'list', onView = () => {}, types = [], onTypes = () => {}, sort = 'updated', onSort = () => {},
@@ -329,7 +323,7 @@ export function FeaturesView({
       )}
       {info.initialized && !info.legacyStateOnly && features.length === 0 && (
         <Empty title="Nenhuma feature ainda">
-          No Claude Code, comece uma com <code className="font-mono text-[var(--color-fg)]">/morph-proposal</code>. Ela aparece aqui assim que o <code className="font-mono">feature.json</code> nascer.
+          No Claude Code, comece uma com <code className="font-mono text-[var(--color-fg)]">/morph-plan</code>, que entrevista e escreve o plano. Ela aparece aqui assim que o <code className="font-mono">feature.json</code> nascer.
         </Empty>
       )}
       {features.length > 0 && visible.length === 0 && (
@@ -374,7 +368,6 @@ export default function Features() {
   const now = useNow();
   const searchRef = useRef(null);
 
-  // `/` jumps to the search, like most dev tools.
   useEffect(() => {
     const onKey = (e) => {
       if (e.key !== '/' || e.ctrlKey || e.metaKey || e.altKey) return;

package/src/dashboard/app/pages/Guide.jsx

@@ -18,7 +18,6 @@ function personasIn(phaseId) {
   return (morphData.agents?.list || []).filter((a) => a.activePhases?.includes(phaseId));
 }
 
-/** The whole flow on one screen: phase, the skill that runs it, who works in it, the gate that closes it. */
 export function Flow() {
   return (
     <section aria-label="O fluxo do morph-spec" className="bezel">
@@ -27,9 +26,9 @@ export function Flow() {
         <p className="mt-1 max-w-3xl text-sm leading-relaxed text-[var(--color-dim)]">
           Você descreve o que quer; o Claude conduz cada fase com uma skill, despacha personas especialistas como sub-agents e para nos gates.
           Com trust <span className="font-mono text-[var(--color-fg)]">auto</span>, um gate só pausa para você quando aparece um sinal de risco.
-          No fim, um avaliador independente dá a nota.
+          No fim, verificador e revisor independentes dão o veredito (SHIP ou FIX).
         </p>
-        <ol className="mt-6 grid gap-3 md:grid-cols-5">
+        <ol className="mt-6 grid gap-3 md:grid-cols-4">
           {PHASES.map((p) => {
             const people = personasIn(p.id);
             return (