diff --git a/packages/cli/src/ui/components/LoadingIndicator.test.tsx b/packages/cli/src/ui/components/LoadingIndicator.test.tsx
index e55cc09070..1d1e89ba7f 100644
--- a/packages/cli/src/ui/components/LoadingIndicator.test.tsx
+++ b/packages/cli/src/ui/components/LoadingIndicator.test.tsx
@@ -233,6 +233,21 @@ describe('', () => {
expect(output).not.toContain('This should not be displayed');
});
+ it('should truncate long primary text instead of wrapping', () => {
+ const { lastFrame } = renderWithContext(
+ ,
+ StreamingState.Responding,
+ 80,
+ );
+
+ expect(lastFrame()).toMatchSnapshot();
+ });
+
describe('responsive layout', () => {
it('should render on a single line on a wide terminal', () => {
const { lastFrame } = renderWithContext(
diff --git a/packages/cli/src/ui/components/LoadingIndicator.tsx b/packages/cli/src/ui/components/LoadingIndicator.tsx
index b6bb3a1a4b..ed089fe0fd 100644
--- a/packages/cli/src/ui/components/LoadingIndicator.tsx
+++ b/packages/cli/src/ui/components/LoadingIndicator.tsx
@@ -61,7 +61,11 @@ export const LoadingIndicator: React.FC = ({
}
/>
- {primaryText && {primaryText}}
+ {primaryText && (
+
+ {primaryText}
+
+ )}
{!isNarrow && cancelAndTimerContent && (
{cancelAndTimerContent}
)}
diff --git a/packages/cli/src/ui/components/__snapshots__/LoadingIndicator.test.tsx.snap b/packages/cli/src/ui/components/__snapshots__/LoadingIndicator.test.tsx.snap
new file mode 100644
index 0000000000..3d472f97e2
--- /dev/null
+++ b/packages/cli/src/ui/components/__snapshots__/LoadingIndicator.test.tsx.snap
@@ -0,0 +1,6 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[` > should truncate long primary text instead of wrapping 1`] = `
+"MockResponding This is an extremely long loading phrase that should be truncated in t (esc to
+Spinner cancel, 5s)"
+`;