Recent boards real time (#32)

Add recent boards real time functionality on client side. Showing most recent boards connections with their IP in case they are active and last seen field in case they are offline. * Every request updated last seen an IP field for the board * Every session listened from client side updates the same fields each time board sends information
zoftko · Nov 4, 2023 · d2bf972 · d2bf972
1 parent 74862de
commit d2bf972
Show file tree

Hide file tree

Showing 7 changed files with 115 additions and 45 deletions.
diff --git a/app/Http/Livewire/RecentBoards.php b/app/Http/Livewire/RecentBoards.php
@@ -0,0 +1,48 @@
+<?php
+
+namespace App\Http\Livewire;
+
+use App\Models\Board;
+use Illuminate\Support\Collection;
+use Illuminate\View\View;
+use Livewire\Component;
+
+/** @property-read Collection<array> $recentBoards*/
+class RecentBoards extends Component
+{
+    public Collection $recentBoards;
+
+    public function updateRecentBoards(): void
+    {
+        $boards = Board::orderBy('last_seen', 'desc')->limit(4)->get();
+        $this->recentBoards = $boards->map(function ($b) {
+            $active = true;
+            $last_seen = $b->last_seen ?? false;
+            if ($last_seen and now()->diffInSeconds($last_seen) > 15) {
+                $active = false;
+            }
+
+            return [
+                'active' => $active,
+                'name' => $b->name,
+                'uuid' => $b->uuid,
+                'ip' => $b->ip,
+                'last_seen' => $b->last_seen,
+            ];
+        });
+    }
+
+    public function mount(): void
+    {
+        $this->recentBoards = collect();
+    }
+
+    public function render(): view
+    {
+        $this->updateRecentBoards();
+
+        return view('livewire.recent-boards', [
+            'recentBoards' => $this->recentBoards,
+        ]);
+    }
+}
diff --git a/app/Http/Middleware/AuthenticateBoard.php b/app/Http/Middleware/AuthenticateBoard.php
@@ -41,6 +41,11 @@ public function handle(Request $request, Closure $next): Response
         }
         app()->instance(Board::class, $board);
 
+        $board->update([
+            'ip' => $request->ip(),
+            'last_seen' => now(),
+        ]);
+
         return $next($request);
     }
 }
