fix: improve console workspace usability

web/apps/console/src/workspace/authoring/DraftWorkbench.test.tsx

@@ -188,6 +188,21 @@ describe("DraftWorkbench", () => {
     expect(within(inspector as HTMLElement).getByText("demo.collect")).toBeInTheDocument();
   });
 
+  it("opens the context inspector when a route outcome is selected on mobile", async () => {
+    setViewport(390);
+    const user = userEvent.setup();
+    const { container } = render(<DraftWorkbench draft={workspace} />);
+
+    const routes = screen.getByLabelText("Route outcomes");
+    await user.click(within(routes).getByRole("button", { name: /collect.*ok/i }));
+
+    const inspector = container.querySelector("#draft-workbench-inspector");
+    expect(inspector).toHaveAttribute("open", "");
+    expect(within(inspector as HTMLElement).getByRole("heading", { name: "Route inspector" })).toBeInTheDocument();
+    expect(within(inspector as HTMLElement).getByRole("textbox", { name: "Source step" })).toHaveValue("collect");
+    expect(within(inspector as HTMLElement).getByRole("textbox", { name: "Outcome" })).toHaveValue("ok");
+  });
+
   it("keeps a dirty inspector form mounted and intact across mobile close and reopen", async () => {
     setViewport(390);
     mockedUseAuthoringCapabilityDetail.mockReturnValue({

web/apps/console/src/workspace/authoring/DraftWorkbench.tsx

@@ -164,8 +164,11 @@ export const DraftWorkbench = ({
     (nextSelection: WorkbenchSelection): void => {
       controller.select(nextSelection);
       onSelectionChange?.(nextSelection);
+      if (isMobile && (nextSelection.kind === "edge" || nextSelection.kind === "node")) {
+        setOpenSheet("inspector");
+      }
     },
-    [controller, onSelectionChange],
+    [controller, isMobile, onSelectionChange],
   );
 
   return (