From 5fbe1ef9d4a7a1e20ff2889e7c7cf36cc3936d2b Mon Sep 17 00:00:00 2001
From: hackerESQ <corey@coreyvarma.com>
Date: Thu, 19 Sep 2024 21:31:54 -0500
Subject: [PATCH] show dividends on apex chart

---
 .../portfolio-performance-chart.blade.php     | 22 +++++++++++++------
 1 file changed, 15 insertions(+), 7 deletions(-)

diff --git a/resources/views/livewire/portfolio-performance-chart.blade.php b/resources/views/livewire/portfolio-performance-chart.blade.php
index 69e39a0..3bdd279 100644
--- a/resources/views/livewire/portfolio-performance-chart.blade.php
+++ b/resources/views/livewire/portfolio-performance-chart.blade.php
@@ -72,10 +72,10 @@ new class extends Component {
                     'name' => __('Market Gain'),
                     'data' => $dailyChange->map(fn($data) => [$data->date, $data->total_gain])->toArray()
                 ],
-                // [
-                //     'name' => __('Dividends Earned'),
-                //     'data' => $dailyChange->map(fn($data) => [$data->date, $data->total_dividends_earned])->toArray()
-                // ],
+                [
+                    'name' => __('Dividends Earned'),
+                    'data' => $dailyChange->map(fn($data) => [$data->date, $data->total_dividends_earned])->toArray()
+                ],
                 // [
                 //     'name' => __('Realized Gains'),
                 //     'data' => $dailyChange->map(fn($data) => [$data->date, $data->realized_gains])->toArray()
@@ -108,16 +108,24 @@ new class extends Component {
             
         </div>
         
-        <div class="flex items-center">
+        <div class="flex items-center" x-data="{ loading: false }">
             {{-- <x-button title="{{ __('Reset chart') }}" icon="o-arrow-path" class="btn-ghost btn-sm btn-circle mr-2" id="chart-reset-zoom-{{ $name }}" /> --}}
 
-            <x-dropdown title="{{ __('Choose time period') }}" label="{{ $scope }}" class="btn-ghost btn-sm">
+            <x-loading x-show="loading" x-cloak class="text-gray-400 ml-2" />
+
+            <x-dropdown title="{{ __('Choose time period') }}" label="{{ $scope }}" class="btn-ghost btn-sm" x-bind:disabled="loading">
                     
                 @foreach($options as $option)
 
                     <x-menu-item 
                         title="{{ $option['name'] }}" 
-                        x-on:click="$wire.changeScope('{{ $option['id'] }}')"
+                        @click="
+                            timeout = setTimeout(() => { loading = true }, 200);
+                            $wire.changeScope('{{ $option['id'] }}').then(() => {
+                                clearTimeout(timeout);
+                                loading = false;
+                            })
+                        "
                     />
             
                 @endforeach