Merge branch 'main' of gitea.virtnet.bond:Joseph.Rawlings/Virtnet.bond

This commit is contained in:
2026-03-10 23:09:07 +01:00

View File

@@ -85,7 +85,6 @@
activeSection: null,
pendingSection: null,
transitionDelay: 220,
osSearch: '',
toggleSection(key) {
if (this.activeSection === key) {
this.activeSection = null;
@@ -106,15 +105,6 @@
}
this.activeSection = key;
},
matchesSearch(name) {
if (!this.osSearch.trim()) return true;
return name.toLowerCase().includes(this.osSearch.trim().toLowerCase());
},
categoryHasMatch(categoryEl) {
if (!this.osSearch.trim()) return true;
const labels = categoryEl.querySelectorAll('[data-os-name]');
return Array.from(labels).some(el => this.matchesSearch(el.dataset.osName));
}
}">
@if($isProtected)
@@ -146,23 +136,6 @@
<p class="text-sm text-base/70">Choose a new operating system. The selected template will be installed from scratch.</p>
</div>
<!-- OS Search Filter -->
<div class="relative mb-4">
<div class="absolute inset-y-0 left-0 pl-3 flex items-center pointer-events-none">
<x-ri-search-line class="size-4 text-base/40" />
</div>
<input type="text"
x-model="osSearch"
placeholder="Search operating systems..."
class="w-full pl-10 pr-4 py-2.5 text-sm rounded-lg border border-neutral bg-background focus:ring-2 focus:ring-primary/25 focus:border-primary transition-colors"
@if($isProtected) disabled @endif />
<div x-show="osSearch.length > 0" x-transition class="absolute inset-y-0 right-0 pr-3 flex items-center">
<button @click="osSearch = ''" type="button" class="text-base/40 hover:text-base/60 transition-colors">
<x-ri-close-line class="size-4" />
</button>
</div>
</div>
<div class="space-y-3 max-h-[460px] overflow-y-auto pr-1" @if($isProtected) style="pointer-events: none; opacity: 0.6;" @endif>
@if($groupedOs->isEmpty())
<div class="flex flex-col items-center justify-center py-12 text-center">
@@ -178,12 +151,9 @@
@else
@foreach($groupedOs as $categoryLabel => $templates)
@php
$categoryKey = \Illuminate\Support\Str::slug($categoryLabel);
$categoryKey = \Illuminate\Support\Str::snake(\Illuminate\Support\Str::ascii($categoryLabel));
@endphp
<div class="border border-neutral/40 rounded-xl overflow-hidden" wire:key="os-category-{{ $categoryKey }}"
x-ref="category_{{ $categoryKey }}"
x-show="categoryHasMatch($refs.category_{{ $categoryKey }})"
x-init="$watch('osSearch', () => { if (osSearch.trim() && categoryHasMatch($refs.category_{{ $categoryKey }})) { activeSection = '{{ $categoryKey }}'; } })">
<div class="border border-neutral/40 rounded-xl overflow-hidden" wire:key="os-category-{{ $categoryKey }}">
<button type="button" class="w-full flex items-center justify-between px-4 py-3 bg-background-secondary/60 hover:bg-background-secondary transition"
@click="toggleSection('{{ $categoryKey }}')">
<div class="flex items-center gap-3">
@@ -226,9 +196,6 @@
$isSelected = (string) $template->id === (string) ($os ?? '');
@endphp
<label wire:key="os-card-{{ $template->id }}"
data-os-name="{{ $template->name }}"
x-show="matchesSearch('{{ addslashes($template->name) }}')"
x-transition
class="relative flex items-center gap-4 rounded-xl border p-4 cursor-pointer transition-all duration-150
@if($isSelected) border-primary bg-primary/5 ring-2 ring-primary/40 shadow-lg @else border-neutral/60 hover:border-primary/60 @endif">
<input type="radio" class="sr-only" wire:model.live="os" value="{{ $template->id }}">