Fix view:cache bug (#1452)

* Fix view:cache bug * Add fail-fast * Add fail-fast
Power-Components · Mar 8, 2024 · 91d2282 · 91d2282
1 parent 8d01f53
commit 91d2282
Show file tree

Hide file tree

Showing 8 changed files with 103 additions and 99 deletions.
diff --git a/.github/workflows/code-style.yml b/.github/workflows/code-style.yml
@@ -17,6 +17,7 @@ jobs:
   build:
     runs-on: ubuntu-latest
     strategy:
+      fail-fast: false
       matrix:
         php: [ 8.2, 8.1 ]
         laravel: [ 11.*, 10.* ]

diff --git a/.github/workflows/cypress.yml b/.github/workflows/cypress.yml
@@ -38,6 +38,7 @@ jobs:
         options: --health-cmd pg_isready --health-interval 10s --health-timeout 5s --health-retries 5
 
     strategy:
+      fail-fast: false
       matrix:
         php: [ 8.2 ]
         laravel: [ 10.* ]

diff --git a/.github/workflows/mysql.yml b/.github/workflows/mysql.yml
@@ -28,6 +28,7 @@ jobs:
         options: --health-cmd="mysqladmin ping" --health-interval=10s --health-timeout=5s --health-retries=3
 
     strategy:
+      fail-fast: false
       matrix:
         php: [ 8.2, 8.1 ]
         laravel: [ 11.*, 10.* ]

diff --git a/.github/workflows/pgsql.yml b/.github/workflows/pgsql.yml
@@ -29,6 +29,7 @@ jobs:
         options: --health-cmd pg_isready --health-interval 10s --health-timeout 5s --health-retries 5
 
     strategy:
+      fail-fast: false
       matrix:
         php: [ 8.2, 8.1 ]
         laravel: [ 11.*, 10.* ]

diff --git a/.github/workflows/phpstan.yml b/.github/workflows/phpstan.yml
@@ -17,6 +17,7 @@ jobs:
   build:
     runs-on: ubuntu-latest
     strategy:
+      fail-fast: false
       matrix:
         php: [ 8.2 ]
         laravel: [ 11.*, 10.* ]

diff --git a/.github/workflows/sqlite.yml b/.github/workflows/sqlite.yml
@@ -17,6 +17,7 @@ jobs:
   build:
     runs-on: ubuntu-latest
     strategy:
+      fail-fast: false
       matrix:
         php: [ 8.2, 8.1 ]
         laravel: [ 11.*, 10.* ]

diff --git a/resources/views/livewire/performance-card.blade.php b/resources/views/livewire/performance-card.blade.php
diff --git a/src/Livewire/PerformanceCard.php b/src/Livewire/PerformanceCard.php
@@ -2,15 +2,14 @@
 
 namespace PowerComponents\LivewirePowerGrid\Livewire;
 
-use Illuminate\Contracts\View\View;
-use Illuminate\Support\Facades\Config;
+use Illuminate\Support\Facades\{Blade, Config};
 use Livewire\Attributes\Lazy;
 use PowerComponents\LivewirePowerGrid\Recorders\PowerGridPerformanceRecorder;
 
 #[Lazy]
 class PerformanceCard extends \Laravel\Pulse\Livewire\Card
 {
-    public function render(): View
+    public function render()
     {
         $config = Config::get('pulse.recorders.' . PowerGridPerformanceRecorder::class);
 
@@ -40,14 +39,100 @@ public function render(): View
             $averageQueriesTime  = $records->avg(fn ($item) => $item->queriesTimeInMs);
         }
 
-        return view(
-            'livewire-powergrid::livewire.performance-card',
-            compact(
-                'records',
-                'averageQueriesTime',
-                'averageRetrieveData',
-                'config'
-            )
-        );
+        return Blade::render(<<<blade
+            <x-pulse::card :cols="\$cols" :rows="\$rows" :class="\$class" wire:poll.5s="">
+                <x-pulse::card-header name="PowerGrid" details="10 most recent records">
+                    <x-slot:icon>⚡</x-slot:icon>
+                </x-pulse::card-header>
+
+                <x-pulse::scroll :expand="\$expand">
+                    <div class="grid grid-cols-1 gap-2">
+                        @if (\$records->isEmpty())
+                            <x-pulse::no-results />
+                        @elseif (!\$enabled)
+                            <div class="h-full flex flex-col items-center justify-center p-4">
+                                <x-pulse::icons.no-pulse class="h-8 w-8 stroke-gray-300 dark:stroke-gray-700" />
+                                <p class="mt-2 text-sm text-gray-400 dark:text-gray-600">
+                                    PowerGrid metering has been disabled.
+                                </p>
+                            </div>
+                        @else
+                            <div class="grid grid-cols-2 gap-3 text-center">
+                                <div class="flex flex-col justify-center sm:block">
+                                    <div class="font-bold text-gray-700 dark:text-gray-300 tabular-nums">
+                                        <span class="uppercase text-xl">{{ round(\$averageRetrieveData, 2) }}</span> <span class="!text-sm">ms</span>
+                                    </div>
+
+                                    <span class="text-xs uppercase font-bold text-gray-500 dark:text-gray-400">
+                                        retrieve Data
+                                    </span>
+                                </div>
+                                <div class="flex flex-col justify-center sm:block">
+                                    <div class="font-bold text-gray-700 dark:text-gray-300 tabular-nums">
+                                        <span class="uppercase text-xl">{{ round(\$averageQueriesTime, 2) }}</span> <span class="!text-sm">ms</span>
+                                    </div>
+
+                                    <span class="text-xs uppercase font-bold text-gray-500 dark:text-gray-400">
+                                        query Time
+                                    </span>
+                                </div>
+                            </div>
+                            <div>
+                                <x-pulse::table>
+                                    <colgroup>
+                                        <col />
+                                        <col />
+                                        <col />
+                                    </colgroup>
+                                    <x-pulse::thead>
+                                        <tr>
+                                            <x-pulse::th class="text-left">Table</x-pulse::th>
+                                            <x-pulse::th class="text-right">Time</x-pulse::th>
+                                            <x-pulse::th class="text-right">Query Time</x-pulse::th>
+                                            <x-pulse::th class="text-right">Total Queries</x-pulse::th>
+                                            <x-pulse::th class="text-right">Created at</x-pulse::th>
+                                        </tr>
+                                    </x-pulse::thead>
+                                    <tbody>
+                                        @foreach (\$records as \$record)
+                                            <tr wire:key="{{ \$loop->index }}-spacer" class="h-2 first:h-0"></tr>
+                                            <tr wire:key="{{ \$loop->index }}-row">
+                                                <x-pulse::td class="max-w-[1px]">
+                                                    <code class="block text-xs text-gray-900 dark:text-gray-100 truncate" title="{{ data_get(\$record, 'tableName') }}">
+                                                        {{ data_get(\$record, 'tableName') }}
+                                                    </code>
+                                                </x-pulse::td>
+                                                <x-pulse::td numeric class="text-gray-700 dark:text-gray-300 font-bold">
+                                                    {{ data_get(\$record, 'retrieveDataInMs') }} ms
+                                                </x-pulse::td>
+                                                <x-pulse::td numeric class="text-gray-700 dark:text-gray-300 font-bold">
+                                                    {{ data_get(\$record, 'queriesTimeInMs') }} ms
+                                                </x-pulse::td>
+                                                <x-pulse::td numeric class="text-gray-700 dark:text-gray-300 font-bold">
+                                                    {{ count(data_get(\$record, 'queries') ) }}
+                                                </x-pulse::td>
+                                                <x-pulse::td numeric class="text-gray-700 text-sm dark:text-gray-300 font-bold">
+
+                                                {{ \\Illuminate\Support\Carbon::createFromTimestamp(data_get(\$record, 'timestamp'))->diffForHumans() }}
+                                                </x-pulse::td>
+                                             </tr>
+                                        @endforeach
+                                    </tbody>
+                                </x-pulse::table>
+                            </div>
+                        @endif
+                    </div>
+                </x-pulse::scroll>
+            </x-pulse::card>
+        blade, [
+            'cols'                => $this->cols,
+            'rows'                => $this->rows,
+            'class'               => $this->class,
+            'expand'              => $this->expand,
+            'averageRetrieveData' => $averageRetrieveData,
+            'averageQueriesTime'  => $averageQueriesTime,
+            'records'             => $records,
+            'enabled'             => $config['enabled'],
+        ]);
     }
 }