move to custom x-form component and fix htmlspecialentities issue

resources/views/components/ib-drawer.blade.php

@@ -23,10 +23,20 @@
     <div @click="open = false" class="fixed inset-0 bg-black opacity-50"></div>
 
     <x-card 
-        :title="$title"
+        
-        :subtitle="$subtitle"
         {{ $attributes->merge(['class' => 'min-h-screen w-11/12 lg:w-1/3 rounded-none px-8 transition']) }} 
     >
+        @if($title)
+            <x-slot:title>
+                {!! strip_tags($title) !!}
+            </x-slot:title>
+        @endif
+
+        @if($subtitle)
+            <x-slot:subtitle>
+                {!! strip_tags($subtitle) !!}
+            </x-slot:subtitle>
+        @endif
 
         @if ($showClose)
             <x-button icon="o-x-mark" class="btn-ghost btn-circle btn-sm absolute top-4 right-4 " @click="open = false" />

resources/views/components/ib-form.blade.php

@@ -0,0 +1,21 @@
+@props([
+    'noSeparator' => false,
+])
+
+<form
+    {{ $attributes->whereDoesntStartWith('class') }}
+    {{ $attributes->class(['grid grid-flow-row auto-rows-min gap-3']) }}
+>
+
+    {{ $slot }}
+
+    @if ($actions)
+        @if(!$noSeparator)
+            <hr class="my-3" />
+        @endif
+
+        <div class="flex justify-between gap-3">
+            {{ $actions}}
+        </div>
+    @endif
+</form>

resources/views/livewire/manage-portfolio-form.blade.php

@@ -47,20 +47,6 @@ new class extends Component {
 
     public function save()
     {
-
-        // // get stats
-        // $key = 'portfolio-metrics-' . $portfolio->id;
-        // $metrics = cache()->remember($key, 60, function () use ($portfolio) {
-        //     return Holding::where(['portfolio_id' => $portfolio->id])
-        //         ->withPortfolioMetrics()
-        //         ->first();
-        // });
-
-        // return view('pages.portfolios.show', [
-        //     'portfolio' => $portfolio,
-        //     'metrics' => $metrics
-        // ]);
-
         $portfolio = (new Portfolio())->fill($this->validate());
         // $portfolio->owner_id = auth()->user()->id;
         $portfolio->save();
@@ -78,7 +64,7 @@ new class extends Component {
 }; ?>
 
 <div class="grid lg:grid-cols-4 gap-10">
-    <x-form wire:submit="{{ $portfolio ? 'update' : 'save' }}" class="col-span-3">
+    <x-ib-form wire:submit="{{ $portfolio ? 'update' : 'save' }}" class="col-span-3">
         <x-input label="{{ __('Title') }}" wire:model="title" required />
 
         <x-textarea label="{{ __('Notes') }}" wire:model="notes" rows="5" />
@@ -92,10 +78,10 @@ new class extends Component {
         <x-slot:actions>
             @if ($portfolio)
                 <x-button 
-                class="ms-3 btn btn-ghost text-error" 
                     wire:click="$toggle('confirmingPortfolioDeletion')" 
                     wire:loading.attr="disabled"
-                label="{{ __('Delete') }}"
+                    icon="o-trash"
+                    class="btn btn-ghost btn-circle text-error" 
                     title="{{ __('Delete Portfolio') }}"
                 />
             @endif
@@ -105,7 +91,7 @@ new class extends Component {
             @endif
             <x-button label="{{ $portfolio ? 'Update' : 'Create' }}" type="submit" icon="o-paper-airplane" class="btn-primary" spinner="save" />
         </x-slot:actions>
-    </x-form>
+    </x-ib-form>
 
     <x-confirmation-modal wire:model.live="confirmingPortfolioDeletion">
         <x-slot name="title">

resources/views/livewire/manage-transaction-form.blade.php

@@ -105,7 +105,7 @@ new class extends Component {
 }; ?>
 
 <div class="" x-data="{ transaction_type: @entangle('transaction_type') }">
-    <x-form wire:submit="{{ $transaction ? 'update' : 'save' }}" class="">
+    <x-ib-form wire:submit="{{ $transaction ? 'update' : 'save' }}" class="">
 
         @if(empty($portfolio))
 
@@ -156,10 +156,10 @@ new class extends Component {
         <x-slot:actions>
             @if ($transaction)
                 <x-button 
-                class="ms-3 btn btn-ghost text-error" 
                     wire:click="$toggle('confirmingTransactionDeletion')" 
                     wire:loading.attr="disabled"
-                label="{{ __('Delete') }}"
+                    icon="o-trash"
+                    class="btn btn-ghost btn-circle text-error" 
                     title="{{ __('Delete Transaction') }}"
                 />
             @endif
@@ -172,7 +172,7 @@ new class extends Component {
                 spinner="{{ $transaction ? 'update' : 'save' }}"
             />
         </x-slot:actions>
-    </x-form>
+    </x-ib-form>
 
     <x-confirmation-modal wire:model.live="confirmingTransactionDeletion">
         <x-slot name="title">