chore: merge blocks page redesign into develop (#517)

ArdentHQ · Sep 4, 2023 · 4287b14 · 4287b14
2 parents 5a2f302 + 394da62
commit 4287b14
Show file tree

Hide file tree

Showing 35 changed files with 875 additions and 193 deletions.
diff --git a/app/Http/Controllers/BlocksController.php b/app/Http/Controllers/BlocksController.php
@@ -0,0 +1,51 @@
+<?php
+
+declare(strict_types=1);
+
+namespace App\Http\Controllers;
+
+use App\Models\ForgingStats;
+use App\Services\BigNumber;
+use App\Services\Timestamp;
+use Carbon\Carbon;
+use Illuminate\Contracts\View\View;
+use Illuminate\Support\Facades\Cache;
+use Illuminate\Support\Facades\DB;
+
+final class BlocksController
+{
+    public const STATS_TTL = 300;
+
+    public function __invoke(): View
+    {
+        $data = $this->blockData();
+
+        return view('app.blocks', [
+            'forgedCount'   => $data['block_count'],
+            'missedCount'   => $data['missed_count'],
+            'totalRewards'  => BigNumber::new($data['total_rewards'])->toFloat(),
+            'largestAmount' => BigNumber::new($data['largest_amount'])->toFloat(),
+        ]);
+    }
+
+    private function blockData(): array
+    {
+        return Cache::remember('blocks:stats', self::STATS_TTL, function () {
+            $timestamp = Timestamp::fromUnix(Carbon::now()->subDays(1)->unix())->unix();
+            $data      = (array) DB::connection('explorer')
+                ->table('blocks')
+                ->selectRaw('COUNT(*) as block_count')
+                ->selectRaw('SUM(reward) as total_rewards')
+                ->selectRaw('MAX(total_amount) as largest_amount')
+                ->where('timestamp', '>', $timestamp)
+                ->first();
+
+            return [
+                'block_count'    => $data['block_count'],
+                'missed_count'   => ForgingStats::missed()->where('timestamp', '>', $timestamp)->count(),
+                'total_rewards'  => $data['total_rewards'] ?? 0,
+                'largest_amount' => $data['largest_amount'] ?? 0,
+            ];
+        });
+    }
+}
diff --git a/app/Http/Livewire/BlockTable.php b/app/Http/Livewire/BlockTable.php
@@ -4,44 +4,65 @@
 
 namespace App\Http\Livewire;
 
+use App\Http\Livewire\Concerns\DeferLoading;
+use App\Http\Livewire\Concerns\HasTablePagination;
 use App\Models\Block;
 use App\Models\Scopes\OrderByTimestampScope;
 use App\ViewModels\ViewModelFactory;
-use ARKEcosystem\Foundation\UserInterface\Http\Livewire\Concerns\HasPagination;
 use Illuminate\Pagination\LengthAwarePaginator;
 use Illuminate\View\View;
 use Livewire\Component;
 
+/**
+ * @property LengthAwarePaginator $blocks
+ * */
 final class BlockTable extends Component
 {
-    use HasPagination;
-
-    public const PER_PAGE = 15;
+    use DeferLoading;
+    use HasTablePagination;
 
     /** @var mixed */
-    protected $listeners = ['currencyChanged' => '$refresh'];
+    protected $listeners = [
+        'currencyChanged' => '$refresh',
+    ];
 
     public function render(): View
     {
+        return view('livewire.block-table', [
+            'blocks' => ViewModelFactory::paginate($this->blocks),
+        ]);
+    }
+
+    public function getNoResultsMessageProperty(): null|string
+    {
+        if ($this->blocks->total() === 0) {
+            return trans('tables.blocks.no_results.no_results');
+        }
+
+        return null;
+    }
+
+    public function getBlocksProperty(): LengthAwarePaginator
+    {
+        if (! $this->isReady) {
+            return new LengthAwarePaginator([], 0, $this->perPage);
+        }
+
         /** @var Block $lastBlock */
         $lastBlock = Block::withScope(OrderByTimestampScope::class)->first();
 
         $lastBlockHeight = $lastBlock->height->toNumber();
-        $heightTo        = $lastBlockHeight - (self::PER_PAGE * ($this->page - 1));
-        $heightFrom      = $heightTo - self::PER_PAGE;
+        $heightTo        = $lastBlockHeight - ($this->perPage * ($this->page - 1));
+        $heightFrom      = $heightTo - $this->perPage;
 
         $blocks = Block::withScope(OrderByTimestampScope::class)
             ->where('height', '<=', $heightTo)
             ->where('height', '>', $heightFrom)
             ->get();
 
-        $blocks = new LengthAwarePaginator($blocks, $lastBlockHeight, self::PER_PAGE, $this->page, [
+        return new LengthAwarePaginator($blocks, $lastBlockHeight, $this->perPage, $this->page, [
             'path'     => route('blocks'),
             'pageName' => 'page',
         ]);
-
-        return view('livewire.block-table', [
-            'blocks' => ViewModelFactory::paginate($blocks),
-        ]);
     }
 }
diff --git a/app/Models/ForgingStats.php b/app/Models/ForgingStats.php
@@ -5,6 +5,7 @@
 namespace App\Models;
 
 use App\Models\Concerns\SearchesCaseInsensitive;
+use Illuminate\Database\Eloquent\Builder;
 use Illuminate\Database\Eloquent\Factories\HasFactory;
 use Illuminate\Database\Eloquent\Model;
 use Illuminate\Database\Eloquent\Relations\BelongsTo;
@@ -62,4 +63,14 @@ public function delegate(): BelongsTo
     {
         return $this->belongsTo(Wallet::class, 'public_key', 'public_key');
     }
+
+    /**
+     * Get all missed forging stats.
+     *
+     * @return Builder
+     */
+    public function scopeMissed(Builder $query): Builder
+    {
+        return $query->whereNot('missed_height', null);
+    }
 }
diff --git a/public/css/app.css b/public/css/app.css
diff --git a/public/mix-manifest.json b/public/mix-manifest.json
@@ -2,7 +2,7 @@
     "/js/app.js": "/js/app.js?id=cf1b8003d8f40ae1e4e2638ef03154c5",
     "/js/clipboard.js": "/js/clipboard.js?id=80d900f861e2aacb0e23e914068d0de9",
     "/js/manifest.js": "/js/manifest.js?id=bf375adc4a6d48ff1f208128c5b5b26f",
-    "/css/app.css": "/css/app.css?id=e92a61d3a3cbdc73f0610a6b5d5899f5",
+    "/css/app.css": "/css/app.css?id=851c4dbfad1b63127c81c10158f53cd0",
     "/js/vendor.js": "/js/vendor.js?id=6fa3da52b5adff55cb2d09788ef52158",
     "/images/delegates/header-bg-dark.svg": "/images/delegates/header-bg-dark.svg?id=0fc9d2cfbec09d702832f3bd81fae169",
     "/images/delegates/header-bg-mobile-dark.svg": "/images/delegates/header-bg-mobile-dark.svg?id=a60884230a85d1b8bb5f35e9a65f81cc",

diff --git a/resources/lang/en/pages.php b/resources/lang/en/pages.php
@@ -407,7 +407,12 @@
     ],
 
     'blocks'           => [
-        'title' => 'Blocks',
+        'title'               => 'Blocks',
+        'subtitle'            => 'List of blocks on the :network',
+        'blocks_produced_24h' => 'Blocks Produced (24h)',
+        'missed_blocks_24h'   => 'Missed Blocks (24h)',
+        'block_rewards_24h'   => 'Block Rewards (24h)',
+        'largest_block_24h'   => 'Largest Block (24h)',
     ],
 
     'statistics'       => [

diff --git a/resources/lang/en/tables.php b/resources/lang/en/tables.php
@@ -27,6 +27,7 @@
 
     'blocks' => [
         'height'       => 'Block Height',
+        'generated_by' => 'Generated By',
         'age'          => 'Age',
         'transactions' => 'Transactions',
         'volume'       => 'Volume (:currency)',

diff --git a/resources/views/app/blocks.blade.php b/resources/views/app/blocks.blade.php
@@ -0,0 +1,16 @@
+@component('layouts.app')
+    <x-metadata page="blocks" />
+
+    @section('content')
+        <x-page-headers.blocks
+            :forged-count="$forgedCount"
+            :missed-count="$missedCount"
+            :total-rewards="$totalRewards"
+            :largest-amount="$largestAmount"
+        />
+
+        <div class="px-6 pt-6 pb-8 border-t-4 md:px-10 md:pt-0 md:pb-6 md:mx-auto md:max-w-7xl md:border-0 border-theme-secondary-200 dark:border-theme-dark-950">
+            <livewire:block-table />
+        </div>
+    @endsection
+@endcomponent
diff --git a/resources/views/blocks.blade.php b/resources/views/blocks.blade.php
diff --git a/resources/views/components/page-headers/blocks.blade.php b/resources/views/components/page-headers/blocks.blade.php
@@ -0,0 +1,19 @@
+@props([
+    'forgedCount',
+    'missedCount',
+    'totalRewards',
+    'largestAmount',
+])
+
+<x-page-headers.generic
+    :title="trans('pages.blocks.title')"
+    :subtitle="trans('pages.blocks.subtitle', ['network' => Network::name()])"
+    class="md:pb-3"
+>
+    <div class="grid flex-1 grid-cols-1 gap-2 w-full sm:grid-cols-2 md:gap-3 xl:grid-cols-4">
+        <x-page-headers.blocks.blocks-produced :count="$forgedCount" />
+        <x-page-headers.blocks.missed-blocks :count="$missedCount" />
+        <x-page-headers.blocks.block-rewards :rewards="$totalRewards" />
+        <x-page-headers.blocks.largest-block :amount="$largestAmount" />
+    </div>
+</x-page-headers.generic>
diff --git a/resources/views/components/page-headers/blocks/block-rewards.blade.php b/resources/views/components/page-headers/blocks/block-rewards.blade.php
@@ -0,0 +1,10 @@
+@props(['rewards'])
+
+<x-page-headers.header-item
+    :title="trans('pages.blocks.block_rewards_24h')"
+    :attributes="$attributes"
+>
+    <span>
+        {{ ExplorerNumberFormatter::currency($rewards, Network::currency()) }}
+    </span>
+</x-page-headers.header-item>
diff --git a/resources/views/components/page-headers/blocks/blocks-produced.blade.php b/resources/views/components/page-headers/blocks/blocks-produced.blade.php
@@ -0,0 +1,10 @@
+@props(['count'])
+
+<x-page-headers.header-item
+    :title="trans('pages.blocks.blocks_produced_24h')"
+    :attributes="$attributes"
+>
+    <span>
+        <x-number>{{ $count }}</x-number>
+    </span>
+</x-page-headers.header-item>
diff --git a/resources/views/components/page-headers/blocks/largest-block.blade.php b/resources/views/components/page-headers/blocks/largest-block.blade.php
@@ -0,0 +1,10 @@
+@props(['amount'])
+
+<x-page-headers.header-item
+    :title="trans('pages.blocks.largest_block_24h')"
+    :attributes="$attributes"
+>
+    <span>
+        {{ ExplorerNumberFormatter::currency($amount, Network::currency()) }}
+    </span>
+</x-page-headers.header-item>
diff --git a/resources/views/components/page-headers/blocks/missed-blocks.blade.php b/resources/views/components/page-headers/blocks/missed-blocks.blade.php
@@ -0,0 +1,10 @@
+@props(['count'])
+
+<x-page-headers.header-item
+    :title="trans('pages.blocks.missed_blocks_24h')"
+    :attributes="$attributes"
+>
+    <span>
+        <x-number>{{ $count }}</x-number>
+    </span>
+</x-page-headers.header-item>
diff --git a/resources/views/components/skeletons/blocks.blade.php b/resources/views/components/skeletons/blocks.blade.php
@@ -1,15 +1,26 @@
-<x-loading.visible>
-    @isset($withoutGenerator)
-        <x-tables.desktop.skeleton.blocks without-generator />
+@props([
+    'rowCount' => 10,
+])
 
-        <x-tables.mobile.skeleton.blocks without-generator />
-    @else
-        <x-tables.desktop.skeleton.blocks />
+@if (! $this->isReady)
+    <div wire:key="skeleton:blocks:not-ready">
+        <x-tables.desktop.skeleton.blocks :row-count="$rowCount" />
 
         <x-tables.mobile.skeleton.blocks />
-    @endif
-</x-loading.visible>
+    </div>
+@else
+    <x-loading.visible
+        wire:key="skeleton:blocks:ready"
+        display-type="block"
+    >
+        <x-tables.desktop.skeleton.blocks :row-count="$rowCount" />
 
-<x-loading.hidden>
-    {{ $slot }}
-</x-loading.hidden>
+        <x-tables.mobile.skeleton.blocks />
+    </x-loading.visible>
+
+    <div wire:key="skeleton:blocks:hidden">
+        <x-loading.hidden>
+            {{ $slot }}
+        </x-loading.hidden>
+    </div>
+@endif