From 3f88e85aacfbdad7b62c7f588d4f221a173c61ae Mon Sep 17 00:00:00 2001
From: ShadowArcanist <162910371+ShadowArcanist@users.noreply.github.com>
Date: Thu, 23 Apr 2026 14:53:31 +0530
Subject: [PATCH] feat(ui): add resource details view

---
 .../Project/Application/Configuration.php     |  2 +-
 .../Project/Database/Configuration.php        |  2 +-
 .../Project/Service/Configuration.php         |  2 +-
 .../Project/Shared/ResourceDetails.php        | 91 +++++++++++++++++++
 .../components/forms/copy-button.blade.php    | 13 ++-
 .../project/application/general.blade.php     |  3 +
 .../database/clickhouse/general.blade.php     |  3 +
 .../database/dragonfly/general.blade.php      |  3 +
 .../project/database/keydb/general.blade.php  |  3 +
 .../database/mariadb/general.blade.php        |  3 +
 .../database/mongodb/general.blade.php        |  3 +
 .../project/database/mysql/general.blade.php  |  3 +
 .../database/postgresql/general.blade.php     |  3 +
 .../project/database/redis/general.blade.php  |  3 +
 .../project/service/stack-form.blade.php      |  3 +
 .../project/shared/resource-details.blade.php | 57 ++++++++++++
 16 files changed, 191 insertions(+), 6 deletions(-)
 create mode 100644 app/Livewire/Project/Shared/ResourceDetails.php
 create mode 100644 resources/views/livewire/project/shared/resource-details.blade.php

diff --git a/app/Livewire/Project/Application/Configuration.php b/app/Livewire/Project/Application/Configuration.php
index cc1bf15b9..ad025bed5 100644
--- a/app/Livewire/Project/Application/Configuration.php
+++ b/app/Livewire/Project/Application/Configuration.php
@@ -35,7 +35,7 @@ public function mount()
 
         $project = currentTeam()
             ->projects()
-            ->select('id', 'uuid', 'team_id')
+            ->select('id', 'uuid', 'name', 'team_id')
             ->where('uuid', request()->route('project_uuid'))
             ->firstOrFail();
         $environment = $project->environments()
diff --git a/app/Livewire/Project/Database/Configuration.php b/app/Livewire/Project/Database/Configuration.php
index 7c64a6eef..a62fbf2fe 100644
--- a/app/Livewire/Project/Database/Configuration.php
+++ b/app/Livewire/Project/Database/Configuration.php
@@ -34,7 +34,7 @@ public function mount()
 
             $project = currentTeam()
                 ->projects()
-                ->select('id', 'uuid', 'team_id')
+                ->select('id', 'uuid', 'name', 'team_id')
                 ->where('uuid', request()->route('project_uuid'))
                 ->firstOrFail();
             $environment = $project->environments()
diff --git a/app/Livewire/Project/Service/Configuration.php b/app/Livewire/Project/Service/Configuration.php
index 2d69ceb12..bf0a6b6a2 100644
--- a/app/Livewire/Project/Service/Configuration.php
+++ b/app/Livewire/Project/Service/Configuration.php
@@ -51,7 +51,7 @@ public function mount()
             $this->query = request()->query();
             $project = currentTeam()
                 ->projects()
-                ->select('id', 'uuid', 'team_id')
+                ->select('id', 'uuid', 'name', 'team_id')
                 ->where('uuid', request()->route('project_uuid'))
                 ->firstOrFail();
             $environment = $project->environments()
