fix(app): move compaction status below summary (#48262)

Co-authored-by: Hona <10430890+Hona@users.noreply.github.com>

packages/app/e2e/regression/session-timeline-notices.spec.ts

@@ -122,7 +122,15 @@ test("renders compaction progress, summary, and outcome in order", async ({ page
   )
   await expect(compaction.getByRole("heading", { name: "Checkpoint" })).toBeVisible()
   await expect(compaction).toContainText("Streamed implementation details.")
-  await expect(compaction.getByRole("status").getByLabel("Compacting", { exact: true })).toBeVisible()
+  const running = compaction.getByRole("status").getByLabel("Compacting", { exact: true })
+  await expect(running).toBeVisible()
+  await expect
+    .poll(async () => {
+      const summary = await compaction.locator('[data-component="text-part"]').boundingBox()
+      const status = await running.boundingBox()
+      return !!summary && !!status && status.y >= summary.y + summary.height
+    })
+    .toBe(true)
   await expect(compaction.getByText("Session compacted", { exact: true })).toHaveCount(0)
 
   await timeline.send(

packages/session-ui/src/message/message-content.tsx

@@ -427,17 +427,6 @@ export function SessionCompactionMessage(props: { message: SessionMessageCompact
       <div class="py-2">
         <TimelineSeparator label={i18n.t("ui.messagePart.compaction.started")} />
       </div>
-      <Show when={props.message.status === "running"}>
-        <div role="status" class="py-2">
-          <BasicTool
-            icon="archive"
-            trigger={{ title: i18n.t("ui.messagePart.compaction.running") }}
-            status="running"
-            locked
-            hideDetails
-          />
-        </div>
-      </Show>
       <Show when={summary().trim()}>
         <div data-component="text-part" data-timeline-part-id={props.message.id}>
           <div data-slot="text-part-body">
@@ -449,6 +438,17 @@ export function SessionCompactionMessage(props: { message: SessionMessageCompact
           </div>
         </div>
       </Show>
+      <Show when={props.message.status === "running"}>
+        <div role="status" class="py-2">
+          <BasicTool
+            icon="archive"
+            trigger={{ title: i18n.t("ui.messagePart.compaction.running") }}
+            status="running"
+            locked
+            hideDetails
+          />
+        </div>
+      </Show>
       <Show when={props.message.status !== "running"}>
         <div class="py-2">
           <TimelineSeparator label={label()} />