Reimplementing Columns Management

tests/controls/test_datagrid.py

@@ -1,5 +1,6 @@
 import pandas as pd
 import pytest
+from fastcore.basics import NotStr
 from fasthtml.components import Div, Script
 
 from myfasthtml.controls.DataGrid import DataGrid, DatagridConf
@@ -785,6 +786,22 @@ class TestDataGridRender:
   # Body rows
   # ------------------------------------------------------------------
   
+  def test_i_can_render_body(self, datagrid_with_data):
+    """Test that the body renders with the correct ID and CSS class.
+    """
+    dg = datagrid_with_data
+    html = dg.mk_body_wrapper()
+    expected = Div(
+      Div(
+        Div(cls="dt2-row"),
+        Div(cls="dt2-row"),
+        Div(cls="dt2-row"),
+        cls=Contains("dt2-body")),
+      id=f"tb_{dg._id}",
+      cls=Contains("dt2-body-container"),
+    )
+    assert matches(html, expected)
+  
   def test_i_can_render_body_row_count(self, datagrid_with_full_data):
     """Test that mk_body_content_page returns one row per DataFrame row plus the add-row button.
 
@@ -922,13 +939,13 @@ class TestDataGridRender:
   # Body cell content
   # ------------------------------------------------------------------
   
-  @pytest.mark.parametrize("col_title, expected_css_class, expected_value", [
-      ("name", "dt2-cell-content-text", "Alice"),
-      ("age", "dt2-cell-content-number", "25"),
-      ("active", "dt2-cell-content-checkbox", None),
+  @pytest.mark.parametrize("col_title, expected_value", [
+      ("name", '<span class="dt2-cell-content-text truncate">Alice</span>'),
+      ("age", '<span class="dt2-cell-content-number truncate">25</span>'),
+      ("active", '<div class="dt2-cell-content-checkbox">'),
   ])
   def test_i_can_render_body_cell_content_for_column_type(
-      self, datagrid_with_full_data, col_title, expected_css_class, expected_value):
+      self, datagrid_with_full_data, col_title, expected_value):
     """Test that cell content carries the correct CSS class and value for each column type.
 
     Why these elements matter:
@@ -945,11 +962,4 @@ class TestDataGridRender:
     col_pos = dg._columns.index(col_def)
     
     content = dg.mk_body_cell_content(col_pos, 0, col_def, None)
-    
-    assert expected_css_class in str(content), (
-        f"Expected CSS class '{expected_css_class}' in cell content for column '{col_title}'"
-    )
-    if expected_value is not None:
-      assert expected_value in str(content), (
-          f"Expected value '{expected_value}' in cell content for column '{col_title}'"
-      )
+    assert matches(content, NotStr(expected_value))

tests/controls/test_datagrid_columns_manager.py

@@ -6,8 +6,9 @@ from fasthtml.common import Div, FT, Input, Form, Fieldset, Select
 
 from myfasthtml.controls.DataGridColumnsManager import DataGridColumnsManager
 from myfasthtml.controls.Search import Search
-from myfasthtml.controls.datagrid_objects import DataGridColumnState
+from myfasthtml.controls.datagrid_objects import DataGridColumnState, DataGridColumnUiState
 from myfasthtml.core.constants import ColumnType
+from myfasthtml.core.data.ColumnDefinition import ColumnDefinition
 from myfasthtml.core.instances import InstancesManager, MultipleInstance
 from myfasthtml.test.matcher import (
   matches, find_one, find, Contains, TestIcon, TestObject
@@ -41,13 +42,18 @@ class MockDataGrid(MultipleInstance):
     return None
 
 
+# col_def: ColumnDefinition, col_ui_state: DataGridColumnUiState
+
 @pytest.fixture
 def mock_datagrid(root_instance):
   """Create a mock DataGrid with sample columns."""
   columns = [
-      DataGridColumnState(col_id="name", col_index=0, title="Name", type=ColumnType.Text, visible=True),
-      DataGridColumnState(col_id="age", col_index=1, title="Age", type=ColumnType.Number, visible=True),
-      DataGridColumnState(col_id="email", col_index=2, title="Email", type=ColumnType.Text, visible=False),
+      DataGridColumnState(ColumnDefinition(col_id="name", col_index=0, title="Name", type=ColumnType.Text),
+                          DataGridColumnUiState(col_id="name", visible=True)),
+      DataGridColumnState(ColumnDefinition(col_id="age", col_index=1, title="Age", type=ColumnType.Number),
+                          DataGridColumnUiState(col_id="age", visible=True)),
+      DataGridColumnState(ColumnDefinition(col_id="email", col_index=2, title="Email", type=ColumnType.Text),
+                          DataGridColumnUiState(col_id="email", visible=False)),
   ]
   yield MockDataGrid(root_instance, columns=columns, _id="test-datagrid")
   InstancesManager.reset()

tests/controls/test_datagrid_formatting.py

@@ -9,12 +9,14 @@ import pytest
 from myfasthtml.controls.DataGrid import DataGrid
 from myfasthtml.controls.DataGridFormattingEditor import DataGridFormattingEditor
 from myfasthtml.controls.DataGridsManager import DataGridsManager
-from myfasthtml.controls.datagrid_objects import DataGridColumnState, DataGridRowUiState
+from myfasthtml.controls.datagrid_objects import DataGridColumnState, DataGridColumnUiState
 from myfasthtml.core.constants import ColumnType
+from myfasthtml.core.data.ColumnDefinition import ColumnDefinition
 from myfasthtml.core.formatting.dataclasses import FormatRule, Style
 from myfasthtml.core.formatting.dsl.definition import FormattingDSL
 from myfasthtml.core.instances import InstancesManager
 
+
 @pytest.fixture
 def manager(root_instance):
   """Create a DataGridsManager instance."""
@@ -27,19 +29,16 @@ def manager(root_instance):
 def datagrid(manager):
   """Create a DataGrid instance."""
   from myfasthtml.controls.DataGrid import DatagridConf
-  conf = DatagridConf(namespace="app", name="products", id="test-grid")
-  grid = DataGrid(manager, conf=conf, save_state=False, _id="test-datagrid")
+  conf = DatagridConf(namespace="app", name="products")
+  grid = DataGrid(manager, conf=conf, save_state=False, _id="mf-data_grid-test-datagrid")
   
+  #  ColumnDefinition, col_ui_state: DataGridColumnUiState
   # Add some columns
-  grid._state.columns = [
-      DataGridColumnState(col_id="amount", col_index=0, title="Amount", type=ColumnType.Number, visible=True),
-      DataGridColumnState(col_id="status", col_index=1, title="Status", type=ColumnType.Text, visible=True),
-  ]
-  
-  # Add some rows
-  grid._state.rows = [
-      DataGridRowUiState(0),
-      DataGridRowUiState(1),
+  grid.columns = [
+      DataGridColumnState(ColumnDefinition(col_id="amount", col_index=0, title="Amount", type=ColumnType.Number),
+                          DataGridColumnUiState(col_id="amount", visible=True)),
+      DataGridColumnState(ColumnDefinition(col_id="status", col_index=1, title="Status", type=ColumnType.Text),
+                          DataGridColumnUiState(col_id="status", visible=True))
   ]
   
   yield grid