Redesign header

resolves: #21 (closed)

clive/__private/ui/widgets/header.py

 from __future__ import annotations
 
+import datetime
 from typing import TYPE_CHECKING
 
+import humanize
 from textual.containers import Container, Horizontal, Vertical
+from textual.reactive import var
 from textual.widgets import Header as TextualHeader
-from textual.widgets._header import HeaderClock, HeaderTitle
 from textual.widgets._header import HeaderIcon as TextualHeaderIcon
+from textual.widgets._header import HeaderTitle
 
 from clive.__private.core.profile_data import ProfileData
 from clive.__private.ui.widgets.clive_widget import CliveWidget
@@ -63,6 +66,41 @@ class AlarmsSummary(Container, CliveWidget):
         yield self.__label
 
 
+class DynamicPropertiesClock(Horizontal, CliveWidget):
+    last_update_trigger = var(False)
+    """A value that is used to trigger a re-rendering of the last update time."""
+
+    def compose(self) -> ComposeResult:
+        self.set_interval(0.25, self.__trigger_last_update)
+
+        yield TitledLabel(
+            "Block",
+            obj_to_watch=self.app.world,
+            attribute_name="app_state",
+            callback=self.__get_last_block,
+            id_="block_num",
+        )
+        yield TitledLabel(
+            "Last update",
+            obj_to_watch=self,
+            attribute_name="last_update_trigger",
+            callback=self.__get_last_update,
+            id_="last_update",
+        )
+
+    def __get_last_block(self, app_state: AppState) -> str:
+        block_num = app_state.get_dynamic_global_properties().head_block_number
+        block_time = app_state.get_dynamic_global_properties().time.time()
+        return f"{block_num} ({block_time} UTC)"
+
+    def __get_last_update(self, _: bool) -> str:
+        gdpo = self.app.world.app_state.get_dynamic_global_properties()
+        return humanize.naturaltime(datetime.datetime.utcnow().replace(tzinfo=datetime.timezone.utc) - gdpo.time)
+
+    def __trigger_last_update(self) -> None:
+        self.last_update_trigger = not self.last_update_trigger
+
+
 class Header(TextualHeader, CliveWidget):
     def __init__(self) -> None:
         super().__init__()
@@ -92,6 +130,8 @@ class Header(TextualHeader, CliveWidget):
                     callback=lambda app_state: "active" if app_state.is_active() else "inactive",
                     id_="mode-label",
                 )
+            yield DynamicPropertiesClock()
+
         with Vertical(id="expandable"):
             yield HeaderTitle()
             yield TitledLabel(
@@ -101,7 +141,6 @@ class Header(TextualHeader, CliveWidget):
                 callback=self.__get_node_address,
                 id_="node-address-label",
             )
-        yield HeaderClock()
 
     def on_click(self, event: events.Click) -> None:  # type: ignore
         event.prevent_default()