fix: make server icon customization available on all pages

- Moved icon modal properties and methods from Overview.php to base Component.php
- All Proxmox Livewire components now inherit icon customization functionality
- Removed view restriction so modal works on all server pages (not just overview)
- Icon button is now clickable and functional on Network, Storage, Backups, etc.
This commit is contained in:
2025-12-06 09:16:58 -05:00
parent 60c5e5d93d
commit 1a96bfdee0
3 changed files with 62 additions and 52 deletions

View File

@@ -24,6 +24,14 @@ class Component extends BaseComponent
*/
public bool $fastPolling = false;
/**
* Server icon customization properties
*/
public bool $showIconModal = false;
public string $selectedIcon = '';
public string $selectedIconColor = '';
public string $iconSearchQuery = ''; // Legacy property for stale sessions
/**
* Mount the component with the server.
*/
@@ -34,9 +42,63 @@ class Component extends BaseComponent
abort(403);
}
// Load icon customization
$this->selectedIcon = $server->user_set_icon ?? '';
$this->selectedIconColor = $server->user_set_icon_color ?? '';
$this->loadVmStatus();
}
/**
* Open the icon customization modal.
*/
public function openIconModal(): void
{
$this->showIconModal = true;
}
/**
* Close the icon customization modal.
*/
public function closeIconModal(): void
{
$this->showIconModal = false;
}
/**
* Save the selected icon and color.
*/
public function saveIcon(string $icon, string $color): void
{
$this->server->update([
'user_set_icon' => $icon ?: null,
'user_set_icon_color' => $color ?: null,
]);
$this->selectedIcon = $icon;
$this->selectedIconColor = $color;
$this->showIconModal = false;
$this->notify('Server icon updated successfully', 'success');
}
/**
* Reset the server icon to default.
*/
public function resetIcon(): void
{
$this->server->update([
'user_set_icon' => null,
'user_set_icon_color' => null,
]);
$this->selectedIcon = '';
$this->selectedIconColor = '';
$this->showIconModal = false;
$this->notify('Server icon reset to default', 'success');
}
/**
* Perform a VM lifecycle action (start/stop/etc).
*/

View File

@@ -22,14 +22,6 @@ class Overview extends Component
public $isEditingPassword = false;
public $passwordError = '';
// Server icon customization
public bool $showIconModal = false;
public string $selectedIcon = '';
public string $selectedIconColor = '';
// Legacy property for stale sessions
public string $iconSearchQuery = '';
public string $cpuTimeRange = 'hour';
public string $cpuAggregation = 'average';
@@ -56,10 +48,6 @@ class Overview extends Component
$this->hostname = $server->hostname ?? ($this->status->name ?? '');
// Load icon customization
$this->selectedIcon = $server->user_set_icon ?? '';
$this->selectedIconColor = $server->user_set_icon_color ?? '';
// Load notes from Proxmox VM description
try {
$proxmox = new Proxmox;
@@ -70,44 +58,6 @@ class Overview extends Component
}
}
public function openIconModal(): void
{
$this->showIconModal = true;
}
public function closeIconModal(): void
{
$this->showIconModal = false;
}
public function saveIcon(string $icon, string $color): void
{
$this->server->update([
'user_set_icon' => $icon ?: null,
'user_set_icon_color' => $color ?: null,
]);
$this->selectedIcon = $icon;
$this->selectedIconColor = $color;
$this->showIconModal = false;
$this->notify('Server icon updated successfully', 'success');
}
public function resetIcon(): void
{
$this->server->update([
'user_set_icon' => null,
'user_set_icon_color' => null,
]);
$this->selectedIcon = '';
$this->selectedIconColor = '';
$this->showIconModal = false;
$this->notify('Server icon reset to default', 'success');
}
public function checkStatus()
{
$currentStatus = $this->status->status;

View File

@@ -920,7 +920,6 @@
</div>
<!-- Server Icon Customization Modal -->
@if($view === 'overview')
<div x-data="{
open: @entangle('showIconModal'),
selectedIcon: @entangle('selectedIcon'),
@@ -1068,7 +1067,6 @@
</div>
</div>
</div>
@endif
@else
@php