Fix tx details (#19)

* Fix tx details * Finish block detail hardcoding * Hardcode and modularize block detail * Mix format * Delete block.ex * Delete transaction.ex * Block detail fix * Make transactions page faster * Remove TODOs --------- Co-authored-by: Javier Chatruc <[email protected]>
lambdaclass · Jul 5, 2023 · 4e90d8d · 4e90d8d
1 parent 4d24208
commit 4e90d8d
Show file tree

Hide file tree

Showing 3 changed files with 242 additions and 43 deletions.
diff --git a/lib/starknet_explorer_web/live/pages/block_detail.ex b/lib/starknet_explorer_web/live/pages/block_detail.ex
@@ -1,10 +1,34 @@
 defmodule StarknetExplorerWeb.BlockDetailLive do
   use StarknetExplorerWeb, :live_view
   alias StarknetExplorer.Rpc
-
+  alias StarknetExplorerWeb.Utils
   defp num_or_hash(<<"0x", _rest::binary>>), do: :hash
   defp num_or_hash(_num), do: :num
 
+  defp block_detail_header(assigns) do
+    ~H"""
+    <div class="flex justify-center items-center pt-14">
+      <h1 class="text-white text-4xl font-mono">Block detail</h1>
+    </div>
+    <button
+      class="font-bold py-2 px-4 rounded bg-blue-500 text-white"
+      phx-click="select-view"
+      ,
+      phx-value-view="overview"
+    >
+      Overview
+    </button>
+    <button
+      class="font-bold py-2 px-4 rounded bg-blue-500 text-white"
+      phx-click="select-view"
+      ,
+      phx-value-view="transactions"
+    >
+      Transactions
+    </button>
+    """
+  end
+
   def mount(_params = %{"number_or_hash" => param}, _session, socket) do
     {:ok, block} =
       case num_or_hash(param) do
@@ -16,36 +40,80 @@ defmodule StarknetExplorerWeb.BlockDetailLive do
           Rpc.get_block_by_number(num)
       end
 
-    {:ok, assign(socket, :block, block)}
+    assigns = [
+      block: block,
+      view: "overview"
+    ]
+
+    {:ok, assign(socket, assigns)}
   end
 
-  def render(assigns = %{block: _block}) do
+  @impl true
+  def render(assigns) do
+    ~H"""
+    <%= block_detail_header(assigns) %>
+    <%= render_info(assigns) %>
+    """
+  end
+
+  def render_info(assigns = %{block: block, view: "transactions"}) do
+    ~H"""
+    <table>
+      <tbody id="transactions">
+        <h1>Block Transactions</h1>
+        <%= for _transaction = %{"transaction_hash" => hash, "type" => type, "version" => version} <- @block["transactions"] do %>
+          <table>
+            <thead>
+              <tr>
+                <th>Type</th>
+                <th>Version</th>
+                <th>Hash</th>
+              </tr>
+              <tbody>
+                <tr>
+                  <td><%= type %></td>
+                  <td><%= version %></td>
+                  <td><%= hash |> Utils.shorten_block_hash() %></td>
+                </tr>
+              </tbody>
+            </thead>
+          </table>
+        <% end %>
+      </tbody>
+    </table>
+    """
+  end
+
+  # TODO:
+  # Do not hardcode:
+  # - Total Execeution Resources
+  # - Gas Price
+  def render_info(assigns = %{block: _block, view: "overview"}) do
     ~H"""
-    <div class="flex justify-center items-center pt-14">
-      <h1>Block detail</h1>
-    </div>
     <table>
       <thead>
         <ul>
           <li>Block Number <%= @block["block_number"] %></li>
-          <li>New Root <%= @block["new_root"] %></li>
-          <li>Parent Hash <%= @block["parent_hash"] %></li>
+          <li>Block Hash <%= @block["block_hash"] |> Utils.shorten_block_hash() %></li>
+          <li>Block Status <%= @block["status"] %></li>
+          <li>State Root <%= @block["new_root"] |> Utils.shorten_block_hash() %></li>
+          <li>Parent Hash <%= @block["parent_hash"] |> Utils.shorten_block_hash() %></li>
           <li>Sequencer Address <%= @block["sequencer_address"] %></li>
-          <li>Status <%= @block["status"] %></li>
+          <li>Gas Price <%= "0.000000017333948464 ETH" %></li>
+          <li>Total execution resources <%= 543_910 %></li>
           <li>
             Timestamp <%= @block["timestamp"]
             |> DateTime.from_unix()
             |> then(fn {:ok, time} -> time end) %> UTC
           </li>
         </ul>
       </thead>
-      <tbody id="transactions">
-        <h1>Block Transactions</h1>
-        <%= for _transaction = %{"transaction_hash" => hash, "type" => type, "version" => version} <- @block["transactions"] do %>
-          Type: <%= hash %> Hash: <%= type %> Version: <%= version %>
-        <% end %>
-      </tbody>
     </table>
     """
   end
+
+  def handle_event("select-view", %{"view" => view}, socket) do
+    socket = assign(socket, :view, view)
+    {:noreply, socket}
+  end
 end
diff --git a/lib/starknet_explorer_web/live/transaction_index_live.ex b/lib/starknet_explorer_web/live/transaction_index_live.ex
@@ -57,7 +57,6 @@ defmodule StarknetExplorerWeb.TransactionIndexLive do
 
     {:ok,
      assign(socket,
-       blocks: [],
        latest_block: []
      )}
   end
@@ -66,7 +65,6 @@ defmodule StarknetExplorerWeb.TransactionIndexLive do
   def handle_info(:load_blocks, socket) do
     {:noreply,
      assign(socket,
-       blocks: Utils.list_blocks(),
        latest_block: Utils.get_latest_block_with_transactions()
      )}
   end