okay, now it is way better

app/Actions/Service/StartService.php

@@ -17,7 +17,7 @@ public function handle(Service $service)
         $commands[] = "echo '####### Pulling images.'";
         $commands[] = "docker compose pull";
         $commands[] = "echo '####### Starting containers.'";
-        $commands[] = "docker compose up -d";
+        $commands[] = "docker compose up -d --remove-orphans";
         $commands[] = "docker network connect $service->uuid coolify-proxy 2>/dev/null || true";
         $activity = remote_process($commands, $service->server);
         return $activity;

app/Http/Livewire/Project/New/DockerCompose.php

@@ -22,18 +22,82 @@ public function mount()
         $this->query = request()->query();
         if (isDev()) {
             $this->dockerComposeRaw = 'services:
-  plausible_events_db:
+            ghost:
-    image: clickhouse/clickhouse-server:23.3.7.5-alpine
+              image: ghost:5
-    restart: always
               volumes:
-        - event-data:/var/lib/clickhouse
+                - ~/configs:/etc/configs/:ro
-        - ./clickhouse/clickhouse-config.xml:/etc/clickhouse-server/config.d/logging.xml:ro
+                - ./var/lib/ghost/content:/tmp/ghost2/content:ro
-        - ./clickhouse/clickhouse-user-config.xml:/etc/clickhouse-server/users.d/logging.xml:ro
+                - /var/lib/ghost/content:/tmp/ghost/content:rw
-    ulimits:
+                - ghost-content-data:/var/lib/ghost/content
-      nofile:
+                - type: volume
-        soft: 262144
+                  source: mydata
-        hard: 262144
+                  target: /data
-';
+                  volume:
+                    nocopy: true
+                - type: bind
+                  source: ./var/lib/ghost/data
+                  target: /data
+                - type: bind
+                  source: /tmp
+                  target: /tmp
+              labels:
+                - "test.label=true"
+              ports:
+                - "3000"
+                - "3000-3005"
+                - "8000:8000"
+                - "9090-9091:8080-8081"
+                - "49100:22"
+                - "127.0.0.1:8001:8001"
+                - "127.0.0.1:5000-5010:5000-5010"
+                - "127.0.0.1::5000"
+                - "6060:6060/udp"
+                - "12400-12500:1240"
+                - target: 80
+                  published: 8080
+                  protocol: tcp
+                  mode: host
+              networks:
+                - some-network
+                - other-network
+              environment:
+                - database__client=${DATABASE_CLIENT:-mysql}
+                - database__connection__database=${MYSQL_DATABASE:-ghost}
+                - database__connection__host=${DATABASE_CONNECTION_HOST:-mysql}
+                - test=${TEST:?true}
+                - url=$SERVICE_FQDN_GHOST
+                - database__connection__user=$SERVICE_USER_MYSQL
+                - database__connection__password=$SERVICE_PASSWORD_MYSQL
+              depends_on:
+                - mysql
+            mysql:
+              image: mysql:8.0
+              volumes:
+                - ghost-mysql-data:/var/lib/mysql
+              environment:
+                - MYSQL_USER=${SERVICE_USER_MYSQL}
+                - MYSQL_PASSWORD=${SERVICE_PASSWORD_MYSQL}
+                - MYSQL_DATABASE=$MYSQL_DATABASE
+                - MYSQL_ROOT_PASSWORD=${SERVICE_PASSWORD_MYSQLROOT}
+                - SESSION_SECRET
+            minio:
+              image: minio/minio
+              environment:
+                RACK_ENV: development
+                A: $A
+                SHOW: ${SHOW}
+                SHOW1: ${SHOW2-show1}
+                SHOW2: ${SHOW3:-show2}
+                SHOW3: ${SHOW4?show3}
+                SHOW4: ${SHOW5:?show4}
+                SHOW5: ${SERVICE_USER_MINIO}
+                SHOW6: ${SERVICE_PASSWORD_MINIO}
+                SHOW7: ${SERVICE_PASSWORD_64_MINIO}
+                SHOW8: ${SERVICE_BASE64_64_MINIO}
+                SHOW9: ${SERVICE_BASE64_128_MINIO}
+                SHOW10: ${SERVICE_BASE64_MINIO}
+                SHOW11:
+          ';
         }
     }
     public function submit()

