Chore: Upgrade to Laravel 12 + remove Mary and Jetstream dependencies (#141)

* docs: remove requirement for setting APP_KEY manually * optimize date picker * clean up modals * spot light working * reorganization * add lazy load * wip * remove filament * styling
2025-09-26 17:41:28 -05:00
parent 910d426ad4
commit e6f38d9481
146 changed files with 5443 additions and 3909 deletions
@@ -1,28 +1,27 @@
-<x-app-layout>
+<x-layouts.app>
    <div x-data>  

-        <x-ib-alpine-modal 
+        <x-ui.modal 
            key="create-transaction"
            title="{{ __('Create Transaction') }}"
        >
            @livewire('manage-transaction-form')

-        </x-ib-alpine-modal>
+        </x-ui.modal>

-        <x-ib-toolbar title="{{ __('All Transactions') }}">
+        <x-ui.toolbar title="{{ __('All Transactions') }}">

-            <x-ib-flex-spacer />
+            <x-ui.flex-spacer />
            
            <div>
-                <x-button 
+                <x-ui.button 
                    label="{{ __('Create Transaction') }}" 
                    class="btn-sm btn-primary whitespace-nowrap " 
                    @click="$dispatch('toggle-create-transaction')"
                />
            </div>
-        </x-ib-toolbar>
-
-        @livewire('transactions-table')
+        </x-ui.toolbar>

+        @livewire('datatables.transactions-table')
    </div>
-</x-app-layout>
+</x-layouts.app>
@@ -6,10 +6,10 @@ use App\Models\Portfolio;
 use App\Models\Transaction;
 use App\Rules\QuantityValidationRule;
 use App\Rules\SymbolValidationRule;
+use App\Traits\Toast;
 use App\Traits\WithTrimStrings;
 use Illuminate\Support\Collection;
 use Livewire\Volt\Component;
-use Mary\Traits\Toast;

 new class extends Component
 {
@@ -133,11 +133,11 @@ new class extends Component
 }; ?>

 <div class="" x-data="{ transaction_type: @entangle('transaction_type') }">
-    <x-ib-form wire:submit="{{ $transaction ? 'update' : 'save' }}" class="">
+    <x-ui.form wire:submit="{{ $transaction ? 'update' : 'save' }}" class="">

        @if(empty($portfolio))

-            <x-select 
+            <x-ui.select 
                label="{{ __('Portfolio') }}" 
                wire:model="portfolio_id" 
                required 
@@ -147,19 +147,19 @@ new class extends Component
            />
        @endif

-        <x-input label="{{ __('Symbol') }}" wire:model="symbol" required />
+        <x-ui.input label="{{ __('Symbol') }}" wire:model="symbol" required />

-        <x-select label="{{ __('Transaction Type') }}" :options="[
+        <x-ui.select label="{{ __('Transaction Type') }}" :options="[
            ['id' => 'BUY', 'name' => 'Buy'], 
            ['id' => 'SELL', 'name' => 'Sell']
        ]" wire:model.live="transaction_type" />
        
-        <x-datetime label="{{ __('Transaction Date') }}" wire:model="date" required />
+        <x-ui.datetime label="{{ __('Transaction Date') }}" wire:model="date" required />
        
-        <x-input label="{{ __('Quantity') }}" type="number" step="any" wire:model="quantity" required />
+        <x-ui.input label="{{ __('Quantity') }}" type="number" step="any" wire:model="quantity" required />
        
        @if($transaction_type == 'SELL')
-            <x-input 
+            <x-ui.input 
                label="{{ __('Sale Price') }}" 
                wire:model.number="sale_price" 
                required 
@@ -168,7 +168,7 @@ new class extends Component
            >
                <x-slot:prepend>
                    
-                    <x-select 
+                    <x-ui.select 
                        class="rounded-e-none border-e-0 bg-base-200"
                        icon="o-banknotes"
                        :options="$currencies"
@@ -178,9 +178,9 @@ new class extends Component
                        id="currency"
                    />
                </x-slot:prepend>
-            </x-input>
+            </x-ui.input>
        @else
-            <x-input 
+            <x-ui.input 
                label="{{ __('Cost Basis') }}" 
                wire:model.number="cost_basis" 
                required 
@@ -189,7 +189,7 @@ new class extends Component
            >
                <x-slot:prepend>

-                    <x-select 
+                    <x-ui.select 
                        class="rounded-e-none border-e-0 bg-base-200"
                        icon="o-banknotes"
                        :options="$currencies"
@@ -200,12 +200,12 @@ new class extends Component
                    />
                </x-slot:prepend>
             
-            </x-input>
+            </x-ui.input>
        @endif

        <x-slot:actions>
            @if ($transaction)
-                <x-button 
+                <x-ui.button 
                    wire:click="$toggle('confirmingTransactionDeletion')" 
                    wire:loading.attr="disabled"
                    class="btn text-error" 
