fix: move s3 storages to separate view

resources/views/livewire/storage/form.blade.php

@@ -0,0 +1,37 @@
+<div>
+    <form class="flex flex-col gap-2 pb-6" wire:submit='submit'>
+        <div class="flex items-start gap-2">
+            <div class="pb-4">
+                <h1>Storage Details</h1>
+                <div class="subtitle">{{ $storage->name }}</div>
+                @if ($storage->is_usable)
+                    <div>Usable</div>
+                @else
+                    <div class="text-red-500">Not Usable</div>
+                @endif
+            </div>
+            <x-forms.button type="submit">
+                Save
+            </x-forms.button>
+            <x-forms.button wire:click="test_s3_connection">
+                Validate Connection
+            </x-forms.button>
+            <x-modal-confirmation isErrorButton buttonTitle="Delete">
+                This storage will be deleted. It is not reversible. Your data won't be touched!<br>Please think again.
+            </x-modal-confirmation>
+        </div>
+        <div class="flex gap-2">
+            <x-forms.input label="Name" id="storage.name" />
+            <x-forms.input label="Description" id="storage.description" />
+        </div>
+        <div class="flex gap-2">
+            <x-forms.input required label="Endpoint" id="storage.endpoint" />
+            <x-forms.input required label="Bucket" id="storage.bucket" />
+            <x-forms.input required label="Region" id="storage.region" />
+        </div>
+        <div class="flex gap-2">
+            <x-forms.input required type="password" label="Access Key" id="storage.key" />
+            <x-forms.input required type="password" label="Secret Key" id="storage.secret" />
+        </div>
+    </form>
+</div>