Refactor code and update UI components

resources/views/livewire/project/database/postgresql/general.blade.php

@@ -82,7 +82,21 @@
     <div class="pb-16">
         <div class="flex gap-2 pt-4 pb-2">
             <h3>Initialization scripts</h3>
-            <x-forms.button  onclick="newInitScript.showModal()">+ Add</x-forms.button>
+            <x-slide-over>
+                <x-slot:title>New Init Script</x-slot:title>
+                <x-slot:content>
+                    <form class="flex flex-col gap-2 rounded modal-box" wire:submit='save_new_init_script'>
+                        <x-forms.input placeholder="create_test_db.sql" id="new_filename" label="Filename" required />
+                        <x-forms.textarea placeholder="CREATE DATABASE test;" id="new_content" label="Content"
+                            required />
+                        <x-forms.button type="submit">
+                            Save
+                        </x-forms.button>
+                    </form>
+                </x-slot:content>
+                <button @click="slideOverOpen=true" class="button">+
+                    Add</button>
+            </x-slide-over>
         </div>
         <div class="flex flex-col gap-2">
             @forelse(data_get($database,'init_scripts', []) as $script)