fix(awooop): show inserted work items on work-items page
Some checks failed
CD Pipeline / workflow-shape (push) Successful in 0s
CD Pipeline / cancel-stale-cd (push) Has been skipped
CD Pipeline / tests (push) Successful in 1m24s
CD Pipeline / post-deploy-checks (push) Has been cancelled
CD Pipeline / build-and-deploy (push) Has been cancelled

This commit is contained in:
Your Name
2026-07-02 14:28:25 +08:00
parent d816011bf0
commit 3679c1cf41
3 changed files with 115 additions and 5 deletions

View File

@@ -8519,6 +8519,12 @@ function CommanderInsertedRequirementsPanel({
blocked: t("statuses.blocked"),
deferred: t("statuses.deferred"),
};
const spotlightIds = new Set([
nextId,
"CIR-P1-OPENCLAW-001",
"CIR-P2-UX-002",
]);
const spotlightItems = items.filter((item) => item.id && spotlightIds.has(item.id));
return (
<section
@@ -8581,6 +8587,64 @@ function CommanderInsertedRequirementsPanel({
</div>
</div>
{spotlightItems.length > 0 ? (
<div className="mt-4 border border-[#d8d3c7] bg-[#fbfaf6] p-3">
<div className="flex flex-wrap items-center justify-between gap-2">
<div>
<div className="text-[11px] font-semibold uppercase tracking-[0.08em] text-[#9a968c]">
{t("spotlight")}
</div>
<div className="mt-1 text-xs leading-5 text-[#77736a]">
{t("spotlightSubtitle")}
</div>
</div>
<div className="font-mono text-[11px] font-semibold text-[#5f5b52]">
{t("fullLedger", { count: total })}
</div>
</div>
<div className="mt-3 grid gap-2 xl:grid-cols-3">
{spotlightItems.map((item) => {
const itemPriority = String(item.priority ?? "--");
const itemStatus = String(item.status ?? "pending");
return (
<div key={item.id ?? item.order} className="border border-[#e0ddd4] bg-white p-3">
<div className="flex flex-wrap gap-1.5">
<span
className={cn(
"border px-2 py-0.5 font-mono text-[11px] font-semibold",
commanderPriorityTone(itemPriority)
)}
>
{itemPriority}
</span>
<span
className={cn(
"border px-2 py-0.5 text-[11px] font-semibold",
commanderStatusTone(itemStatus)
)}
>
{statusLabels[itemStatus] ?? itemStatus}
</span>
</div>
<div className="mt-2 break-all font-mono text-xs font-semibold text-[#141413]">
{item.id}
</div>
<div className="mt-2 break-words text-xs font-semibold leading-5 text-[#141413]">
{item.normalized_work_item}
</div>
<div className="mt-2 break-words font-mono text-[10px] leading-4 text-[#5f5b52]">
{item.lane}
</div>
<div className="mt-2 break-words text-[11px] leading-5 text-[#77736a]">
{item.next_action}
</div>
</div>
);
})}
</div>
</div>
) : null}
<div className="mt-4 grid gap-2">
{items.length > 0 ? (
items.map((item) => {
@@ -8701,8 +8765,37 @@ export default function AwoooPWorkItemsPage() {
priorityWorkOrder: null,
});
const [loading, setLoading] = useState(true);
const [priorityWorkOrderReadback, setPriorityWorkOrderReadback] =
useState<PriorityWorkOrderResponse | null>(null);
const [priorityWorkOrderLoading, setPriorityWorkOrderLoading] = useState(true);
const [lastUpdated, setLastUpdated] = useState<Date | null>(null);
const fetchPriorityWorkOrderReadback = useCallback(async () => {
setPriorityWorkOrderLoading(true);
const urls = Array.from(
new Set(
[
`${API_BASE}/api/v1/agents/awoooi-priority-work-order-readback`,
"/api/v1/agents/awoooi-priority-work-order-readback",
].filter(Boolean)
)
);
for (let attempt = 0; attempt < 3; attempt += 1) {
for (const url of urls) {
const nextPriorityWorkOrder =
await fetchJson<PriorityWorkOrderResponse>(url, 12000);
if (nextPriorityWorkOrder?.commander_inserted_requirement_work_items?.length) {
setPriorityWorkOrderReadback(nextPriorityWorkOrder);
setPriorityWorkOrderLoading(false);
return nextPriorityWorkOrder;
}
}
await new Promise((resolve) => window.setTimeout(resolve, 1200));
}
setPriorityWorkOrderLoading(false);
return null;
}, []);
const fetchTelemetry = useCallback(async () => {
setLoading(true);
const encodedProjectId = encodeURIComponent(projectId);
@@ -8754,6 +8847,8 @@ export default function AwoooPWorkItemsPage() {
void priorityWorkOrderPromise.then((nextPriorityWorkOrder) => {
if (!nextPriorityWorkOrder) return;
setPriorityWorkOrderReadback(nextPriorityWorkOrder);
setPriorityWorkOrderLoading(false);
setTelemetry((current) => ({
...current,
priorityWorkOrder: nextPriorityWorkOrder,
@@ -8854,10 +8949,16 @@ export default function AwoooPWorkItemsPage() {
setLoading(false);
}, [effectiveFocusedIncidentId, projectId]);
useEffect(() => {
fetchPriorityWorkOrderReadback();
}, [fetchPriorityWorkOrderReadback]);
useEffect(() => {
fetchTelemetry();
}, [fetchTelemetry]);
const priorityWorkOrder =
telemetry.priorityWorkOrder ?? priorityWorkOrderReadback;
const workItems = useMemo(() => buildWorkItems(telemetry, t), [telemetry, t]);
const latestRemediationHistory = telemetry.remediationHistory?.items?.[0] ?? null;
const remediationIncidentIds = useMemo(
@@ -8925,7 +9026,10 @@ export default function AwoooPWorkItemsPage() {
</span>
<button
type="button"
onClick={fetchTelemetry}
onClick={() => {
fetchPriorityWorkOrderReadback();
fetchTelemetry();
}}
className="inline-flex items-center gap-2 border border-[#d8d3c7] bg-[#faf9f3] px-3 py-2 text-xs font-semibold text-[#141413] hover:border-[#d97757]"
>
<RefreshCw
@@ -8943,13 +9047,13 @@ export default function AwoooPWorkItemsPage() {
<AutonomousRuntimeReceiptPanel mode="compact" />
<AiLoopLogSourceTagsPanel
priority={telemetry.priorityWorkOrder}
loading={loading && !telemetry.priorityWorkOrder}
priority={priorityWorkOrder}
loading={priorityWorkOrderLoading && !priorityWorkOrder}
/>
<CommanderInsertedRequirementsPanel
priority={telemetry.priorityWorkOrder}
loading={loading && !telemetry.priorityWorkOrder}
priority={priorityWorkOrder}
loading={priorityWorkOrderLoading && !priorityWorkOrder}
/>
<OperatorSopRail