fix: services file/dir read from server

ui: fix storages layout

resources/views/livewire/project/service/index.blade.php

@@ -1,4 +1,4 @@
-<div x-data="{ raw: true, activeTab: window.location.hash ? window.location.hash.substring(1) : 'service-stack' }" wire:poll.10000ms="checkStatus">
+<div x-data="{ raw: true, activeTab: window.location.hash ? window.location.hash.substring(1) : 'service-stack' }" wire:poll.2000ms="checkStatus">
     <livewire:project.service.navbar :service="$service" :parameters="$parameters" :query="$query" />
     <livewire:project.service.compose-modal :raw="$service->docker_compose_raw" :actual="$service->docker_compose" />
     <div class="flex h-full pt-6">
@@ -102,42 +102,18 @@
 
             </div>
             <div x-cloak x-show="activeTab === 'storages'">
+                <div class="flex items-center gap-2">
+                    <h2>Storages</h2>
+                </div>
+                <div class="pb-4">Persistent storage to preserve data between deployments.</div>
+                <span class="text-warning">Please modify storage layout in your <a class="underline"
+                        href="{{ Str::of(url()->current())->beforeLast('/') }}">Docker Compose</a> file.</span>
                 @foreach ($applications as $application)
-                    @if ($loop->first)
-                        <livewire:project.shared.storages.all :resource="$application" />
-                    @else
-                        <livewire:project.shared.storages.all :resource="$application" :isHeaderVisible="false" />
-                    @endif
-                    @if ($application->fileStorages()->get()->count() > 0)
-                        <h5 class="py-4">Mounted Files/Dirs (binds)</h5>
-                        <div class="flex flex-col gap-4">
-                            @foreach ($application->fileStorages()->get()->sort() as $fileStorage)
-                                <livewire:project.service.file-storage :fileStorage="$fileStorage"
-                                    wire:key="{{ $loop->index }}" />
-                            @endforeach
-                        </div>
-                    @endif
+                    <livewire:project.service.storage wire:key="application-{{ $application->id }}"
+                        :resource="$application" />
                 @endforeach
                 @foreach ($databases as $database)
-                    @if ($loop->first)
-                        <h3 class="pt-4">{{ Str::headline($database->name) }}</h3>
-                        @if ($applications->count() > 0)
-                            <livewire:project.shared.storages.all :resource="$database" :isHeaderVisible="false" />
-                        @else
-                            <livewire:project.shared.storages.all :resource="$database" />
-                        @endif
-                        @if ($database->fileStorages()->get()->count() > 0)
-                            <h5 class="py-4">Mounted Files/Dirs (binds)</h5>
-                            <div class="flex flex-col gap-4">
-                                @foreach ($database->fileStorages()->get()->sort() as $fileStorage)
-                                    <livewire:project.service.file-storage :fileStorage="$fileStorage"
-                                        wire:key="{{ $loop->index }}" />
-                                @endforeach
-                            </div>
-                        @endif
-                    @else
-                        <livewire:project.shared.storages.all :resource="$database" :isHeaderVisible="false" />
-                    @endif
+                    <livewire:project.service.storage wire:key="database-{{ $database->id }}" :resource="$database" />
                 @endforeach
 
             </div>

resources/views/livewire/project/service/show.blade.php

@@ -24,15 +24,14 @@
                     <livewire:project.service.application :application="$serviceApplication" />
                 </div>
                 <div x-cloak x-show="activeTab === 'storages'">
