feat: add clear button for cloud-init script dropdown

Add a 'Clear' button next to the cloud-init script dropdown that:
- Resets the dropdown to default (placeholder option)
- Clears the cloud-init script textarea
- Clears the script name input
- Unchecks the 'save script' checkbox

Improves UX by allowing users to quickly reset cloud-init fields
without manually clearing each field.

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

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Andras Bacsai 2025-10-11 18:51:29 +02:00
parent 9c21304ddb
commit 7ad7247284
2 changed files with 20 additions and 7 deletions

View file

@ -407,6 +407,14 @@ public function updatedSelectedCloudInitScriptId($value)
}
}
public function clearCloudInitScript()
{
$this->selected_cloud_init_script_id = null;
$this->cloud_init_script = '';
$this->cloud_init_script_name = '';
$this->save_cloud_init_script = false;
}
private function createHetznerServer(string $token): array
{
$hetznerService = new HetznerService($token);

View file

@ -156,15 +156,20 @@ class="p-4 border border-yellow-500 dark:border-yellow-600 rounded bg-yellow-50
</div>
<div class="flex flex-col gap-2">
<div class="flex justify-between items-center">
<div class="flex justify-between items-center gap-2">
<label class="text-sm font-medium w-64">Cloud-Init Script</label>
@if ($saved_cloud_init_scripts->count() > 0)
<x-forms.select wire:model.live="selected_cloud_init_script_id" label="" helper="">
<option value="">Load saved script...</option>
@foreach ($saved_cloud_init_scripts as $script)
<option value="{{ $script->id }}">{{ $script->name }}</option>
@endforeach
</x-forms.select>
<div class="flex items-center gap-2 flex-1">
<x-forms.select wire:model.live="selected_cloud_init_script_id" label="" helper="">
<option value="">Load saved script...</option>
@foreach ($saved_cloud_init_scripts as $script)
<option value="{{ $script->id }}">{{ $script->name }}</option>
@endforeach
</x-forms.select>
<x-forms.button type="button" wire:click="clearCloudInitScript">
Clear
</x-forms.button>
</div>
@endif
</div>
<x-forms.textarea id="cloud_init_script" label=""