From 8de4623e06a1909e8790f6f045b0ad98fac9f82d Mon Sep 17 00:00:00 2001 From: PatStiles Date: Mon, 16 Dec 2024 19:27:40 -0300 Subject: [PATCH 1/6] add optional header to table card + pass in external css class trait --- .../explorer_web/live/pages/batches/index.html.heex | 13 +++++++++++++ 1 file changed, 13 insertions(+) diff --git a/explorer/lib/explorer_web/live/pages/batches/index.html.heex b/explorer/lib/explorer_web/live/pages/batches/index.html.heex index 26ce5ac2ee..f4f4a0ecc8 100644 --- a/explorer/lib/explorer_web/live/pages/batches/index.html.heex +++ b/explorer/lib/explorer_web/live/pages/batches/index.html.heex @@ -2,6 +2,19 @@ <.card_preheding>Batches <%= if @batches != :empty and @batches != [] do %> <.table id="batches" rows={@batches}> + <:header> + <.link + href="https://docs.alignedlayer.com/guides/6_contract_addresses" + class="absolute top-4 right-5 hover:underline font-medium text-muted-foreground capitalize text-sm" + target="_blank" + rel="noopener noreferrer" + > + View All <.icon name="hero-arrow-top-right-on-square-solid" class="size-3.5 mb-1" /> + +

+ <.icon name="hero-cpu-chip" class="size-4 mb-0.5" /> Service Manager: +