@@ -214,7 +214,7 @@ new class extends Component
                />
            @endif

-            <x-button 
+            <x-ui.button 
                label="{{ $transaction ? __('Update') : __('Create') }}" 
                type="submit" 
                icon="o-paper-airplane" 
@@ -222,9 +222,9 @@ new class extends Component
                spinner="{{ $transaction ? 'update' : 'save' }}"
            />
        </x-slot:actions>
-    </x-ib-form>
+    </x-ui.form>

-    <x-confirmation-modal wire:model.live="confirmingTransactionDeletion">
+    <x-ui.confirmation-modal wire:model.live="confirmingTransactionDeletion">
        <x-slot name="title">
            {{ __('Delete Transaction') }}
        </x-slot>
@@ -234,13 +234,13 @@ new class extends Component
        </x-slot>

        <x-slot name="footer">
-            <x-button class="btn-outline" wire:click="$toggle('confirmingTransactionDeletion')" wire:loading.attr="disabled">
+            <x-ui.button class="btn-outline" wire:click="$toggle('confirmingTransactionDeletion')" wire:loading.attr="disabled">
                {{ __('Cancel') }}
-            </x-secondary-button>
+            </x-ui.button>

-            <x-button class="ms-3 btn-error text-white" wire:click="delete" wire:loading.attr="disabled">
+            <x-ui.button class="ms-3 btn-error text-white" wire:click="delete" wire:loading.attr="disabled">
                {{ __('Delete Transaction') }}
-            </x-button>
+            </x-ui.button>
        </x-slot>
-    </x-confirmation-modal>
+    </x-ui.confirmation-modal>
 </div>
@@ -2,11 +2,11 @@

 use App\Models\Portfolio;
 use App\Models\Transaction;
+use App\Traits\Toast;
 use Illuminate\Support\Collection;
 use Livewire\Volt\Component;
-use Mary\Traits\Toast;

-new class extends Component
+new class extends Component 
 {
    use Toast;

@@ -47,7 +47,7 @@ new class extends Component

    public function goToHolding($holding)
    {
-        return $this->redirect(route('holding.show', ['portfolio' => $holding['portfolio_id'], 'symbol' => $holding['symbol']]));
+        return $this->redirect(route('holding.show', ['portfolio' => $holding['portfolio_id'], 'symbol' => $holding['symbol']]), navigate: true);
    }

    public function updateOffset($amount = 0)
@@ -60,7 +60,7 @@ new class extends Component

    @foreach($transactions->sortByDesc('date')->slice($offset)->take($perPage) as $transaction)

-        <x-list-item 
+        <x-ui.list-item 
            no-separator 
            :item="$transaction" 
            class="cursor-pointer"
@@ -69,7 +69,7 @@ new class extends Component
            @click="
                if ($wire.shouldGoToHolding) {

-                    $wire.goToHolding({{ $transaction }})
+                    $wire.goToHolding(JSON.parse('{{ json_encode($transaction->only(['portfolio_id', 'symbol'])) }}'))
                    
                    return;
                }
@@ -81,7 +81,7 @@ new class extends Component
            "
        >
            <x-slot:value class="flex items-center">
-                <x-badge 
+                <x-ui.badge 
                    :value="$transaction->split
                        ? 'SPLIT'
                        : ($transaction->reinvested_dividend
@@ -100,7 +100,7 @@ new class extends Component
                    $transaction->market_data?->currency
                ) }})

-                <x-loading x-show="loading" x-cloak class="text-gray-400 ml-2" />
+                <x-ui.loading x-show="loading" x-cloak class="text-gray-400 ml-2" />
            </x-slot:value>
            <x-slot:sub-value>
                @if($showPortfolio)
@@ -109,7 +109,7 @@ new class extends Component
                @endif
                <span title="{{ __('Transaction Date') }}">{{ $transaction->date->format('F j, Y') }} </span>
            </x-slot:sub-value>
-        </x-list-item>
+        </x-ui.list-item>

    @endforeach

@@ -118,30 +118,30 @@ new class extends Component
            
            <span>
                @if($offset > 0)
-                <x-button 
+                <x-ui.button 
                    class="btn btn-sm btn-ghost text-secondary"
                    wire:click="updateOffset(-{{ $perPage }})"
                >
                    {!! __('pagination.previous') !!}
-                </x-button>
+                </x-ui.button>
                @endif
            </span>

            <span>
                @if(count($transactions) - $offset >  $offset)
-                <x-button 
+                <x-ui.button 
                    class="btn btn-sm btn-ghost text-secondary"
                    wire:click="updateOffset({{ $perPage }})"
                >
                    {!! __('pagination.next') !!}
-                </x-button>
+                </x-ui.button>
                @endif
            </span>
            
        </div>
    @endif