diff --git a/app/Livewire/Project/Shared/ResourceDetails.php b/app/Livewire/Project/Shared/ResourceDetails.php
new file mode 100644
index 000000000..8a4117c39
--- /dev/null
+++ b/app/Livewire/Project/Shared/ResourceDetails.php
@@ -0,0 +1,91 @@
+<?php
+
+namespace App\Livewire\Project\Shared;
+
+use App\Models\Service;
+use Illuminate\Foundation\Auth\Access\AuthorizesRequests;
+use Livewire\Component;
+
+class ResourceDetails extends Component
+{
+    use AuthorizesRequests;
+
+    public $resource;
+
+    public ?string $project_uuid = null;
+
+    public ?string $project_name = null;
+
+    public ?string $environment_uuid = null;
+
+    public ?string $environment_name = null;
+
+    public ?string $server_uuid = null;
+
+    public ?string $server_name = null;
+
+    public array $stack_applications = [];
+
+    public array $stack_databases = [];
+
+    public function mount()
+    {
+        $this->authorize('view', $this->resource);
+
+        $environment = $this->resource->environment ?? null;
+        if ($environment) {
+            $this->environment_uuid = $environment->uuid;
+            $this->environment_name = $environment->name;
+            $project = $environment->project ?? null;
+            if ($project) {
+                $this->project_uuid = $project->uuid;
+                $this->project_name = $project->name;
+            }
+        }
+
+        $server = $this->resolveServer();
+        if ($server) {
+            $this->server_uuid = $server->uuid;
+            $this->server_name = $server->name;
+        }
+
+        if ($this->resource instanceof Service) {
+            $this->stack_applications = $this->resource->applications
+                ->map(fn ($app) => [
+                    'name' => $app->human_name ?: $app->name,
+                    'uuid' => $app->uuid,
+                ])
+                ->values()
+                ->all();
+
+            $this->stack_databases = $this->resource->databases
+                ->map(fn ($db) => [
+                    'name' => $db->human_name ?: $db->name,
+                    'uuid' => $db->uuid,
+                ])
+                ->values()
+                ->all();
+        }
+    }
+
+    private function resolveServer()
+    {
+        try {
+            if (isset($this->resource->destination) && $this->resource->destination && isset($this->resource->destination->server)) {
+                return $this->resource->destination->server;
+            }
+            if (method_exists($this->resource, 'server') && $this->resource->server) {
+                return $this->resource->server;
+            }
+        } catch (\Throwable $e) {
+            return null;
+        }
+
+        return null;
+    }
+
+    public function render()
+    {
+        return view('livewire.project.shared.resource-details');
+    }
+}
diff --git a/resources/views/components/forms/copy-button.blade.php b/resources/views/components/forms/copy-button.blade.php
index 12fadc595..eb3f3d8a4 100644
--- a/resources/views/components/forms/copy-button.blade.php
+++ b/resources/views/components/forms/copy-button.blade.php
@@ -1,7 +1,13 @@
-@props(['text'])
+@props(['text', 'label' => null])
 
-<div class="relative" x-data="{ copied: false, isSecure: window.isSecureContext }">
-    <input type="text" value="{{ $text }}" readonly class="input">
+<div class="w-full" x-data="{ copied: false, isSecure: window.isSecureContext }">
+    @if ($label)
+        <label class="flex gap-1 items-center mb-1 text-sm font-medium">{{ $label }}</label>
+    @endif
+    <div class="relative">
+        <input type="text" value="{{ $text }}" class="input pr-10"
+            @keydown.prevent @paste.prevent @cut.prevent @drop.prevent
+            @focus="$event.target.select()">
     <button
         x-show="isSecure"
         @click.prevent="copied = true; navigator.clipboard.writeText({{ Js::from($text) }}); setTimeout(() => copied = false, 1000)"
@@ -15,4 +21,5 @@ class="absolute right-2 top-1/2 -translate-y-1/2 p-1.5 text-gray-400 hover:text-
             <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
         </svg>
     </button>
+    </div>
 </div>
diff --git a/resources/views/livewire/project/application/general.blade.php b/resources/views/livewire/project/application/general.blade.php
index fe3ef3686..e0d1153e8 100644
--- a/resources/views/livewire/project/application/general.blade.php
+++ b/resources/views/livewire/project/application/general.blade.php
@@ -12,6 +12,9 @@
                 <div>{{ $application->compose_parsing_version }}</div>
             @endif
             <x-forms.button canGate="update" :canResource="$application" type="submit">Save</x-forms.button>
+            <x-modal-input title="Resource Details" buttonTitle="Details">
+                <livewire:project.shared.resource-details :resource="$application" />
+            </x-modal-input>
             @if ($buildPack === 'dockercompose')
                 <x-forms.button canGate="update" :canResource="$application" wire:target='initLoadingCompose'
                     x-on:click="$wire.dispatch('loadCompose', false)">
diff --git a/resources/views/livewire/project/database/clickhouse/general.blade.php b/resources/views/livewire/project/database/clickhouse/general.blade.php
index 9283172ad..5fd006e8e 100644
--- a/resources/views/livewire/project/database/clickhouse/general.blade.php
+++ b/resources/views/livewire/project/database/clickhouse/general.blade.php
@@ -5,6 +5,9 @@
             <x-forms.button type="submit" canGate="update" :canResource="$database">
                 Save
             </x-forms.button>
+            <x-modal-input title="Resource Details" buttonTitle="Details">
+                <livewire:project.shared.resource-details :resource="$database" />
+            </x-modal-input>
         </div>
         <div class="flex gap-2">
             <x-forms.input label="Name" id="name" canGate="update" :canResource="$database" />
