From f763c3aa8b1e1fa26878bfb485f6bb78c4137603 Mon Sep 17 00:00:00 2001 From: Andras Bacsai <5845193+andrasbacsai@users.noreply.github.com> Date: Mon, 15 Dec 2025 16:45:30 +0100 Subject: [PATCH] Refactor project environment and resource management UI - Removed unnecessary SVG icons from the environment edit view for cleaner UI. - Deleted the environment select component as it was no longer needed. - Enhanced the project resource index view with a dropdown for environments and resources, improving navigation. - Implemented dynamic dropdowns for environments and their associated resources, allowing for better user interaction. - Added transitions and hover effects for a more responsive design. - Updated the layout to ensure a consistent user experience across different project resources. --- .../Project/Resource/EnvironmentSelect.php | 35 -- .../resources/breadcrumbs.blade.php | 476 ++++++++++++------ .../project/environment-edit.blade.php | 8 +- .../resource/environment-select.blade.php | 7 - .../livewire/project/resource/index.blade.php | 291 ++++++++++- 5 files changed, 601 insertions(+), 216 deletions(-) delete mode 100644 app/Livewire/Project/Resource/EnvironmentSelect.php delete mode 100644 resources/views/livewire/project/resource/environment-select.blade.php diff --git a/app/Livewire/Project/Resource/EnvironmentSelect.php b/app/Livewire/Project/Resource/EnvironmentSelect.php deleted file mode 100644 index a38d750da..000000000 --- a/app/Livewire/Project/Resource/EnvironmentSelect.php +++ /dev/null @@ -1,35 +0,0 @@ -selectedEnvironment = request()->route('environment_uuid'); - $this->project_uuid = request()->route('project_uuid'); - } - - public function updatedSelectedEnvironment($value) - { - if ($value === 'edit') { - return redirect()->route('project.show', [ - 'project_uuid' => $this->project_uuid, - ]); - } else { - return redirect()->route('project.resource.index', [ - 'project_uuid' => $this->project_uuid, - 'environment_uuid' => $value, - ]); - } - } -} diff --git a/resources/views/components/resources/breadcrumbs.blade.php b/resources/views/components/resources/breadcrumbs.blade.php index 215adbb2a..f84f4287a 100644 --- a/resources/views/components/resources/breadcrumbs.blade.php +++ b/resources/views/components/resources/breadcrumbs.blade.php @@ -5,7 +5,10 @@ ]) @php $projects = auth()->user()->currentTeam()->projects()->get(); - $environments = $resource->environment->project->environments()->with(['applications', 'services'])->get(); + $environments = $resource->environment->project + ->environments() + ->with(['applications', 'services']) + ->get(); $currentProjectUuid = data_get($resource, 'environment.project.uuid'); $currentEnvironmentUuid = data_get($resource, 'environment.uuid'); $currentResourceUuid = data_get($resource, 'uuid'); @@ -20,17 +23,17 @@ {{ data_get($resource, 'environment.project.name', 'Undefined Name') }} - - + -
@foreach ($projects as $project) -
+
- - + -
+
-
+
@foreach ($environments as $environment) @php $envResources = collect() - ->merge($environment->applications->map(fn($app) => ['type' => 'application', 'resource' => $app])) - ->merge($environment->databases()->map(fn($db) => ['type' => 'database', 'resource' => $db])) - ->merge($environment->services->map(fn($svc) => ['type' => 'service', 'resource' => $svc])); + ->merge( + $environment->applications->map( + fn($app) => ['type' => 'application', 'resource' => $app], + ), + ) + ->merge( + $environment + ->databases() + ->map(fn($db) => ['type' => 'database', 'resource' => $db]), + ) + ->merge( + $environment->services->map( + fn($svc) => ['type' => 'service', 'resource' => $svc], + ), + ); @endphp - @foreach ($environments as $environment) @php $envResources = collect() - ->merge($environment->applications->map(fn($app) => ['type' => 'application', 'resource' => $app])) - ->merge($environment->databases()->map(fn($db) => ['type' => 'database', 'resource' => $db])) - ->merge($environment->services->map(fn($svc) => ['type' => 'service', 'resource' => $svc])); + ->merge( + $environment->applications->map( + fn($app) => ['type' => 'application', 'resource' => $app], + ), + ) + ->merge( + $environment + ->databases() + ->map(fn($db) => ['type' => 'database', 'resource' => $db]), + ) + ->merge( + $environment->services->map(fn($svc) => ['type' => 'service', 'resource' => $svc]), + ); @endphp @if ($envResources->count() > 0)
-
+ @mouseenter="activeEnv = '{{ $environment->uuid }}'" + @mouseleave="activeEnv = null; activeRes = null" class="ml-1 flex items-start"> +
@foreach ($envResources as $envResource) @php $resType = $envResource['type']; $res = $envResource['resource']; - $resRoute = match($resType) { + $resRoute = match ($resType) { 'application' => route('project.application.configuration', [ 'project_uuid' => $currentProjectUuid, 'environment_uuid' => $environment->uuid, @@ -132,13 +174,16 @@ class="ml-1 flex items-start"> }; $isCurrentResource = $res->uuid === $currentResourceUuid; @endphp -
+ @@ -164,110 +209,182 @@ class="flex items-center justify-between gap-2 px-4 py-2 text-sm hover:bg-coolgr $resKey = $environment->uuid . '-' . $res->uuid; @endphp
-
+
@if ($resType === 'application') -
+ - Deployments - Logs + Deployments + Logs @can('canAccessTerminal') - Terminal + Terminal @endcan @elseif ($resType === 'service') -
+ - Logs + Logs @can('canAccessTerminal') - Terminal + Terminal @endcan @else -
+ - Logs + Logs @can('canAccessTerminal') - Terminal + Terminal @endcan @if ( $res->getMorphClass() === 'App\Models\StandalonePostgresql' || - $res->getMorphClass() === 'App\Models\StandaloneMongodb' || - $res->getMorphClass() === 'App\Models\StandaloneMysql' || - $res->getMorphClass() === 'App\Models\StandaloneMariadb') - Backups + $res->getMorphClass() === 'App\Models\StandaloneMongodb' || + $res->getMorphClass() === 'App\Models\StandaloneMysql' || + $res->getMorphClass() === 'App\Models\StandaloneMariadb') + Backups @endif @endif
@if ($resType === 'application') - General - Environment Variables - Persistent Storage - Source - Servers - Scheduled Tasks - Webhooks - Preview Deployments - Healthcheck - Rollback - Resource Limits - Resource Operations - Metrics - Tags - Advanced - Danger Zone + General + Environment + Variables + Persistent + Storage + Source + Servers + Scheduled + Tasks + Webhooks + Preview + Deployments + Healthcheck + Rollback + Resource + Limits + Resource + Operations + Metrics + Tags + Advanced + Danger + Zone @elseif ($resType === 'service') - General - Environment Variables - Storages - Scheduled Tasks - Webhooks - Resource Operations - Tags - Danger Zone + General + Environment + Variables + Storages + Scheduled + Tasks + Webhooks + Resource + Operations + Tags + Danger + Zone @else - General - Environment Variables - Servers - Persistent Storage - Webhooks - Resource Limits - Resource Operations - Metrics - Tags - Danger Zone + General + Environment + Variables + Servers + Persistent + Storage + Webhooks + Resource + Limits + Resource + Operations + Metrics + Tags + Danger + Zone @endif
@@ -299,7 +416,8 @@ class="ml-1 w-52 bg-white dark:bg-coolgray-100 rounded-md shadow-lg py-1 border } @endphp
  • -
    +
    - - + + -
    -
    +
    @if ($isApplication) @@ -354,8 +476,10 @@ class="block px-4 py-2 text-sm hover:bg-coolgray-200 dark:hover:bg-coolgray-200" Configuration - - + +
    @@ -375,8 +499,10 @@ class="block px-4 py-2 text-sm hover:bg-coolgray-200 dark:hover:bg-coolgray-200" Configuration - - + +
    @@ -392,9 +518,9 @@ class="block px-4 py-2 text-sm hover:bg-coolgray-200 dark:hover:bg-coolgray-200" @endcan @if ( $resourceType === 'App\Models\StandalonePostgresql' || - $resourceType === 'App\Models\StandaloneMongodb' || - $resourceType === 'App\Models\StandaloneMysql' || - $resourceType === 'App\Models\StandaloneMariadb') + $resourceType === 'App\Models\StandaloneMongodb' || + $resourceType === 'App\Models\StandaloneMysql' || + $resourceType === 'App\Models\StandaloneMariadb') Backups @@ -404,49 +530,99 @@ class="block px-4 py-2 text-sm hover:bg-coolgray-200 dark:hover:bg-coolgray-200"
    -
    @if ($isApplication) - General - Environment Variables - Persistent Storage - Source - Servers - Scheduled Tasks - Webhooks - Preview Deployments - Healthcheck - Rollback - Resource Limits - Resource Operations - Metrics - Tags - Advanced - Danger Zone + General + Environment + Variables + Persistent + Storage + Source + Servers + Scheduled + Tasks + Webhooks + Preview + Deployments + Healthcheck + Rollback + Resource + Limits + Resource + Operations + Metrics + Tags + Advanced + Danger + Zone @elseif ($isService) - General - Environment Variables - Storages - Scheduled Tasks - Webhooks - Resource Operations - Tags - Danger Zone + General + Environment + Variables + Storages + Scheduled + Tasks + Webhooks + Resource + Operations + Tags + Danger + Zone @else - General - Environment Variables - Servers - Persistent Storage - Webhooks - Resource Limits - Resource Operations - Metrics - Tags - Danger Zone + General + Environment + Variables + Servers + Persistent + Storage + Webhooks + Resource + Limits + Resource + Operations + Metrics + Tags + Danger + Zone @endif
    diff --git a/resources/views/livewire/project/environment-edit.blade.php b/resources/views/livewire/project/environment-edit.blade.php index 078d93456..1e1cdb9a7 100644 --- a/resources/views/livewire/project/environment-edit.blade.php +++ b/resources/views/livewire/project/environment-edit.blade.php @@ -17,12 +17,6 @@ {{ $project->name }} -
  • @@ -35,7 +29,7 @@
  • -
    + @php + $projects = auth()->user()->currentTeam()->projects()->get(); + @endphp
    • @@ -167,7 +422,8 @@ class="grid grid-cols-1 gap-4 pt-4 lg:grid-cols-2 xl:grid-cols-3">
    @@ -216,7 +472,8 @@ class="grid grid-cols-1 gap-4 pt-4 lg:grid-cols-2 xl:grid-cols-3">