rosslh/coolify
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Refactor deployment indicator to use server-side route detection

Browse source 
Replace client-side JavaScript URL checking with Laravel's routeIs() for determining when to reduce indicator opacity. This simplifies the code and uses route names as the source of truth.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Andras Bacsai 2025-12-11 09:39:56 +01:00
parent 911cfa0b38
commit c6a89087c5
2 changed files with 8 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
app/Livewire/DeploymentsIndicator.php
View file

@ -38,6 +38,12 @@ public function deploymentCount()
return $this->deployments->count();
}
#[Computed]
public function shouldReduceOpacity(): bool
{
return request()->routeIs('project.application.deployment.*');
}
public function toggleExpanded()
{
$this->expanded = ! $this->expanded;

11
resources/views/livewire/deployments-indicator.blade.php
View file

@ -1,17 +1,10 @@
<div wire:poll.3000ms x-data="{
expanded: @entangle('expanded'),
isDeploymentPage: false,
checkPage() {
this.isDeploymentPage = window.location.pathname.includes('/deployment');
},
init() {
this.checkPage();
document.addEventListener('livewire:navigated', () => this.checkPage());
}
reduceOpacity: @js($this->shouldReduceOpacity)
}" class="fixed bottom-0 z-60 mb-4 left-0 lg:left-56 ml-4">
@if ($this->deploymentCount > 0)
<div class="relative transition-opacity duration-200"
:class="{ 'opacity-100': expanded || !isDeploymentPage, 'opacity-60 hover:opacity-100': isDeploymentPage && !expanded }">
:class="{ 'opacity-100': expanded || !reduceOpacity, 'opacity-60 hover:opacity-100': reduceOpacity && !expanded }">
<!-- Indicator Button -->
<button @click="expanded = !expanded"
class="flex items-center gap-2 px-4 py-2 rounded-lg shadow-lg transition-all duration-200 dark:bg-coolgray-100 bg-white dark:border dark:border-coolgray-200 hover:shadow-xl">