diff --git a/resources/views/livewire/project/database/dragonfly/general.blade.php b/resources/views/livewire/project/database/dragonfly/general.blade.php
index ce46e47dd..0e29948a2 100644
--- a/resources/views/livewire/project/database/dragonfly/general.blade.php
+++ b/resources/views/livewire/project/database/dragonfly/general.blade.php
@@ -5,6 +5,9 @@
             <x-forms.button type="submit" canGate="update" :canResource="$database">
                 Save
             </x-forms.button>
+            <x-modal-input title="Resource Details" buttonTitle="Details">
+                <livewire:project.shared.resource-details :resource="$database" />
+            </x-modal-input>
         </div>
         <div class="flex gap-2">
             <x-forms.input label="Name" id="name" canGate="update" :canResource="$database" />
diff --git a/resources/views/livewire/project/database/keydb/general.blade.php b/resources/views/livewire/project/database/keydb/general.blade.php
index ee3f8fd0c..1964fd5f3 100644
--- a/resources/views/livewire/project/database/keydb/general.blade.php
+++ b/resources/views/livewire/project/database/keydb/general.blade.php
@@ -5,6 +5,9 @@
             <x-forms.button type="submit" canGate="update" :canResource="$database">
                 Save
             </x-forms.button>
+            <x-modal-input title="Resource Details" buttonTitle="Details">
+                <livewire:project.shared.resource-details :resource="$database" />
+            </x-modal-input>
         </div>
         <div class="flex gap-2">
             <x-forms.input label="Name" id="name" canGate="update" :canResource="$database" />
diff --git a/resources/views/livewire/project/database/mariadb/general.blade.php b/resources/views/livewire/project/database/mariadb/general.blade.php
index 1154124d1..ab6badda5 100644
--- a/resources/views/livewire/project/database/mariadb/general.blade.php
+++ b/resources/views/livewire/project/database/mariadb/general.blade.php
@@ -5,6 +5,9 @@
             <x-forms.button type="submit" canGate="update" :canResource="$database">
                 Save
             </x-forms.button>
+            <x-modal-input title="Resource Details" buttonTitle="Details">
+                <livewire:project.shared.resource-details :resource="$database" />
+            </x-modal-input>
         </div>
         <div class="flex gap-2">
             <x-forms.input label="Name" id="name" canGate="update" :canResource="$database" />
diff --git a/resources/views/livewire/project/database/mongodb/general.blade.php b/resources/views/livewire/project/database/mongodb/general.blade.php
index e9e5d621d..787bc7ad5 100644
--- a/resources/views/livewire/project/database/mongodb/general.blade.php
+++ b/resources/views/livewire/project/database/mongodb/general.blade.php
@@ -5,6 +5,9 @@
             <x-forms.button type="submit" canGate="update" :canResource="$database">
                 Save
             </x-forms.button>
+            <x-modal-input title="Resource Details" buttonTitle="Details">
+                <livewire:project.shared.resource-details :resource="$database" />
+            </x-modal-input>
         </div>
         <div class="flex gap-2">
             <x-forms.input label="Name" id="name" canGate="update" :canResource="$database" />
diff --git a/resources/views/livewire/project/database/mysql/general.blade.php b/resources/views/livewire/project/database/mysql/general.blade.php
index bb3916ec8..80dcad117 100644
--- a/resources/views/livewire/project/database/mysql/general.blade.php
+++ b/resources/views/livewire/project/database/mysql/general.blade.php
@@ -5,6 +5,9 @@
             <x-forms.button type="submit">
                 Save
             </x-forms.button>
+            <x-modal-input title="Resource Details" buttonTitle="Details">
+                <livewire:project.shared.resource-details :resource="$database" />
+            </x-modal-input>
         </div>
         <div class="flex gap-2">
             <x-forms.input label="Name" id="name" canGate="update" :canResource="$database" />
diff --git a/resources/views/livewire/project/database/postgresql/general.blade.php b/resources/views/livewire/project/database/postgresql/general.blade.php
index 9c956f5b3..3f51bf31d 100644
--- a/resources/views/livewire/project/database/postgresql/general.blade.php
+++ b/resources/views/livewire/project/database/postgresql/general.blade.php
@@ -19,6 +19,9 @@
             <x-forms.button type="submit" canGate="update" :canResource="$database">
                 Save
             </x-forms.button>