diff --git a/app/Models/Board.php b/app/Models/Board.php
@@ -37,6 +37,11 @@ class Board extends Model
 {
     use HasFactory;
 
+    protected $fillable = [
+        'ip',
+        'last_seen',
+    ];
+
     public function setUuidAttribute(string $value): void
     {
         $this->attributes['uuid'] = strtoupper($value);

diff --git a/bootstrap/helpers.php b/bootstrap/helpers.php
@@ -21,14 +21,19 @@ function rcAddMeasurement(Collection &$measurements, int $sessionID, float $temp
 }
 
 if (! function_exists('rcSaveMeasurements')) {
-    function rcSaveMeasurements(Collection &$measurements, int $sleepTime, ProgressBar &$progress): void
+    function rcSaveMeasurements(&$board, string $ip, Collection &$measurements, int $sleepTime, ProgressBar &$progress): void
     {
         if ($measurements->count() == 10) {
             $measurements->map(function ($measurement) {
                 Measurement::create($measurement);
             });
             $measurements = collect();
             $progress->advance(10);
+
+            $board->update([
+                'ip' => $ip,
+                'last_seen' => now(),
+            ]);
             sleep($sleepTime);
         }
     }

diff --git a/resources/views/dashboard.blade.php b/resources/views/dashboard.blade.php
@@ -62,47 +62,9 @@
         <div class="max-w-8xl mx-auto sm:px-6 lg:px-8 mb-3">
             <div class="grid md:grid-cols-2 gap-6 sm:rounded-lg">
                 {{-- Boards --}}
-                <div class="grid sm:grid-cols-2 gap-6 sm:rounded-lg">
-                    @forelse($recentBoards as $b)
-                        <div class="
-                             min-h-[100px] bg-center bg-cover bg-no-repeat rounded-lg p-2
-                             shadow-[0_0_5px_1px_rgba(255,255,255,0.3)] dark:text-white boardBox
-                             transition-all duration-150 transform hover:scale-105 cursor-pointer
-                             bg-white dark:bg-gray-800
-                             "
-                        >
-                                <header class="grid grid-cols-6 items-center">
-                                    <p class="col-span-4 text-xl">{{$b['name']}}</p>
-                                    <div class="col-span-2 flex justify-end align-middle text-white">
-                                        <span class="text-sm h-fit py-[2px] px-[7px] rounded-lg bg-green-600">Active</span>
-                                    </div>
-                                </header>
-                                <hr class="mt-2">
-                                <p class="mt-3 text-sm">{{$b['uuid']}}</p>
-                                <p class="mb-2 text-sm">IP: {{$b['ip']}}</p>
-                        </div>
-                    @empty
-                        <div class="
-                         min-h-[100px] bg-center bg-cover bg-no-repeat rounded-lg p-2
-                         shadow-[0_0_5px_1px_rgba(255,255,255,0.3)] dark:text-white boardBox
-                         transition-all duration-150 transform hover:scale-105 cursor-pointer
-                         bg-white dark:bg-gray-800
-                         "
-                        >
-                            <header class="grid grid-cols-6 items-center">
-                                <p class="col-span-4 text-xl">NO BOARDS</p>
-                                <div class="col-span-2 flex justify-end align-middle text-white">
-                                    <span class="text-sm h-fit py-[2px] px-[7px] rounded-lg bg-red-500">Inactive</span>
-                                </div>
-                            </header>
-                            <hr class="mt-2">
-                            <p class="mt-3 text-sm">{{$b->uuid}}</p>
-                            <p class="mb-2 text-sm">IP: {{$b->ip}}</p>
-                        </div>
-                    @endforelse
-                </div>
+                @livewire("recent-boards")
                 {{-- Current session --}}
-                @livewire('active-session')
+                @livewire("active-session")
             </div>
         </div>
 

diff --git a/resources/views/livewire/recent-boards.blade.php b/resources/views/livewire/recent-boards.blade.php
@@ -0,0 +1,40 @@
+<div class="grid sm:grid-cols-2 gap-6 sm:rounded-lg">
+    <div wire:poll="updateRecentBoards" class="hidden"></div>
+    @forelse($recentBoards as $b)
+        <div class="
+                             min-h-[100px] bg-center bg-cover bg-no-repeat rounded-lg p-2
+                             shadow-[0_0_5px_1px_rgba(255,255,255,0.3)] dark:text-white boardBox
+                             transition-all duration-150 transform hover:scale-105 cursor-pointer
+                             bg-white dark:bg-gray-800
+                             "
+        >
+            <header class="grid grid-cols-6 items-center">
+                <p class="col-span-4 text-xl">{{$b['name']}}</p>
+                <div class="col-span-2 flex justify-end align-middle text-white">
+                    @if($b['active'])
+                        <span class="text-sm h-fit py-[2px] px-[7px] rounded-lg bg-green-600">Active</span>
+                    @else
+                        <span class="text-sm h-fit py-[2px] px-[7px] rounded-lg bg-red-500">Inactive</span>
+                    @endif
+                </div>
+            </header>
+            <hr class="mt-2">
+            <p class="mt-3 text-sm">{{$b['uuid']}}</p>
+            @if($b['active'])
+                <p class="mb-2 text-sm">IP: {{$b['ip']}}</p>
+            @else
+                <p class="mb-2 text-sm">Last seen: {{$b['last_seen']}}</p>
+            @endif
+        </div>
+    @empty
+        <div class="
+                         flex justify-center min-h-[100px] rounded-lg p-2 col-span-2
+                         shadow-[0_0_5px_1px_rgba(255,255,255,0.3)] dark:text-white
+                         transition-all duration-150 transform hover:scale-105 cursor-pointer
+                         bg-white dark:bg-gray-800
+                         "
+        >
+            <p class="col-span-4 text-xl my-auto">No boards added yet. Go to Boards menu to register</p>
+        </div>
+    @endforelse
+</div>
diff --git a/routes/console.php b/routes/console.php
@@ -29,6 +29,7 @@
  */
 Artisan::command('reflow {soakTemperature} {soakTime} {reflowPeakTemp} {sleepTime?} {reflowMaxTime?}', function ($soakTemperature, $soakTime, $reflowPeakTemp, $sleepTime = 10, $reflowMaxTime = 80) {
     $board = Board::inRandomOrder()->limit(1)->first();
+    $ip = fake()->ipv4();
 
     $progress = $this->getOutput()->createProgressBar($soakTime + $reflowPeakTemp + $soakTemperature);
     $progress->setFormat("%message%\n %current%/%max% [%bar%] %percent:3s%%\n");
@@ -42,6 +43,10 @@
         'reflow_peak_temp' => $reflowPeakTemp,
         'reflow_max_time' => $reflowMaxTime,
     ]);
+    $board->update([
+        'ip' => $ip,
+        'last_seen' => now(),
+    ]);
 
     $temp = 20;
     $measurements = collect();
@@ -51,30 +56,30 @@
     $progress->setMessage('Starting raising to soak temperature...');
     while ($temp < $soakTemperature) {
         rcAddMeasurement($measurements, $session->id, $temp, $sequence++);
-        rcSaveMeasurements($measurements, $sleepTime, $progress);
+        rcSaveMeasurements($board, $ip, $measurements, $sleepTime, $progress);
         $temp += mt_rand(5, 25) / 10;
     }
 
     //Now we make soak time
     $progress->setMessage('Keep on soak time...');
     for ($seconds = 0; $seconds <= $soakTime; $seconds++, $sequence++) {
         rcAddMeasurement($measurements, $session->id, $temp, $sequence);
-        rcSaveMeasurements($measurements, $sleepTime, $progress);
+        rcSaveMeasurements($board, $ip, $measurements, $sleepTime, $progress);
     }
 
     // Ramp up gradient to peak
     $progress->setMessage('Ramp up to reflow peak temperature...');
     while ($temp < $reflowPeakTemp) {
         rcAddMeasurement($measurements, $session->id, $temp, $sequence++);
-        rcSaveMeasurements($measurements, $sleepTime, $progress);
+        rcSaveMeasurements($board, $ip, $measurements, $sleepTime, $progress);
         $temp += mt_rand(10, 25) / 10;
     }
 
     //Cool down ramp
     $progress->setMessage('Cooling down...');
     while ($temp > 50) {
         rcAddMeasurement($measurements, $session->id, $temp, $sequence++);
-        rcSaveMeasurements($measurements, $sleepTime, $progress);
+        rcSaveMeasurements($board, $ip, $measurements, $sleepTime, $progress);
         $temp -= mt_rand(20, 40) / 10;
     }
     $progress->finish();