diff --git a/app/Livewire/Project/Shared/ExecuteContainerCommand.php b/app/Livewire/Project/Shared/ExecuteContainerCommand.php index 9003e093a..2d55807c7 100644 --- a/app/Livewire/Project/Shared/ExecuteContainerCommand.php +++ b/app/Livewire/Project/Shared/ExecuteContainerCommand.php @@ -158,6 +158,9 @@ class ExecuteContainerCommand extends Component data_get($server, 'name'), data_get($server, 'uuid') ); + + // Dispatch a frontend event to ensure terminal gets focus after connection + $this->dispatch('terminal-should-focus'); } catch (\Throwable $e) { return handleError($e, $this); } finally { @@ -213,6 +216,9 @@ class ExecuteContainerCommand extends Component data_get($container, 'container.Names'), data_get($container, 'server.uuid') ); + + // Dispatch a frontend event to ensure terminal gets focus after connection + $this->dispatch('terminal-should-focus'); } catch (\Throwable $e) { return handleError($e, $this); } finally { diff --git a/resources/js/terminal.js b/resources/js/terminal.js index 10535f3ea..b49aad9cf 100644 --- a/resources/js/terminal.js +++ b/resources/js/terminal.js @@ -48,6 +48,18 @@ export function initializeTerminalComponent() { this.sendCommandWhenReady({ command: command }); }); + this.$wire.on('terminal-should-focus', () => { + // Wait for terminal to be ready, then focus + const focusWhenReady = () => { + if (this.terminalActive && this.term) { + this.term.focus(); + } else { + setTimeout(focusWhenReady, 100); + } + }; + focusWhenReady(); + }); + this.keepAliveInterval = setInterval(this.keepAlive.bind(this), 30000); this.$watch('terminalActive', (active) => { @@ -353,6 +365,15 @@ export function initializeTerminalComponent() { this.resizeTerminal(); }, 200); + // Ensure terminal gets focus after connection with multiple attempts + setTimeout(() => { + this.term.focus(); + }, 100); + + setTimeout(() => { + this.term.focus(); + }, 500); + // Notify parent component that terminal is connected this.$wire.dispatch('terminalConnected'); } else if (event.data === 'unprocessable') { diff --git a/resources/views/livewire/project/shared/execute-container-command.blade.php b/resources/views/livewire/project/shared/execute-container-command.blade.php index 71d253103..7fe208a9b 100644 --- a/resources/views/livewire/project/shared/execute-container-command.blade.php +++ b/resources/views/livewire/project/shared/execute-container-command.blade.php @@ -45,7 +45,8 @@ @if ($servers->first()->isTerminalEnabled() && $servers->first()->isFunctional())
+ x-data="{ autoConnected: false }" + x-on:terminal-websocket-ready.window="if (!autoConnected) { autoConnected = true; $wire.dispatchSelf('connectToServer'); }">

Terminal

{{ $isConnecting ? 'Connecting...' : 'Connect' }}