fix(ui):show error on terminal if container has no shell (bash/sh)

app/Livewire/Project/Shared/ExecuteContainerCommand.php

@@ -27,6 +27,8 @@ class ExecuteContainerCommand extends Component
 
     public Collection $servers;
 
+    public bool $hasShell = true;
+
     protected $rules = [
         'server' => 'required',
         'container' => 'required',
@@ -141,6 +143,16 @@ class ExecuteContainerCommand extends Component
         }
     }
 
+    private function checkShellAvailability(Server $server, string $container): bool
+    {
+        $escapedContainer = escapeshellarg($container);
+        $result = instant_remote_process([
+            "docker exec {$escapedContainer} which bash || docker exec {$escapedContainer} which sh",
+        ], $server, false);
+
+        return ! empty($result);
+    }
+
     #[On('connectToServer')]
     public function connectToServer()
     {
@@ -148,6 +160,7 @@ class ExecuteContainerCommand extends Component
             if ($this->server->isForceDisabled()) {
                 throw new \RuntimeException('Server is disabled.');
             }
+            $this->hasShell = true;
             $this->dispatch(
                 'send-terminal-command',
                 false,
@@ -201,6 +214,11 @@ class ExecuteContainerCommand extends Component
                 throw new \RuntimeException('Server ownership verification failed.');
             }
 
+            $this->hasShell = $this->checkShellAvailability($server, data_get($container, 'container.Names'));
+            if (! $this->hasShell) {
+                return;
+            }
+
             $this->dispatch(
                 'send-terminal-command',
                 true,

resources/views/livewire/project/shared/execute-container-command.blade.php

@@ -16,43 +16,58 @@
     @elseif ($type === 'server')
         <x-server.navbar :server="$server" :parameters="$parameters" />
     @endif
-    @if ($type === 'server')
+
-        <form class="w-full" wire:submit="$dispatchSelf('connectToServer')" wire:init="$dispatchSelf('connectToServer')">
+    @if(!$hasShell)
-            <x-forms.button class="w-full" type="submit">Reconnect</x-forms.button>
+        <div class="flex items-center justify-center w-full py-4 mx-auto">
-        </form>
+            <div class="p-4 w-full rounded border dark:bg-coolgray-100 dark:border-coolgray-300">
-        <div class="mx-auto w-full">
+                <div class="flex flex-col items-center justify-center space-y-4">
-            <livewire:project.shared.terminal />
+                    <svg class="w-12 h-12 text-red-500" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"/>
+                    </svg>
+                    <div class="text-center">
+                        <h3 class="text-lg font-medium">Terminal Not Available</h3>
+                        <p class="mt-2 text-sm text-gray-500">No shell (bash/sh) is available in this container. Please ensure either bash or sh is installed to use the terminal.</p>
+                    </div>
+                </div>
+            </div>
         </div>
     @else
-        @if (count($containers) > 0)
+        @if ($type === 'server')
-            @if (count($containers) === 1)
+            <form class="w-full" wire:submit="$dispatchSelf('connectToServer')" wire:init="$dispatchSelf('connectToServer')">
-                <form class="w-full pt-4" wire:submit="$dispatchSelf('connectToContainer')"
+                <x-forms.button class="w-full" type="submit">Reconnect</x-forms.button>
-                    wire:init="$dispatchSelf('connectToContainer')">
+            </form>
-                    <x-forms.button class="w-full" type="submit">Reconnect</x-forms.button>
-                </form>
-            @else
-                <form class="w-full pt-4 flex gap-2 flex-col" wire:submit="$dispatchSelf('connectToContainer')">
-                    <x-forms.select label="Container" id="container" required wire:model="selected_container">
-                        @foreach ($containers as $container)
-                            @if ($loop->first)
-                                <option disabled value="default">Select a container</option>
-                            @endif
-                            <option value="{{ data_get($container, 'container.Names') }}">
-                                {{ data_get($container, 'container.Names') }}
-                                ({{ data_get($container, 'server.name') }})
-                            </option>
-                        @endforeach
-                    </x-forms.select>
-                    <x-forms.button class="w-full" type="submit">
-                        Connect
-                    </x-forms.button>
-                </form>
-            @endif
             <div class="mx-auto w-full">
                 <livewire:project.shared.terminal />
             </div>
         @else
-            <div class="pt-4">No containers are running.</div>
+            @if (count($containers) === 0)
+                <div class="pt-4">No containers are running.</div>
+            @else
+                @if (count($containers) === 1)
+                    <form class="w-full pt-4" wire:submit="$dispatchSelf('connectToContainer')"
+                        wire:init="$dispatchSelf('connectToContainer')">
+                        <x-forms.button class="w-full" type="submit">Reconnect</x-forms.button>
+                    </form>
+                @else
+                    <form class="w-full pt-4 flex gap-2 flex-col" wire:submit="$dispatchSelf('connectToContainer')">
+                        <x-forms.select label="Container" id="container" required wire:model="selected_container">
+                            @foreach ($containers as $container)
+                                @if ($loop->first)
+                                    <option disabled value="default">Select a container</option>
+                                @endif
+                                <option value="{{ data_get($container, 'container.Names') }}">
+                                    {{ data_get($container, 'container.Names') }}
+                                    ({{ data_get($container, 'server.name') }})
+                                </option>
+                            @endforeach
+                        </x-forms.select>
+                        <x-forms.button class="w-full" type="submit">Connect</x-forms.button>
+                    </form>
+                @endif
+                <div class="mx-auto w-full">
+                    <livewire:project.shared.terminal />
+                </div>
+            @endif
         @endif
     @endif
 </div>

resources/views/livewire/project/shared/terminal.blade.php

@@ -1,9 +1,4 @@
 <div id="terminal-container" x-data="terminalData()">
-    {{-- <div x-show="!terminalActive" class="flex items-center justify-center w-full py-4 mx-auto h-[510px]">
-        <div class="p-1 w-full h-full rounded border dark:bg-coolgray-100 dark:border-coolgray-300">
-            <span class="font-mono text-sm text-gray-500" x-text="message"></span>
-        </div>
-    </div> --}}
     <div x-ref="terminalWrapper"
         :class="fullscreen ? 'fullscreen' : 'relative w-full h-full py-4 mx-auto max-h-[510px]'">
         <div id="terminal" wire:ignore></div>