feat(ui): improve deployment UI

- fix: show time details even if a deployment has failed
- feat: added back "finished x min ago" to make it easier to see how long ago a deployment was finished
This commit is contained in:
peaklabs-dev
2025-01-23 13:21:11 +01:00
parent cc640ad710
commit 1072a0c17c
4 changed files with 8 additions and 4 deletions

View File

@@ -60,9 +60,10 @@
@if(data_get($deployment, 'status') !== 'queued')
<div class="text-gray-600 dark:text-gray-400 text-sm">
Started: {{ formatDateInServerTimezone(data_get($deployment, 'created_at'), data_get($application, 'destination.server')) }}
@if($deployment->status !== 'in_progress' && $deployment->status !== 'cancelled-by-user' && $deployment->status !== 'failed')
@if($deployment->status !== 'in_progress' && $deployment->status !== 'cancelled-by-user')
<br>Ended: {{ formatDateInServerTimezone(data_get($deployment, 'finished_at'), data_get($application, 'destination.server')) }}
<br>Duration: {{ calculateDuration(data_get($deployment, 'created_at'), data_get($deployment, 'finished_at')) }}
<br>Finished {{ \Carbon\Carbon::parse(data_get($deployment, 'finished_at'))->diffForHumans() }}
@elseif($deployment->status === 'in_progress')
<br>Running for: {{ calculateDuration(data_get($deployment, 'created_at'), now()) }}
@endif

View File

@@ -4,7 +4,7 @@
<h3 class="py-4">Executions</h3>
<x-forms.button wire:click='cleanupFailed'>Cleanup Failed Backups</x-forms.button>
</div>
<div class="flex flex-col gap-4">
<div wire:poll.5000ms="refreshBackupExecutions" class="flex flex-col gap-4">
@forelse($executions as $execution)
<div wire:key="{{ data_get($execution, 'id') }}" @class([
'flex flex-col border-l-2 transition-colors p-4 bg-white dark:bg-coolgray-100 text-black dark:text-white',
@@ -40,6 +40,7 @@
@if(data_get($execution, 'status') !== 'running')
<br>Ended: {{ formatDateInServerTimezone(data_get($execution, 'finished_at'), $this->server()) }}
<br>Duration: {{ calculateDuration(data_get($execution, 'created_at'), data_get($execution, 'finished_at')) }}
<br>Finished {{ \Carbon\Carbon::parse(data_get($execution, 'finished_at'))->diffForHumans() }}
@endif
</div>
<div class="text-gray-600 dark:text-gray-400 text-sm">

View File

@@ -1,4 +1,4 @@
<div class="flex flex-col gap-2" x-data="{
<div class="flex flex-col gap-2" wire:poll.5000ms="refreshExecutions" x-data="{
init() {
let interval;
$wire.$watch('isPollingActive', value => {
@@ -48,6 +48,7 @@
@if(data_get($execution, 'status') !== 'running')
<br>Ended: {{ formatDateInServerTimezone(data_get($execution, 'finished_at'), data_get($task, 'application.destination.server') ?? data_get($task, 'service.destination.server')) }}
<br>Duration: {{ calculateDuration(data_get($execution, 'created_at'), data_get($execution, 'finished_at')) }}
<br>Finished {{ \Carbon\Carbon::parse(data_get($execution, 'finished_at'))->diffForHumans() }}
@endif
</div>
</a>

View File

@@ -1,4 +1,4 @@
<div class="flex flex-col gap-2" x-data="{
<div class="flex flex-col gap-2" wire:poll.5000ms="refreshExecutions" x-data="{
init() {
let interval;
$wire.$watch('isPollingActive', value => {
@@ -48,6 +48,7 @@
@if(data_get($execution, 'status') !== 'running')
<br>Ended: {{ formatDateInServerTimezone(data_get($execution, 'finished_at'), $server) }}
<br>Duration: {{ calculateDuration(data_get($execution, 'created_at'), data_get($execution, 'finished_at')) }}
<br>Finished {{ \Carbon\Carbon::parse(data_get($execution, 'finished_at'))->diffForHumans() }}
@endif
</div>
</a>