-    <x-ib-alpine-modal 
+    <x-ui.modal 
        key="manage-transaction"
        title="{{ __('Manage Transaction') }}"
    >
@@ -150,5 +150,5 @@ new class extends Component
            'transaction' => $editingTransaction, 
        ], key($editingTransaction?->id.rand()))

-    </x-ib-alpine-modal>
-</div>
+    </x-ui.modal>
+</div>
@@ -1,124 +0,0 @@
-<?php
-
-use App\Models\Transaction;
-use App\Models\User;
-use Livewire\Volt\Component;
-use Livewire\WithPagination;
-use App\Models\Currency;
-
-new class extends Component
-{
-    use WithPagination;
-
-    // props
-    public User $user;
-
-    public ?Transaction $editingTransaction;
-
-    protected $listeners = [
-        'transaction-updated' => '$refresh',
-        'transaction-saved' => '$refresh',
-    ];
-
-    public array $sortBy = ['column' => 'date', 'direction' => 'desc'];
-
-    public array $headers;
-
-    // methods
-    public function goToHolding($holding)
-    {
-        return $this->redirect(route('holding.show', ['portfolio' => $holding['portfolio_id'], 'symbol' => $holding['symbol']]));
-    }
-
-    public function mount()
-    {
-        $this->headers = [
-            ['key' => 'date', 'label' => __('Date'), 'sortable' => true],
-            ['key' => 'portfolio_title', 'label' => __('Portfolio')],
-            ['key' => 'symbol', 'label' => __('Symbol'), 'class' => ''],
-            ['key' => 'market_data_name', 'label' => __('Name')],
-            ['key' => 'transaction_type', 'label' => __('Type')],
-            ['key' => 'split', 'label' => __('Split')],
-            ['key' => 'quantity', 'label' => __('Quantity')],
-            ['key' => 'cost_basis', 'label' => __('Cost Basis')],
-            ['key' => 'gain_dollars', 'label' => __('Gain/Loss')],
-        ];
-    }
-
-    public function transactions()
-    {
-        return auth()
-            ->user()
-            ->transactions()
-            ->orderBy(...array_values($this->sortBy))
-            ->paginate(10);
-    }
-}; ?>
-
-<div class="">
-    
-    <x-table 
-        :headers="$headers" 
-        :rows="$this->transactions()" 
-        x-data="{ loadingId: null, timeout: null }"
-        @row-click="
-            timeout = setTimeout(() => { loadingId = $event.detail.id }, 200);
-            $wire.goToHolding($event.detail).then(() => {
-                clearTimeout(timeout);
-                loadingId = null;
-            })
-        "
-        :sort-by="$sortBy" 
-        with-pagination
-    >
-        @scope('cell_symbol', $row)
-            <span class="flex">
-                {{ $row->symbol }}
-                <x-loading x-show="loadingId === '{{ $row->id }}'" x-cloak class="text-gray-400 ml-2" />
-            </span>
-        @endscope
-        @scope('cell_date', $row)
-            {{ $row->date->format('M d, Y') }}
-        @endscope
-        @scope('cell_split', $row)
-            {{ $row->split ? __('Yes') : '' }}
-        @endscope
-        @scope('cell_transaction_type', $row)
-            <x-badge 
-                :value="$row->split
-                        ? 'SPLIT'
-                        : ($row->reinvested_dividend
-                            ? 'REINVEST' 
-                            : $row->transaction_type)" 
-                class="{{ $row->transaction_type == 'BUY' 
-                    ? 'badge-success' 
-                    : 'badge-error' }} badge-sm mr-3" 
-            />
-        @endscope
-        @scope('cell_cost_basis', $row)
-            {{ Number::currency($row->cost_basis ?? 0, $row->market_data->currency) }}
-        @endscope
-        @scope('cell_total_cost_basis', $row)
-            {{ Number::currency($row->total_cost_basis ?? 0, $row->market_data->currency) }}
-        @endscope
-        @scope('cell_gain_dollars', $row)
-            {{ Number::currency($row->gain_dollars ?? 0, $row->market_data->currency) }}
-        @endscope
-        @scope('cell_market_data_market_value', $row)
-            {{ Number::currency($row->market_data_market_value ?? 0, $row->market_data->currency) }}
-        @endscope
-        @scope('cell_total_market_value', $row)
-            {{ Number::currency($row->total_market_value ?? 0, $row->market_data->currency) }}
-        @endscope
-    </x-table>
-
-    <x-ib-alpine-modal 
-        key="manage-transaction"
-        title="Manage Transaction"
-    >
-        @livewire('manage-transaction-form', [
-            'transaction' => $editingTransaction, 
-        ], key($editingTransaction->id ?? 'new'))
-
-    </x-ib-alpine-modal>
-</div>