From 1aca7ead8cc0eb588a01e3efe5da4f034bda3ca5 Mon Sep 17 00:00:00 2001
From: Andras Bacsai <5845193+andrasbacsai@users.noreply.github.com>
Date: Fri, 12 Jun 2026 16:06:20 +0200
Subject: [PATCH] fix(logs): constrain activity monitor output width

---
 .../views/livewire/activity-monitor.blade.php   |  4 ++--
 tests/Feature/LogFontStylingTest.php            | 17 ++++++++++++++++-
 2 files changed, 18 insertions(+), 3 deletions(-)

diff --git a/resources/views/livewire/activity-monitor.blade.php b/resources/views/livewire/activity-monitor.blade.php
index 72b68edd0..f3e79db0e 100644
--- a/resources/views/livewire/activity-monitor.blade.php
+++ b/resources/views/livewire/activity-monitor.blade.php
@@ -48,11 +48,11 @@
             characterData: true
         });" x-destroy="observer && observer.disconnect()"
             @class([
-                'flex flex-col w-full px-4 py-2 overflow-y-auto bg-white border border-solid rounded-sm dark:text-white dark:bg-coolgray-100 scrollbar border-neutral-300 dark:border-coolgray-300',
+                'flex flex-col w-full min-w-0 max-w-full px-4 py-2 overflow-y-auto bg-white border border-solid rounded-sm dark:text-white dark:bg-coolgray-100 scrollbar border-neutral-300 dark:border-coolgray-300',
                 'flex-1 min-h-0' => $fullHeight,
                 'max-h-96' => !$fullHeight,
             ])>
-            <pre class="font-logs whitespace-pre-wrap" @if ($isPollingActive) wire:poll.1000ms="polling" @endif>{{ RunRemoteProcess::decodeOutput($activity) }}</pre>
+            <pre class="font-logs min-w-0 max-w-full whitespace-pre-wrap wrap-anywhere" @if ($isPollingActive) wire:poll.1000ms="polling" @endif>{{ RunRemoteProcess::decodeOutput($activity) }}</pre>
         </div>
     @else
         @if ($showWaiting)
diff --git a/tests/Feature/LogFontStylingTest.php b/tests/Feature/LogFontStylingTest.php
index c7903fb45..0696c3e2c 100644
--- a/tests/Feature/LogFontStylingTest.php
+++ b/tests/Feature/LogFontStylingTest.php
@@ -36,10 +36,25 @@
         ->toContain('class="flex flex-col font-logs"')
         ->toContain('class="font-logs text-neutral-400 mb-2"')
         ->and($activityMonitorView)
-        ->toContain('<pre class="font-logs whitespace-pre-wrap"')
+        ->toContain('<pre class="font-logs min-w-0 max-w-full whitespace-pre-wrap wrap-anywhere"')
         ->and($dockerCleanupView)
         ->toContain('class="flex-1 text-sm font-logs text-gray-700 dark:text-gray-300"')
         ->toContain('class="font-logs text-sm text-gray-600 dark:text-gray-300 whitespace-pre-wrap"')
         ->and($terminalClient)
         ->toContain('"Geist Mono"');
 });
+
+it('constrains activity monitor logs inside the available viewport', function () {
+    $activityMonitorView = file_get_contents(resource_path('views/livewire/activity-monitor.blade.php'));
+
+    expect($activityMonitorView)
+        ->toContain('flex flex-col w-full min-w-0 max-w-full')
+        ->toContain('<pre class="font-logs min-w-0 max-w-full whitespace-pre-wrap wrap-anywhere"');
+});
+
+it('bounds database startup activity monitor to the slide over height', function () {
+    $databaseHeadingView = file_get_contents(resource_path('views/livewire/project/database/heading.blade.php'));
+
+    expect($databaseHeadingView)
+        ->toContain('<div wire:ignore class="h-full min-h-0 min-w-0 max-w-full">');
+});