-                    <livewire:project.shared.storages.all :resource="$serviceApplication" />
-                    @if ($serviceApplication->fileStorages()->get()->count() > 0)
-                        <h5 class="py-4">Mounted Files/Dirs (binds)</h5>
-                        <div class="flex flex-col gap-4">
-                            @foreach ($serviceApplication->fileStorages()->get()->sort() as $fileStorage)
-                                <livewire:project.service.file-storage :fileStorage="$fileStorage" wire:key="{{ $loop->index }}" />
-                            @endforeach
-                        </div>
-                    @endif
+                    <div class="flex items-center gap-2">
+                        <h2>Storages</h2>
+                    </div>
+                    <div class="pb-4">Persistent storage to preserve data between deployments.</div>
+                    <span class="text-warning">Please modify storage layout in your <a class="underline"
+                            href="{{ Str::of(url()->current())->beforeLast('/') }}">Docker Compose</a> file.</span>
+                    <livewire:project.service.storage wire:key="application-{{ $serviceApplication->id }}"
+                        :resource="$serviceApplication" />
                 </div>
             @endisset
             @isset($serviceDatabase)
@@ -40,15 +39,14 @@
                     <livewire:project.service.database :database="$serviceDatabase" />
                 </div>
                 <div x-cloak x-show="activeTab === 'storages'">
-                    <livewire:project.shared.storages.all :resource="$serviceDatabase" />
-                    @if ($serviceDatabase->fileStorages()->get()->count() > 0)
-                        <h5 class="py-4">Mounted Files/Dirs (binds)</h5>
-                        <div class="flex flex-col gap-4">
-                            @foreach ($serviceDatabase->fileStorages()->get()->sort() as $fileStorage)
-                                <livewire:project.service.file-storage :fileStorage="$fileStorage" wire:key="{{ $loop->index }}" />
-                            @endforeach
-                        </div>
-                    @endif
+                    <div class="flex items-center gap-2">
+                        <h2>Storages</h2>
+                    </div>
+                    <div class="pb-4">Persistent storage to preserve data between deployments.</div>
+                    <span class="text-warning">Please modify storage layout in your <a class="underline"
+                            href="{{ Str::of(url()->current())->beforeLast('/') }}">Docker Compose</a> file.</span>
+                    <livewire:project.service.storage wire:key="application-{{ $serviceDatabase->id }}"
+                        :resource="$serviceDatabase" />
                 </div>
             @endisset
         </div>

resources/views/livewire/project/service/storage.blade.php

@@ -0,0 +1,49 @@
+<div>
+    @if (
+        $resource->getMorphClass() == 'App\Models\Application' ||
+            $resource->getMorphClass() == 'App\Models\StandalonePostgresql')
+        <div class="flex items-center gap-2">
+            <h2>Storages</h2>
+            <x-helper
+                helper="For Preview Deployments, storage has a <span class='text-helper'>-pr-#PRNumber</span> in their
+                    volume
+                    name, example: <span class='text-helper'>-pr-1</span>" />
+            <x-forms.button class="btn" onclick="newStorage.showModal()">+ Add</x-forms.button>
+            <livewire:project.shared.storages.add :uuid="$resource->uuid" />
+        </div>
+        <div class="pb-4">Persistent storage to preserve data between deployments.</div>
+        @if (
+            $resource->persistentStorages()->get()->count() === 0 &&
+                $resource->fileStorages()->get()->count() == 0)
+            <div>No storage found.</div>
+        @else
+            @if ($resource->persistentStorages()->get()->count() > 0)
+                <livewire:project.shared.storages.all :resource="$resource" />
+            @endif
+            @if ($resource->fileStorages()->get()->count() > 0)
+                <div class="flex flex-col gap-4 pt-4">
+                    @foreach ($resource->fileStorages()->get()->sort() as $fileStorage)
+                        <livewire:project.service.file-storage :fileStorage="$fileStorage"
+                            wire:key="resource-{{ $resource->uuid }}" />
+                    @endforeach
+                </div>
+            @endif
+        @endif
+    @else
+        @if (
+            $resource->persistentStorages()->get()->count() > 0 ||
+                $resource->fileStorages()->get()->count() > 0)
+            <h3 class="pt-4">{{ Str::headline($resource->name) }} </h3>
+        @endif
+        @if ($resource->persistentStorages()->get()->count() > 0)
+            <livewire:project.shared.storages.all :resource="$resource" />
+        @endif
+        @if ($resource->fileStorages()->get()->count() > 0)
+            <div class="flex flex-col gap-4 pt-4">
+                @foreach ($resource->fileStorages()->get()->sort() as $fileStorage)
+                    <livewire:project.service.file-storage :fileStorage="$fileStorage" wire:key="resource-{{ $resource->uuid }}" />
+                @endforeach
+            </div>
+        @endif
+    @endif
+</div>