+            <x-modal-input title="Resource Details" buttonTitle="Details">
+                <livewire:project.shared.resource-details :resource="$database" />
+            </x-modal-input>
         </div>
         <div class="flex flex-wrap gap-2 sm:flex-nowrap">
             <x-forms.input label="Name" id="name" canGate="update" :canResource="$database" />
diff --git a/resources/views/livewire/project/database/redis/general.blade.php b/resources/views/livewire/project/database/redis/general.blade.php
index 73ee5f0e5..e644a9107 100644
--- a/resources/views/livewire/project/database/redis/general.blade.php
+++ b/resources/views/livewire/project/database/redis/general.blade.php
@@ -5,6 +5,9 @@
             <x-forms.button type="submit" canGate="update" :canResource="$database">
                 Save
             </x-forms.button>
+            <x-modal-input title="Resource Details" buttonTitle="Details">
+                <livewire:project.shared.resource-details :resource="$database" />
+            </x-modal-input>
         </div>
         <div class="flex gap-2">
             <x-forms.input label="Name" id="name" canGate="update" :canResource="$database" />
diff --git a/resources/views/livewire/project/service/stack-form.blade.php b/resources/views/livewire/project/service/stack-form.blade.php
index e63e7a509..0aec7c873 100644
--- a/resources/views/livewire/project/service/stack-form.blade.php
+++ b/resources/views/livewire/project/service/stack-form.blade.php
@@ -12,6 +12,9 @@
                     <livewire:project.service.edit-compose serviceId="{{ $service->id }}" />
                 </x-modal-input>
             @endcan
+            <x-modal-input title="Resource Details" buttonTitle="Details">
+                <livewire:project.shared.resource-details :resource="$service" />
+            </x-modal-input>
         </div>
         <div>Configuration</div>
     </div>
diff --git a/resources/views/livewire/project/shared/resource-details.blade.php b/resources/views/livewire/project/shared/resource-details.blade.php
new file mode 100644
index 000000000..3be82da12
--- /dev/null
+++ b/resources/views/livewire/project/shared/resource-details.blade.php
@@ -0,0 +1,57 @@
+<div class="w-full max-h-[70vh] overflow-y-auto pr-1 -mt-4">
+    <div class="pb-4 text-sm dark:text-neutral-400">Identifiers for this resource. Read-only</div>
+
+    <div class="flex flex-col gap-6">
+        <div>
+            <h3>Resource</h3>
+            <div class="pt-2 grid grid-cols-1 gap-3 md:grid-cols-2">
+                <x-forms.copy-button label="Name" :text="$resource->name ?? ''" />
+                <x-forms.copy-button label="UUID" :text="$resource->uuid ?? ''" />
+            </div>
+        </div>
+
+        @if ($environment_uuid)
+            <div>
+                <h3>Environment</h3>
+                <div class="pt-2 grid grid-cols-1 gap-3 md:grid-cols-2">
+                    <x-forms.copy-button label="Name" :text="$environment_name ?? ''" />
+                    <x-forms.copy-button label="UUID" :text="$environment_uuid" />
+                </div>
+            </div>
+        @endif
+
+        @if ($project_uuid)
+            <div>
+                <h3>Project</h3>
+                <div class="pt-2 grid grid-cols-1 gap-3 md:grid-cols-2">
+                    <x-forms.copy-button label="Name" :text="$project_name ?? ''" />
+                    <x-forms.copy-button label="UUID" :text="$project_uuid" />
+                </div>
+            </div>
+        @endif
+
+        @if ($server_uuid)
+            <div>
+                <h3>Server</h3>
+                <div class="pt-2 grid grid-cols-1 gap-3 md:grid-cols-2">
+                    <x-forms.copy-button label="Name" :text="$server_name ?? ''" />
+                    <x-forms.copy-button label="UUID" :text="$server_uuid" />
+                </div>
+            </div>
+        @endif
+
+        @if (! empty($stack_applications) || ! empty($stack_databases))
+            <div>
+                <h3>Stack Sub-Resources</h3>
+                <div class="pt-2 grid grid-cols-1 gap-3 md:grid-cols-2">
+                    @foreach ($stack_applications as $item)
+                        <x-forms.copy-button :label="'Application — ' . $item['name']" :text="$item['uuid']" />
+                    @endforeach
+                    @foreach ($stack_databases as $item)
+                        <x-forms.copy-button :label="'Database — ' . $item['name']" :text="$item['uuid']" />
+                    @endforeach
+                </div>
+            </div>
+        @endif
+    </div>
+</div>