diff --git a/ui/src/components/task-chat/TaskChatInteractionCard.test.tsx b/ui/src/components/task-chat/TaskChatInteractionCard.test.tsx
index c233be31196..60d7ce6516d 100644
--- a/ui/src/components/task-chat/TaskChatInteractionCard.test.tsx
+++ b/ui/src/components/task-chat/TaskChatInteractionCard.test.tsx
@@ -75,6 +75,26 @@ describe("TaskChatInteractionCard", () => {
expect(container.textContent).toContain("Approve the plan");
});
+ it("puts the primary CTA on the right via a reversed action row", () => {
+ flushSync(() => {
+ root.render(
+
+
+
+
+ ,
+ );
+ });
+ const buttons = Array.from(container.querySelectorAll("button"));
+ const confirm = buttons.find((button) => button.textContent === "Confirm");
+ const decline = buttons.find((button) => button.textContent === "Decline");
+ expect(confirm).not.toBeUndefined();
+ expect(decline).not.toBeUndefined();
+ const row = confirm?.parentElement;
+ expect(row).toBe(decline?.parentElement);
+ expect(row?.className).toContain("flex-row-reverse");
+ });
+
it("demotes an expired confirmation to a marker row", () => {
flushSync(() => {
root.render(
diff --git a/ui/src/components/task-chat/TaskChatInteractionCard.tsx b/ui/src/components/task-chat/TaskChatInteractionCard.tsx
index 870cbb98b08..b2533026970 100644
--- a/ui/src/components/task-chat/TaskChatInteractionCard.tsx
+++ b/ui/src/components/task-chat/TaskChatInteractionCard.tsx
@@ -38,7 +38,7 @@ export function TaskChatInteractionCard({ item, ...cardProps }: TaskChatInteract
className="tc-enter-bubble w-full"
data-testid="task-chat-interaction"
>
-
+
);
}