resources/views/livewire/project/shared/storages/all.blade.php

@@ -1,25 +1,4 @@
 <div>
-    @if ($isHeaderVisible)
-        <div>
-            <div class="flex items-center gap-2">
-                <h2>Storages</h2>
-                @if ($resource->type() !== 'service')
-                    <x-helper
-                        helper="For Preview Deployments, storage has a <span class='text-helper'>-pr-#PRNumber</span> in their
-            volume
-            name, example: <span class='text-helper'>-pr-1</span>" />
-                    <x-forms.button class="btn" onclick="newStorage.showModal()">+ Add</x-forms.button>
-                    <livewire:project.shared.storages.add :uuid="$resource->uuid" />
-                @endif
-            </div>
-            <div class="pb-4">Persistent storage to preserve data between deployments.</div>
-            @if ($resource->type() === 'service')
-                <span class="text-warning">Please modify storage layout in your <a class="underline"
-                        href="{{ Str::of(url()->current())->beforeLast('/') }}">Docker Compose</a> file.</span>
-                <h2 class="pt-4">{{ Str::headline($resource->name) }} </h2>
-            @endif
-        </div>
-    @endif
     <div class="flex flex-col gap-4">
         @foreach ($resource->persistentStorages as $storage)
             @if ($resource->type() === 'service')

resources/views/project/application/configuration.blade.php

@@ -14,8 +14,7 @@
                     @click.prevent="activeTab = 'source'; window.location.hash = 'source'" href="#">Source</a>
             @endif
             <a :class="activeTab === 'server' && 'text-white'"
-                @click.prevent="activeTab = 'server'; window.location.hash = 'server'"
-                href="#">Server
+                @click.prevent="activeTab = 'server'; window.location.hash = 'server'" href="#">Server
             </a>
             <a :class="activeTab === 'storages' && 'text-white'"
                 @click.prevent="activeTab = 'storages'; window.location.hash = 'storages'" href="#">Storages
@@ -27,8 +26,8 @@
                 </a>
             @endif
             <a :class="activeTab === 'health' && 'text-white'"
-            @click.prevent="activeTab = 'health'; window.location.hash = 'health'" href="#">Health Checks
-        </a>
+                @click.prevent="activeTab = 'health'; window.location.hash = 'health'" href="#">Health Checks
+            </a>
             <a :class="activeTab === 'rollback' && 'text-white'"
                 @click.prevent="activeTab = 'rollback'; window.location.hash = 'rollback'" href="#">Rollback
             </a>
@@ -56,7 +55,7 @@
                 <livewire:project.shared.destination :destination="$application->destination" />
             </div>
             <div x-cloak x-show="activeTab === 'storages'">
-                <livewire:project.shared.storages.all :resource="$application" />
+                <livewire:project.service.storage :resource="$application" />
             </div>
             <div x-cloak x-show="activeTab === 'previews'">
                 <livewire:project.application.previews :application="$application" />

resources/views/project/database/configuration.blade.php

@@ -47,7 +47,7 @@
                 <livewire:project.shared.destination :destination="$database->destination" />
             </div>
             <div x-cloak x-show="activeTab === 'storages'">
-                <livewire:project.shared.storages.all :resource="$database" />
+                <livewire:project.service.storage :resource="$database" />
             </div>
             <div x-cloak x-show="activeTab === 'resource-limits'">
                 <livewire:project.shared.resource-limits :resource="$database" />