+ <:col :let={batch} label="Batch Hash" class="text-left"> <.link navigate={~p"/batches/#{batch.merkle_root}"}> From 1faea67d64a4f262f77a0aa37c71232285f2d180 Mon Sep 17 00:00:00 2001 From: PatStiles Date: Mon, 16 Dec 2024 19:46:21 -0300 Subject: [PATCH 2/6] add recent batches --- .../components/core_components.ex | 5 +- .../lib/explorer_web/live/pages/home/index.ex | 4 -- .../live/pages/home/index.html.heex | 48 ++++++++++++------- 3 files changed, 35 insertions(+), 22 deletions(-) diff --git a/explorer/lib/explorer_web/components/core_components.ex b/explorer/lib/explorer_web/components/core_components.ex index a8d529d376..19974580f5 100644 --- a/explorer/lib/explorer_web/components/core_components.ex +++ b/explorer/lib/explorer_web/components/core_components.ex @@ -713,6 +713,7 @@ defmodule ExplorerWeb.CoreComponents do attr(:rows, :list, required: true) attr(:row_id, :any, default: nil, doc: "the function for generating the row id") attr(:row_click, :any, default: nil, doc: "the function for handling phx-click on each row") + attr(:class, :any, default: nil, doc: "css class attributes for the card background") attr(:row_item, :any, default: &Function.identity/1, @@ -725,6 +726,7 @@ defmodule ExplorerWeb.CoreComponents do end slot(:action, doc: "the slot for showing user actions in the last table column") + slot(:header, default: nil, doc: "optional header for the table") def table(assigns) do assigns = @@ -733,7 +735,8 @@ defmodule ExplorerWeb.CoreComponents do end ~H""" - <.card_background class="overflow-x-auto"> + <.card_background class={classes(["overflow-x-auto", @class])}> + <%= render_slot(@header) %> diff --git a/explorer/lib/explorer_web/live/pages/home/index.ex b/explorer/lib/explorer_web/live/pages/home/index.ex index a28f1c937e..c1dd1ebf80 100644 --- a/explorer/lib/explorer_web/live/pages/home/index.ex +++ b/explorer/lib/explorer_web/live/pages/home/index.ex @@ -10,8 +10,6 @@ defmodule ExplorerWeb.Home.Index do latest_batches = Batches.get_latest_batches(%{amount: 5}) - # extract only the merkle root - |> Enum.map(fn %Batches{merkle_root: merkle_root} -> merkle_root end) verified_proofs = Batches.get_amount_of_verified_proofs() @@ -38,8 +36,6 @@ defmodule ExplorerWeb.Home.Index do latest_batches = Batches.get_latest_batches(%{amount: 5}) - # extract only the merkle root - |> Enum.map(fn %Batches{merkle_root: merkle_root} -> merkle_root end) verified_proofs = Batches.get_amount_of_verified_proofs() diff --git a/explorer/lib/explorer_web/live/pages/home/index.html.heex b/explorer/lib/explorer_web/live/pages/home/index.html.heex index ae8defc57f..c599a3c749 100644 --- a/explorer/lib/explorer_web/live/pages/home/index.html.heex +++ b/explorer/lib/explorer_web/live/pages/home/index.html.heex @@ -40,30 +40,44 @@ <% end %> <.live_component module={ContractsComponent} id="contracts_card" class="sm:col-span-2" /> - <%= if @latest_batches != :empty and @latest_batches != [] do %> - <.card - class="relative sm:col-span-2 w-full flex flex-col space-y-1" - inner_class="text-ellipsis overflow-hidden text-lg flex flex-col space-y-1" - title="Recent Batches" - > +
+

+ Recent Batches +

<.link navigate={~p"/batches"} class="absolute top-4 right-5 hover:underline font-medium text-muted-foreground capitalize text-sm" > - View All + View All <.icon name="hero-arrow-top-right-on-square-solid" class="size-3.5 mb-1" /> - <%= for batch <- @latest_batches do %> - <.link class="flex justify-between group" navigate={~p"/batches/#{batch}"}> - - <%= Helpers.shorten_hash(batch) %> +
+ <%= if @latest_batches != :empty and @latest_batches != [] do %> + <.table id="latest_batches" rows={@latest_batches} class="sm:col-span-2"> + <:col :let={latest_batch} label="Batch Hash" class="text-left"> + <.link navigate={~p"/batches/#{latest_batch.merkle_root}"}> + + <%= Helpers.shorten_hash(latest_batch.merkle_root, 6) %> + <.right_arrow /> + <.tooltip> + <%= latest_batch.merkle_root %> + - <.right_arrow /> - <.tooltip> - <%= batch %> - - <% end %> - + + <:col :let={latest_batch} label="Status"> + <.dynamic_badge_for_batcher status={Helpers.get_batch_status(latest_batch)} /> + + <:col :let={latest_batch} label="Age"> + + <%= latest_batch.submission_timestamp |> Helpers.parse_timeago() %> + + + <:col :let={latest_batch} label="Submission Block Number"> + <%= latest_batch.submission_block_number |> Helpers.format_number() %> + + + <% else %> + <.empty_card_background text="No Batches To Display." class="sm:col-span-2"/> <% end %> From 11afb0c06ce12cb9dcb04d2e45f541c2e1803d68 Mon Sep 17 00:00:00 2001 From: PatStiles Date: Mon, 16 Dec 2024 20:01:47 -0300 Subject: [PATCH 3/6] fix view all position --- explorer/lib/explorer_web/live/pages/home/index.html.heex | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/explorer/lib/explorer_web/live/pages/home/index.html.heex b/explorer/lib/explorer_web/live/pages/home/index.html.heex index c599a3c749..611466459f 100644 --- a/explorer/lib/explorer_web/live/pages/home/index.html.heex +++ b/explorer/lib/explorer_web/live/pages/home/index.html.heex @@ -41,12 +41,12 @@ <.live_component module={ContractsComponent} id="contracts_card" class="sm:col-span-2" />
-

+

Recent Batches

<.link navigate={~p"/batches"} - class="absolute top-4 right-5 hover:underline font-medium text-muted-foreground capitalize text-sm" + class="absolute top-5 right-5 hover:underline font-medium text-muted-foreground capitalize text-sm" > View All <.icon name="hero-arrow-top-right-on-square-solid" class="size-3.5 mb-1" /> From f33e4ee0ad8be93ea6cb829779f84f907e30587c Mon Sep 17 00:00:00 2001 From: Urix <43704209+uri-99@users.noreply.github.com> Date: Mon, 16 Dec 2024 20:03:47 -0300 Subject: [PATCH 4/6] refactor: get 10 batches in landing page --- explorer/lib/explorer_web/live/pages/home/index.ex | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/explorer/lib/explorer_web/live/pages/home/index.ex b/explorer/lib/explorer_web/live/pages/home/index.ex index c1dd1ebf80..f1c611a109 100644 --- a/explorer/lib/explorer_web/live/pages/home/index.ex +++ b/explorer/lib/explorer_web/live/pages/home/index.ex @@ -9,7 +9,7 @@ defmodule ExplorerWeb.Home.Index do operators_registered = Operators.get_amount_of_operators() latest_batches = - Batches.get_latest_batches(%{amount: 5}) + Batches.get_latest_batches(%{amount: 10}) verified_proofs = Batches.get_amount_of_verified_proofs() @@ -35,7 +35,7 @@ defmodule ExplorerWeb.Home.Index do operators_registered = Operators.get_amount_of_operators() latest_batches = - Batches.get_latest_batches(%{amount: 5}) + Batches.get_latest_batches(%{amount: 10}) verified_proofs = Batches.get_amount_of_verified_proofs() From 51d00a665d7d5ed027bc4953c6f62dbc94cbcbc3 Mon Sep 17 00:00:00 2001 From: Urix <43704209+uri-99@users.noreply.github.com> Date: Tue, 17 Dec 2024 15:47:30 -0300 Subject: [PATCH 5/6] fix: remove extra header --- .../explorer_web/live/pages/batches/index.html.heex | 13 ------------- 1 file changed, 13 deletions(-) diff --git a/explorer/lib/explorer_web/live/pages/batches/index.html.heex b/explorer/lib/explorer_web/live/pages/batches/index.html.heex index f4f4a0ecc8..26ce5ac2ee 100644 --- a/explorer/lib/explorer_web/live/pages/batches/index.html.heex +++ b/explorer/lib/explorer_web/live/pages/batches/index.html.heex @@ -2,19 +2,6 @@ <.card_preheding>Batches <%= if @batches != :empty and @batches != [] do %> <.table id="batches" rows={@batches}> - <:header> - <.link - href="https://docs.alignedlayer.com/guides/6_contract_addresses" - class="absolute top-4 right-5 hover:underline font-medium text-muted-foreground capitalize text-sm" - target="_blank" - rel="noopener noreferrer" - > - View All <.icon name="hero-arrow-top-right-on-square-solid" class="size-3.5 mb-1" /> - -

- <.icon name="hero-cpu-chip" class="size-4 mb-0.5" /> Service Manager: -

- <:col :let={batch} label="Batch Hash" class="text-left"> <.link navigate={~p"/batches/#{batch.merkle_root}"}> From 5dc1d48722faf7bc17d101d189756a0bf1f2536f Mon Sep 17 00:00:00 2001 From: PatStiles Date: Wed, 18 Dec 2024 04:44:25 -0300 Subject: [PATCH 6/6] decrease header size + move link to bottom of recent batches --- .../explorer_web/components/core_components.ex | 2 ++ .../explorer_web/live/pages/home/index.html.heex | 15 ++++++++------- 2 files changed, 10 insertions(+), 7 deletions(-) diff --git a/explorer/lib/explorer_web/components/core_components.ex b/explorer/lib/explorer_web/components/core_components.ex index 19974580f5..d552c1aead 100644 --- a/explorer/lib/explorer_web/components/core_components.ex +++ b/explorer/lib/explorer_web/components/core_components.ex @@ -727,6 +727,7 @@ defmodule ExplorerWeb.CoreComponents do slot(:action, doc: "the slot for showing user actions in the last table column") slot(:header, default: nil, doc: "optional header for the table") + slot(:footer, default: nil, doc: "optional footer for the table") def table(assigns) do assigns = @@ -785,6 +786,7 @@ defmodule ExplorerWeb.CoreComponents do
+ <%= render_slot(@footer) %> """ end diff --git a/explorer/lib/explorer_web/live/pages/home/index.html.heex b/explorer/lib/explorer_web/live/pages/home/index.html.heex index 611466459f..c70ff7e43b 100644 --- a/explorer/lib/explorer_web/live/pages/home/index.html.heex +++ b/explorer/lib/explorer_web/live/pages/home/index.html.heex @@ -41,15 +41,9 @@ <.live_component module={ContractsComponent} id="contracts_card" class="sm:col-span-2" />
-

+

Recent Batches

- <.link - navigate={~p"/batches"} - class="absolute top-5 right-5 hover:underline font-medium text-muted-foreground capitalize text-sm" - > - View All <.icon name="hero-arrow-top-right-on-square-solid" class="size-3.5 mb-1" /> -
<%= if @latest_batches != :empty and @latest_batches != [] do %> <.table id="latest_batches" rows={@latest_batches} class="sm:col-span-2"> @@ -75,6 +69,13 @@ <:col :let={latest_batch} label="Submission Block Number"> <%= latest_batch.submission_block_number |> Helpers.format_number() %> + <:footer> +
+ <.link navigate={~p"/batches"} class="absolute hover:underline font-medium text-muted-foreground capitalize text-sm"> + View All <.icon name="hero-arrow-top-right-on-square-solid" class="size-3.5 mb-1" /> + +
+ <% else %> <.empty_card_background text="No Batches To Display." class="sm:col-span-2"/>