app/Http/Livewire/Project/Service/Application.php

@@ -3,15 +3,12 @@
 namespace App\Http\Livewire\Project\Service;
 
 use App\Models\ServiceApplication;
-use Illuminate\Support\Collection;
 use Livewire\Component;
 
 class Application extends Component
 {
     public ServiceApplication $application;
     public $parameters;
-    public $fileStorages;
-    protected $listeners = ["refreshFileStorages"];
     protected $rules = [
         'application.human_name' => 'nullable',
         'application.description' => 'nullable',
@@ -28,10 +25,7 @@ public function instantSave()
     {
         $this->submit();
     }
-    public function refreshFileStorages()
+
-    {
-        $this->fileStorages = $this->application->fileStorages()->get();
-    }
     public function delete()
     {
         try {
@@ -45,18 +39,16 @@ public function delete()
     public function mount()
     {
         $this->parameters = get_route_parameters();
-        $this->fileStorages = collect();
-        $this->refreshFileStorages();
     }
     public function submit()
     {
         try {
             $this->validate();
             $this->application->save();
-            switchImage($this->application);
+            updateCompose($this->application);
             $this->emit('success', 'Application saved successfully.');
         } catch (\Throwable $e) {
-            ray($e);
+            return handleError($e, $this);
         } finally {
             $this->emit('generateDockerCompose');
         }

app/Http/Livewire/Project/Service/Database.php

@@ -35,7 +35,7 @@ public function submit()
         try {
             $this->validate();
             $this->database->save();
-            switchImage($this->database);
+            updateCompose($this->database);
             $this->emit('success', 'Database saved successfully.');
         } catch (\Throwable $e) {
             ray($e);

app/Http/Livewire/Project/Service/FileStorage.php

@@ -20,13 +20,17 @@ class FileStorage extends Component
         'fileStorage.mount_path' => 'required',
         'fileStorage.content' => 'nullable',
     ];
-    public function mount() {
+    public function mount()
+    {
         $this->service = $this->fileStorage->service;
         $this->fs_path = Str::of($this->fileStorage->fs_path)->beforeLast('/');
         $file = Str::of($this->fileStorage->fs_path)->afterLast('/');
         if (Str::of($this->fs_path)->startsWith('.')) {
             $this->fs_path = Str::of($this->fs_path)->after('.');
-            $this->fs_path = $this->service->service->workdir() . $this->fs_path . "/" .$file;
+            $this->fs_path = $this->service->service->workdir() . $this->fs_path . "/" . $file;
+        }
+        if ($this->fileStorage->is_directory) {
+            $this->fs_path = Str::of($this->fileStorage->fs_path);
         }
     }
     public function submit()
@@ -40,7 +44,8 @@ public function submit()
             return handleError($e, $this);
         }
     }
-    public function instantSave() {
+    public function instantSave()
+    {
         $this->submit();
     }
     public function render()

app/Http/Livewire/Project/Service/Index.php

@@ -34,19 +34,11 @@ public function refreshStack()
     {
         $this->applications = $this->service->applications->sort();
         $this->applications->each(function ($application) {
-            $application->fileStorages()->get()->each(function ($fileStorage) use ($application) {
+            $application->configuration_required = $application->configurationRequired();
-                if (!$fileStorage->is_directory && $fileStorage->content == null) {
-                    $application->hasMissingFiles = true;
-                }
-            });
         });
         $this->databases = $this->service->databases->sort();
         $this->databases->each(function ($database) {
-            $database->fileStorages()->get()->each(function ($fileStorage) use ($database) {
+            $database->configuration_required = $database->configurationRequired();
-                if (!$fileStorage->is_directory && $fileStorage->content == null) {
-                    $database->hasMissingFiles = true;
-                }
-            });
         });
         $this->emit('success', 'Stack refreshed successfully.');
     }
@@ -61,24 +53,29 @@ public function render()
     {
         return view('livewire.project.service.index');
     }
-    public function save()
+    // public function save()
-    {
+    // {
-        try {
+    //     try {
-            $this->service->save();
+    //         $this->service->save();
-            $this->service->parse();
+    //         $this->service->parse();
-            $this->service->refresh();
+    //         $this->service->refresh();
-            $this->emit('refreshEnvs');
+    //         $this->emit('refreshEnvs');
-            $this->emit('success', 'Service saved successfully.');
+    //         $this->emit('success', 'Service saved successfully.');
-            $this->service->saveComposeConfigs();
+    //         $this->service->saveComposeConfigs();
-        } catch (\Throwable $e) {
+    //     } catch (\Throwable $e) {
-            return handleError($e, $this);
+    //         return handleError($e, $this);
-        }
+    //     }
-    }
+    // }
     public function submit()
     {
         try {
             $this->validate();
             $this->service->save();
+            $this->service->parse();
+            $this->service->refresh();
+            $this->service->saveComposeConfigs();
+            $this->refreshStack();
+            $this->emit('refreshEnvs');
             $this->emit('success', 'Service saved successfully.');
         } catch (\Throwable $e) {
             return handleError($e, $this);

app/Models/ServiceApplication.php

@@ -30,4 +30,14 @@ public function saveFileVolumes()
     {
         saveFileVolumesHelper($this);
     }
+    public function configurationRequired() {
+        $required = false;
+        foreach($this->fileStorages as $fileStorage) {
+            if (!$fileStorage->is_directory && $fileStorage->content == null) {
+                $required = true;
+                break;
+            }
+        }
+        return $required;
+    }
 }

app/Models/ServiceDatabase.php

@@ -30,4 +30,14 @@ public function saveFileVolumes()
     {
         saveFileVolumesHelper($this);
     }
+    public function configurationRequired() {
+        $required = false;
+        foreach($this->fileStorages as $fileStorage) {
+            if (!$fileStorage->is_directory && $fileStorage->content == null) {
+                $required = true;
+                break;
+            }
+        }
+        return $required;
+    }
 }

bootstrap/helpers/services.php

@@ -1,5 +1,6 @@
 <?php
 
+use App\Models\EnvironmentVariable;
 use App\Models\Service;
 use App\Models\ServiceApplication;
 use App\Models\ServiceDatabase;
@@ -96,14 +97,32 @@ function saveFileVolumesHelper(ServiceApplication|ServiceDatabase $oneService)
         return handleError($e);
     }
 }
-function switchImage($resource)
+function updateCompose($resource) {
-{
     try {
         $name = data_get($resource, 'name');
         $dockerComposeRaw = data_get($resource, 'service.docker_compose_raw');
-        $image = data_get($resource, 'image');
         $dockerCompose = Yaml::parse($dockerComposeRaw);
+
+        // Switch Image
+        $image = data_get($resource, 'image');
         data_set($dockerCompose, "services.{$name}.image", $image);
+
+        // Update FQDN
+        $variableName = "SERVICE_FQDN_" . Str::of($resource->name)->upper();
+        $generatedEnv = EnvironmentVariable::where('service_id', $resource->service_id)->where('key', $variableName)->first();
+        if ($generatedEnv){
+            $generatedEnv->value = $resource->fqdn;
+            $generatedEnv->save();
+        }
+
+        // // Update URL
+        // $variableName = "SERVICE_URL_" . Str::of($resource->name)->upper();
+        // $generatedEnv = EnvironmentVariable::where('service_id', $resource->service_id)->where('key', $variableName)->first();
+        // if ($generatedEnv){
+        //     $generatedEnv->value = $resource->url;
+        //     $generatedEnv->save();
+        // }
+
         $dockerComposeRaw = Yaml::dump($dockerCompose, 10, 2);
         $resource->service->docker_compose_raw = $dockerComposeRaw;
         $resource->service->save();

bootstrap/helpers/shared.php

@@ -11,11 +11,13 @@
 use Illuminate\Database\QueryException;
 use Illuminate\Mail\Message;
 use Illuminate\Notifications\Messages\MailMessage;
+use Illuminate\Support\Collection;
 use Illuminate\Support\Facades\Cache;
 use Illuminate\Support\Facades\Http;
 use Illuminate\Support\Facades\Mail;
 use Illuminate\Support\Facades\Route;
 use Illuminate\Support\Str;
+use Illuminate\Support\Stringable;
 use Nubs\RandomNameGenerator\All;
 use Poliander\Cron\CronExpression;
 use Visus\Cuid2\Cuid2;
@@ -385,3 +387,9 @@ function parseEnvFormatToArray($env_file_contents)
     }
     return $env_array;
 }
+
+function data_get_str($data, $key, $default = null): Stringable
+{
+    $str = data_get($data, $key, $default) ?? $default;
+    return Str::of($str);
+}

examples/docker-compose-weird.yaml

@@ -0,0 +1,76 @@
+services:
+  ghost:
+    image: ghost:5
+    volumes:
+      - ~/configs:/etc/configs/:ro
+      - ./var/lib/ghost/content:/tmp/ghost2/content:ro
+      - /var/lib/ghost/content:/tmp/ghost/content:rw
+      - ghost-content-data:/var/lib/ghost/content
+      - type: volume
+        source: mydata
+        target: /data
+        volume:
+          nocopy: true
+      - type: bind
+        source: ./var/lib/ghost/data
+        target: /data
+      - type: bind
+        source: /tmp
+        target: /tmp
+    labels:
+      - "test.label=true"
+    ports:
+      - "3000"
+      - "3000-3005"
+      - "8000:8000"
+      - "9090-9091:8080-8081"
+      - "49100:22"
+      - "127.0.0.1:8001:8001"
+      - "127.0.0.1:5000-5010:5000-5010"
+      - "127.0.0.1::5000"
+      - "6060:6060/udp"
+      - "12400-12500:1240"
+      - target: 80
+        published: 8080
+        protocol: tcp
+        mode: host
+    networks:
+      - some-network
+      - other-network
+    environment:
+      - database__client=${DATABASE_CLIENT:-mysql}
+      - database__connection__database=${MYSQL_DATABASE:-ghost}
+      - database__connection__host=${DATABASE_CONNECTION_HOST:-mysql}
+      - test=${TEST:?true}
+      - url=$SERVICE_FQDN_GHOST
+      - database__connection__user=$SERVICE_USER_MYSQL
+      - database__connection__password=$SERVICE_PASSWORD_MYSQL
+    depends_on:
+      - mysql
+  mysql:
+    image: mysql:8.0
+    volumes:
+      - ghost-mysql-data:/var/lib/mysql
+    environment:
+      - MYSQL_USER=${SERVICE_USER_MYSQL}
+      - MYSQL_PASSWORD=${SERVICE_PASSWORD_MYSQL}
+      - MYSQL_DATABASE=$MYSQL_DATABASE
+      - MYSQL_ROOT_PASSWORD=${SERVICE_PASSWORD_MYSQLROOT}
+      - SESSION_SECRET
+  minio:
+    image: minio/minio
+    environment:
+      RACK_ENV: development
+      A: $A
+      SHOW: ${SHOW}
+      SHOW1: ${SHOW2-show1}
+      SHOW2: ${SHOW3:-show2}
+      SHOW3: ${SHOW4?show3}
+      SHOW4: ${SHOW5:?show4}
+      SHOW5: ${SERVICE_USER_MINIO}
+      SHOW6: ${SERVICE_PASSWORD_MINIO}
+      SHOW7: ${SERVICE_PASSWORD_64_MINIO}
+      SHOW8: ${SERVICE_BASE64_64_MINIO}
+      SHOW9: ${SERVICE_BASE64_128_MINIO}
+      SHOW10: ${SERVICE_BASE64_MINIO}
+      SHOW11:

resources/views/livewire/project/new/docker-compose.blade.php

@@ -44,6 +44,6 @@
       - MYSQL_DATABASE=${MYSQL_DATABASE}
       - MYSQL_ROOT_PASSWORD=${SERVICE_PASSWORD_MYSQL_ROOT}
 '></x-forms.textarea>
-        <x-forms.textarea label="Environment File" rows="20" id="envFile"></x-forms.textarea>
+        {{-- <x-forms.textarea label="Environment File" rows="20" id="envFile"></x-forms.textarea> --}}
     </form>
 </div>

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

@@ -36,12 +36,4 @@
                 id="application.exclude_from_status"></x-forms.checkbox>
         </div>
     </form>
-    @if ($fileStorages->count() > 0)
-        <h3 class="py-4">Mounted Files (binds)</h3>
-        <div class="flex flex-col gap-4">
-            @foreach ($fileStorages as $fileStorage)
-                <livewire:project.service.file-storage :fileStorage="$fileStorage" wire:key="{{ $loop->index }}" />
-            @endforeach
-        </div>
-    @endif
 </div>

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

@@ -25,12 +25,4 @@
                 id="database.exclude_from_status"></x-forms.checkbox>
         </div>
     </form>
-    @if ($fileStorages->count() > 0)
-        <h3 class="py-4">Mounted Files (binds)</h3>
-        <div class="flex flex-col gap-4">
-            @foreach ($fileStorages as $fileStorage)
-                <livewire:project.service.file-storage :fileStorage="$fileStorage" wire:key="{{ $loop->index }}" />
-            @endforeach
-        </div>
-    @endif
 </div>

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

@@ -1,8 +1,8 @@
 <x-collapsible>
     <x-slot:title>
         <div>{{ $fileStorage->mount_path }}
-            @if(is_null($fileStorage->content) && !$fileStorage->is_directory)
+            @if (is_null($fileStorage->content) && !$fileStorage->is_directory)
-                <span class="text-xs text-warning">(empty)</span>
+                <span class="text-xs text-error">(required)</span>
             @endif
         </div>
     </x-slot:title>
@@ -11,11 +11,13 @@
             <div class="w-64">
                 <x-forms.checkbox instantSave label="Is directory?" id="fileStorage.is_directory"></x-forms.checkbox>
             </div>
-            <x-forms.input readonly label="Save your required files here:" id="fs_path"></x-forms.input>
+
-            @if (!$fileStorage->is_directory)
+            @if ($fileStorage->is_directory)
+                <x-forms.input readonly label="Directory on Filesystem (save files here)" id="fs_path"></x-forms.input>
+            @else
                 <div class="flex gap-2">
                     <x-forms.input readonly label="File in Docker Compose file" id="fileStorage.fs_path"></x-forms.input>
-                    <x-forms.input readonly label="File on Filesystem" id="fs_path"></x-forms.input>
+                    <x-forms.input readonly label="File on Filesystem (save files here)" id="fs_path"></x-forms.input>
                 </div>
                 <x-forms.input readonly label="Mount (in container)" id="fileStorage.mount_path"></x-forms.input>
                 <x-forms.textarea label="Content" rows="20" id="fileStorage.content"></x-forms.textarea>

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

@@ -6,8 +6,6 @@
             <a :class="activeTab === 'service-stack' && 'text-white'"
                 @click.prevent="activeTab = 'service-stack'; window.location.hash = 'service-stack'"
                 href="#">Service Stack</a>
-            <a :class="activeTab === 'compose' && 'text-white'"
-                @click.prevent="activeTab = 'compose'; window.location.hash = 'compose'" href="#">Compose File</a>
             <a :class="activeTab === 'environment-variables' && 'text-white'"
                 @click.prevent="activeTab = 'environment-variables'; window.location.hash = 'environment-variables'"
                 href="#">Environment
@@ -18,10 +16,22 @@
         </div>
         <div class="w-full pl-8">
             <div x-cloak x-show="activeTab === 'service-stack'">
-                <form wire:submit.prevent='submit' class="pb-4">
+                <form wire:submit.prevent='submit' class="flex flex-col gap-4 pb-2">
                     <div class="flex gap-2">
-                        <h2 class="pb-4">Configuration </h2>
+                        <div>
+                            <h2> Service Stack </h2>
+                            <div>Configuration</div>
+                        </div>
                         <x-forms.button type="submit">Save</x-forms.button>
+                        <x-forms.button wire:click='manualRefreshStack'>Refresh Status</x-forms.button>
+                        <div x-cloak x-show="raw">
+                            <x-forms.button class="w-64" @click.prevent="raw = !raw">Show Deployable
+                                Compose</x-forms.button>
+                        </div>
+                        <div x-cloak x-show="raw === false">
+                            <x-forms.button class="w-64" @click.prevent="raw = !raw">Show Source
+                                Compose</x-forms.button>
+                        </div>
 
                     </div>
                     <div class="flex gap-2">
@@ -29,12 +39,26 @@
                             placeholder="My super wordpress site" />
                         <x-forms.input id="service.description" label="Description" />
                     </div>
-                </form>
+                    <div x-cloak x-show="raw">
-                <div class="flex gap-2">
+                        <x-forms.textarea label="Docker Compose file"
-                    <h2 class="pb-4"> Service Stack </h2>
+                            helper="
-                    <x-forms.button wire:click='manualRefreshStack'>Refresh</x-forms.button>
+                        You can use these variables in your Docker Compose file and Coolify will generate default values or replace them with the values you set on the UI forms.<br>
+                        <br>
+                        - SERVICE_FQDN_*: FQDN - could be changable from the UI. (example: SERVICE_FQDN_GHOST)<br>
+                        - SERVICE_URL_*: URL parsed from FQDN - could be changable from the UI. (example: SERVICE_URL_GHOST)<br>
+                        - SERVICE_BASE64_64_*: Generated 'base64' string with length of '64' (example: SERVICE_BASE64_64_GHOST, to generate 32 bit: SERVICE_BASE64_32_GHOST)<br>
+                        - SERVICE_USER_*: Generated user (example: SERVICE_USER_MYSQL)<br>
+                        - SERVICE_PASSWORD_*: Generated password (example: SERVICE_PASSWORD_MYSQL)<br>"
+                            rows="6" id="service.docker_compose_raw">
+                        </x-forms.textarea>
                     </div>
-                <div class="grid grid-cols-1 gap-2 xl:grid-cols-3 ">
+                    <div x-cloak x-show="raw === false">
+                        <x-forms.textarea label="Actual Docker Compose file that will be deployed" readonly
+                            rows="6" id="service.docker_compose">
+                        </x-forms.textarea>
+                    </div>
+                </form>
+                <div class="grid grid-cols-1 gap-2 pt-4 xl:grid-cols-3">
                     @foreach ($applications as $application)
                         <a @class([
                             'border-l border-dashed border-red-500' => Str::of(
@@ -51,8 +75,8 @@
                             @else
                                 {{ Str::headline($application->name) }}
                             @endif
-                            @if ($application->hasMissingFiles)
+                            @if ($application->configuration_required)
-                                <span class="text-xs text-error">(has missing files)</span>
+                                <span class="text-xs text-error">(configuration required)</span>
                             @endif
                             @if ($application->description)
                                 <span class="text-xs">{{ $application->description }}</span>
@@ -79,8 +103,8 @@
                             @else
                                 {{ Str::headline($database->name) }}
                             @endif
-                            @if ($database->hasMissingFiles)
+                            @if ($database->configuration_required)
-                                <span class="text-xs text-error">(has missing files)</span>
+                                <span class="text-xs text-error">(configuration required)</span>
                             @endif
                             @if ($database->description)
                                 <span class="text-xs">{{ $database->description }}</span>
@@ -89,42 +113,8 @@
                         </a>
                     @endforeach
                 </div>
-            </div>
-            <div x-cloak x-show="activeTab === 'compose'">
-                <div x-cloak x-show="activeTab === 'compose'">
-                    <div class="flex gap-2 pb-4">
-                        <h2>Docker Compose</h2>
-                        <div x-cloak x-show="raw">
-                            <x-forms.button class="w-64" @click.prevent="raw = !raw">Show Deployable</x-forms.button>
-                            <x-forms.button wire:click='save'>Save</x-forms.button>
-                        </div>
-                        <div x-cloak x-show="raw === false">
-                            <x-forms.button class="w-64" @click.prevent="raw = !raw">Show Source</x-forms.button>
-                            <x-forms.button disabled wire:click='save'>Save</x-forms.button>
 
             </div>
-                    </div>
-
-                    <div x-cloak x-show="raw">
-                        <x-forms.textarea label="Docker Compose file"
-                            helper="
-                        You can use these variables in your Docker Compose file and Coolify will generate default values or replace them with the values you set on the UI forms.<br>
-                        <br>
-                        - SERVICE_FQDN_*: FQDN - could be changable from the UI. (example: SERVICE_FQDN_GHOST)<br>
-                        - SERVICE_URL_*: URL parsed from FQDN - could be changable from the UI. (example: SERVICE_URL_GHOST)<br>
-                        - SERVICE_BASE64_64_*: Generated 'base64' string with length of '64' (example: SERVICE_BASE64_64_GHOST, to generate 32 bit: SERVICE_BASE64_32_GHOST)<br>
-                        - SERVICE_USER_*: Generated user (example: SERVICE_USER_MYSQL)<br>
-                        - SERVICE_PASSWORD_*: Generated password (example: SERVICE_PASSWORD_MYSQL)<br>"
-                            rows="20" id="service.docker_compose_raw">
-                        </x-forms.textarea>
-                    </div>
-                    <div x-cloak x-show="raw === false">
-                        <x-forms.textarea label="Actual Docker Compose file that will be deployed" readonly
-                            rows="20" id="service.docker_compose">
-                        </x-forms.textarea>
-                    </div>
-                </div>
-            </div>
             <div x-cloak x-show="activeTab === 'environment-variables'">
                 <div x-cloak x-show="activeTab === 'environment-variables'">
                     <livewire:project.shared.environment-variable.all :resource="$service" />

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

@@ -10,6 +10,9 @@
                 @click.prevent="activeTab = 'general'; window.location.hash = 'general'" href="#">General</a>
             <a :class="activeTab === 'storages' && 'text-white'"
                 @click.prevent="activeTab = 'storages'; window.location.hash = 'storages'" href="#">Storages
+                @if ($serviceApplication?->configurationRequired() || $serviceDatabase?->configurationRequired())
+                    <span class="text-red-500">(?)</span>
+                @endif
             </a>
         </div>
         <div class="w-full pl-8">
@@ -19,14 +22,31 @@
                 </div>
                 <div x-cloak x-show="activeTab === 'storages'">
                     <livewire:project.shared.storages.all :resource="$serviceApplication" />
+                    @if ($serviceApplication->fileStorages()->get()->count() > 0)
+                        <h3 class="py-4">Mounted Files (binds)</h3>
+                        <div class="flex flex-col gap-4">
+                            @foreach ($serviceApplication->fileStorages()->get() as $fileStorage)
+                                <livewire:project.service.file-storage :fileStorage="$fileStorage" wire:key="{{ $loop->index }}" />
+                            @endforeach
+                        </div>
+                    @endif
                 </div>
             @endisset
             @isset($serviceDatabase)
                 <div x-cloak x-show="activeTab === 'general'" class="h-full">
                     <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)
+                        <h3 class="py-4">Mounted Files (binds)</h3>
+                        <div class="flex flex-col gap-4">
+                            @foreach ($serviceDatabase->fileStorages()->get() as $fileStorage)
+                                <livewire:project.service.file-storage :fileStorage="$fileStorage" wire:key="{{ $loop->index }}" />
+                            @endforeach
+                        </div>
+                    @endif
                 </div>
             @endisset
         </div>

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

@@ -6,10 +6,10 @@
                 reversible. <br>Please think again.</p>
         </x-slot:modalBody>
     </x-modal>
-    @if ($isReadOnly)
+    @once ($isReadOnly)
         <span class="text-warning">Please modify storage layout in your <a
                 class="underline" href="{{ Str::of(url()->current())->beforeLast('/') }}#compose">Docker Compose</a> file.</span>
-    @endif
+    @endonce
     <form wire:submit.prevent='submit' class="flex flex-col gap-2 pt-4 xl:items-end xl:flex-row">
         @if ($isReadOnly)
             <x-forms.input id="realName" label="Volume Name" required readonly />

tests/Feature/ParseServiceTest.php

@@ -0,0 +1,7 @@
+<?php
+
+
+test('parse', function () {
+
+    expect($result)->toBe(3);
+ });