fix(ui): update empty state widget

DataKitchen · Sep 30, 2024 · 0cf62ac · 0cf62ac
1 parent 4826fc9
commit 0cf62ac
Show file tree

Hide file tree

Showing 7 changed files with 60 additions and 22 deletions.
diff --git a/testgen/ui/components/widgets/__init__.py b/testgen/ui/components/widgets/__init__.py
@@ -3,7 +3,7 @@
 from testgen.ui.components.widgets.breadcrumbs import breadcrumbs
 from testgen.ui.components.widgets.button import button
 from testgen.ui.components.widgets.card import card
-from testgen.ui.components.widgets.empty_state import EmptyStateText, empty_state
+from testgen.ui.components.widgets.empty_state import EmptyStateMessage, empty_state
 from testgen.ui.components.widgets.expander_toggle import expander_toggle
 from testgen.ui.components.widgets.link import link
 from testgen.ui.components.widgets.page import (

diff --git a/testgen/ui/components/widgets/empty_state.py b/testgen/ui/components/widgets/empty_state.py
@@ -8,7 +8,7 @@
 from testgen.ui.components.widgets.page import css_class, whitespace
 
 
-class EmptyStateText(Enum):
+class EmptyStateMessage(Enum):
     Connection = (
         "Begin by connecting your database.",
         "TestGen delivers data quality through data profiling, hygiene review, test generation, and test execution.",
@@ -32,7 +32,9 @@ class EmptyStateText(Enum):
 
 
 def empty_state(
-    text: EmptyStateText,
+    label: str,
+    icon: str,
+    message: EmptyStateMessage,
     action_label: str,
     link_href: str | None = None,
     link_params: dict | None = None,
@@ -44,8 +46,9 @@ def empty_state(
         whitespace(5)
         st.html(f"""
                 <div style="text-align: center;">
-                    <b>{text.value[0]}</b>
-                    <p>{text.value[1]}</p>
+                    <p style="font-size: 24px; color: var(--secondary-text-color);">{label}</p>
+                    <p><i class="material-symbols-rounded" style="font-size: 60px; color: var(--disabled-text-color);">{icon}</i></p>
+                    <p><b>{message.value[0]}</b><br>{message.value[1]}</p>
                 </div>
                 """)
         _, center_column, _ = st.columns([.4, .3, .4])

diff --git a/testgen/ui/views/overview.py b/testgen/ui/views/overview.py
@@ -15,14 +15,15 @@
 from testgen.utils import to_int
 
 STALE_PROFILE_DAYS = 30
+PAGE_ICON = "home"
 
 
 class OverviewPage(Page):
     path = "overview"
     can_activate: typing.ClassVar = [
         lambda: session.authentication_status,
     ]
-    menu_item = MenuItem(icon="home", label="Overview", order=0)
+    menu_item = MenuItem(icon=PAGE_ICON, label="Overview", order=0)
 
     def render(self, project_code: str | None = None, **_kwargs):
         testgen.page_header(
@@ -47,16 +48,21 @@ def render_empty_state(project_code: str) -> bool:
     if project_summary_df["profiling_runs_ct"] or project_summary_df["test_runs_ct"]:
         return False
 
+    label="Your project is empty"
     testgen.whitespace(3)
     if not project_summary_df["connections_ct"]:
         testgen.empty_state(
-            text=testgen.EmptyStateText.Connection,
+            label=label,
+            icon=PAGE_ICON,
+            message=testgen.EmptyStateMessage.Connection,
             action_label="Go to Connections",
             link_href="connections",
         )
     else:
         testgen.empty_state(
-            text=testgen.EmptyStateText.Profiling if project_summary_df["table_groups_ct"] else testgen.EmptyStateText.TableGroup,
+            label=label,
+            icon=PAGE_ICON,
+            message=testgen.EmptyStateMessage.Profiling if project_summary_df["table_groups_ct"] else testgen.EmptyStateMessage.TableGroup,
             action_label="Go to Table Groups",
             link_href="connections:table-groups",
             link_params={ "connection_id": str(project_summary_df["default_connection_id"]) }

diff --git a/testgen/ui/views/profiling_summary.py b/testgen/ui/views/profiling_summary.py
@@ -21,14 +21,15 @@
 
 FORM_DATA_WIDTH = 400
 PAGE_SIZE = 10
+PAGE_ICON = "data_thresholding"
 
 
 class DataProfilingPage(Page):
     path = "profiling-runs"
     can_activate: typing.ClassVar = [
         lambda: session.authentication_status,
     ]
-    menu_item = MenuItem(icon="problem", label="Data Profiling", order=1)
+    menu_item = MenuItem(icon=PAGE_ICON, label="Data Profiling", order=1)
 
     def render(self, project_code: str | None = None, table_group_id: str | None = None, **_kwargs) -> None:
         testgen.page_header(
@@ -98,23 +99,30 @@ def render_empty_state(project_code: str) -> bool:
     if project_summary_df["profiling_runs_ct"]:
         return False
 
+    label = "No profiling runs yet"
     testgen.whitespace(5)
     if not project_summary_df["connections_ct"]:
         testgen.empty_state(
-            text=testgen.EmptyStateText.Connection,
+            label=label,
+            icon=PAGE_ICON,
+            message=testgen.EmptyStateMessage.Connection,
             action_label="Go to Connections",
             link_href="connections",
         )
     elif not project_summary_df["table_groups_ct"]:
         testgen.empty_state(
-            text=testgen.EmptyStateText.TableGroup,
+            label=label,
+            icon=PAGE_ICON,
+            message=testgen.EmptyStateMessage.TableGroup,
             action_label="Go to Table Groups",
             link_href="connections:table-groups",
             link_params={ "connection_id": str(project_summary_df["default_connection_id"]) }
         )
     else:
         testgen.empty_state(
-            text=testgen.EmptyStateText.Profiling,
+            label=label,
+            icon=PAGE_ICON,
+            message=testgen.EmptyStateMessage.Profiling,
             action_label="Run Profiling",
             button_onclick=partial(run_profiling_dialog, project_code),
             button_icon="play_arrow",

diff --git a/testgen/ui/views/table_groups.py b/testgen/ui/views/table_groups.py
@@ -51,7 +51,9 @@ def render(self, connection_id: str, **_kwargs) -> None:
         if df.empty:
             testgen.whitespace(3)
             testgen.empty_state(
-                text=testgen.EmptyStateText.TableGroup,
+                label="No table groups yet",
+                icon="table_view",
+                message=testgen.EmptyStateMessage.TableGroup,
                 action_label="Add Table Group",
                 button_onclick=partial(self.add_table_group_dialog, project_code, connection),
             )

diff --git a/testgen/ui/views/test_runs.py b/testgen/ui/views/test_runs.py
@@ -20,6 +20,7 @@
 from testgen.utils import to_int
 
 PAGE_SIZE = 10
+PAGE_ICON = "labs"
 
 
 class TestRunsPage(Page):
@@ -28,7 +29,7 @@ class TestRunsPage(Page):
         lambda: session.authentication_status,
         lambda: session.project != None or "overview",
     ]
-    menu_item = MenuItem(icon="labs", label="Data Quality Testing", order=2)
+    menu_item = MenuItem(icon=PAGE_ICON, label="Data Quality Testing", order=2)
 
     def render(self, project_code: str | None = None, table_group_id: str | None = None, test_suite_id: str | None = None, **_kwargs) -> None:
         testgen.page_header(
@@ -109,29 +110,38 @@ def render_empty_state(project_code: str) -> bool:
     if project_summary_df["test_runs_ct"]:
         return False
 
+    label="No test runs yet"
     testgen.whitespace(5)
     if not project_summary_df["connections_ct"]:
         testgen.empty_state(
-            text=testgen.EmptyStateText.Connection,
+            label=label,
+            icon=PAGE_ICON,
+            message=testgen.EmptyStateMessage.Connection,
             action_label="Go to Connections",
             link_href="connections",
         )
     elif not project_summary_df["table_groups_ct"]:
         testgen.empty_state(
-            text=testgen.EmptyStateText.TableGroup,
+            label=label,
+            icon=PAGE_ICON,
+            message=testgen.EmptyStateMessage.TableGroup,
             action_label="Go to Table Groups",
             link_href="connections:table-groups",
             link_params={ "connection_id": str(project_summary_df["default_connection_id"]) }
         )
     elif not project_summary_df["test_suites_ct"] or not project_summary_df["test_definitions_ct"]:
         testgen.empty_state(
-            text=testgen.EmptyStateText.TestSuite,
+            label=label,
+            icon=PAGE_ICON,
+            message=testgen.EmptyStateMessage.TestSuite,
             action_label="Go to Test Suites",
             link_href="test-suites",
         )
     else:
         testgen.empty_state(
-            text=testgen.EmptyStateText.TestExecution,
+            label=label,
+            icon=PAGE_ICON,
+            message=testgen.EmptyStateMessage.TestExecution,
             action_label="Run Tests",
             button_onclick=partial(run_tests_dialog, project_code),
             button_icon="play_arrow",

diff --git a/testgen/ui/views/test_suites.py b/testgen/ui/views/test_suites.py
@@ -21,13 +21,15 @@
 from testgen.ui.views.dialogs.run_tests_dialog import run_tests_dialog
 from testgen.utils import to_int
 
+PAGE_ICON = "rule"
+
 
 class TestSuitesPage(Page):
     path = "test-suites"
     can_activate: typing.ClassVar = [
         lambda: session.authentication_status,
     ]
-    menu_item = MenuItem(icon="list_alt", label="Test Suites", order=3)
+    menu_item = MenuItem(icon=PAGE_ICON, label="Test Suites", order=3)
 
     def render(self, project_code: str | None = None, table_group_id: str | None = None, **_kwargs) -> None:
 
@@ -168,23 +170,30 @@ def render_empty_state(project_code: str, add_button_onclick: partial) -> bool:
     if project_summary_df["test_suites_ct"]:
         return False
 
+    label="No test suites yet"
     testgen.whitespace(5)
     if not project_summary_df["connections_ct"]:
         testgen.empty_state(
-            text=testgen.EmptyStateText.Connection,
+            label=label,
+            icon=PAGE_ICON,
+            message=testgen.EmptyStateMessage.Connection,
             action_label="Go to Connections",
             link_href="connections",
         )
     elif not project_summary_df["table_groups_ct"]:
         testgen.empty_state(
-            text=testgen.EmptyStateText.TableGroup,
+            label=label,
+            icon=PAGE_ICON,
+            message=testgen.EmptyStateMessage.TableGroup,
             action_label="Go to Table Groups",
             link_href="connections:table-groups",
             link_params={ "connection_id": str(project_summary_df["default_connection_id"]) }
         )
     else:
         testgen.empty_state(
-            text=testgen.EmptyStateText.TestSuite,
+            label=label,
+            icon=PAGE_ICON,
+            message=testgen.EmptyStateMessage.TestSuite,
             action_label="Add Test Suite",
             button_onclick=add_button_onclick,
         )