Struggle with large list.

[tehphilb]

Question

I have a very long dataset that I want to display in a list view, but as mentioned in the docs, there are some limitations. So I tried to implement the batch updates from the docs into my code. The problem I can't solve is how to update the page. Even if I pass the page object to the class, it doesn't update. It looks like I haven't quite grasped the concept.
It would be great if someone could take a look at my code and if there is a solution, explain it?

Code sample

import flet as ft
import polars as pl
from Controller.app_controls import add_to_control_reference, return_control_reference

app_control_map = return_control_reference()


ROWS_PER_PAGE = 10  


class CustomDataTable(ft.UserControl):
    def __init__(
        self,
        data,
    ):
        super().__init__()
        self.data = data

        self.rename_columns = {
            "FirstSeen": "First seen",
            "LastSeen": "Last seen",
            "ExceptionEndDate": "Except date",
        }

        self.tilte_row_names = list(self.prepare_data_for_listview().columns)
        self.data_array = [
            list(row) for row in self.prepare_data_for_listview().to_numpy()
        ]

    def custom_data_table_instance(self):
        add_to_control_reference("CustomDataTable", self)

    def build(self):
        self.custom_data_table_instance()

        # Create the title row for listview
        self.title_row = ft.Row(
            expand=True,
            spacing=10,
            controls=[
                ft.Container(
                    expand=True,
                    content=ft.Text(
                        column_name,
                        style=ft.TextThemeStyle.HEADLINE_SMALL,
                    ),
                )
                for column_name in self.tilte_row_names
            ],
        )

        # Create the listview
        self.list_view = ft.ListView(
            expand=True,
            spacing=10,
        )
        self.get_listview_items()

        return ft.Card(
            expand=True,
            elevation=4,
            surface_tint_color=ft.colors.WHITE,
            content=ft.Container(
                expand=True,
                padding=24,
                content=ft.Column(
                    expand=True,
                    controls=[
                        ft.Row(
                            alignment=ft.MainAxisAlignment.SPACE_AROUND,
                            controls=[self.title_row],
                        ),
                        ft.Divider(
                            height=5,
                        ),
                        ft.Row(
                            alignment=ft.MainAxisAlignment.SPACE_AROUND,
                            controls=[self.list_view],
                        ),
                    ],
                ),
            ),
        )

    def get_listview_items(self):
        # Iterate over rows in the array and add to ListView
        # for row in self.data_array:
        #     data_row = ft.Row(
        #         expand=True,
        #         controls=[
        #             ft.Container(
        #                 expand=True,
        #                 content=ft.Text(str(value)),
        #                 on_click=lambda e: print(e.control.content.value), # debug
        #             )
        #             for value in row
        #         ],
        #     )
        #     self.list_view.controls.append(data_row)

        for i, row in enumerate(self.data_array):
            data_row = ft.Row(
                expand=True,
                controls=[
                    ft.Container(expand=True, content=ft.Text(str(value)))
                    for value in row
                ],
            )
            self.list_view.controls.append(data_row)
            print(f"Processing row {i}")  # Debugging line
            if i % ROWS_PER_PAGE == 0:
                self.update()

        print("Final page update")  # Debugging line
        self.update()

    def prepare_data_for_listview(self):
        if not isinstance(self.data, pl.DataFrame):
            df = pl.DataFrame(self.data)
            print("no data")
        else:
            df = self.data.clone()

        columns_to_keep = [
            col for col in df.columns if col in self.rename_columns.keys()
        ]
        df = df.select(columns_to_keep)
        df = df.rename(self.rename_columns)

        df = df.with_columns(
            [
                df["First seen"].cast(pl.Datetime).alias("First seen"),
                df["Last seen"].cast(pl.Datetime).alias("Last seen"),
                df["Except date"].cast(pl.Datetime).alias("Except date"),
            ]
        )
        df = df.sort(by="First seen").reverse()
        df = df.slice(0, min(50, len(df)))

        return df

Error message

AssertionError: Control must be added to the page first.

------------------------------------------------------

• I have searched for answers to my question both in the issues and in previous discussions.

[ndonkoHenri]

Can you paste the complete error message?

[tehphilb]

If I run the code like pasted above I only get what I posted. If I pass the page object to this class I don't get any error message. Running in Debug I can see it is stuck here, it does not run the self.page.update().

 self.list_view.controls.append(data_row)
            print(f"Processing row {i}")  # Debugging line
            if i % ROWS_PER_PAGE == 0:
                self.page.update()

[tehphilb]

I assume the main issue is how UserControl works under the hood.

Since this works as expected:

from data_handler import DataHandler
import flet as ft

def main(page: ft.Page):
    data_handler = DataHandler()
    data = data_handler.deviation_data()

    # add ListView to a page first
    lv = ft.ListView(expand=1, spacing=10, item_extent=50)
    page.add(lv)

    get_data(page, data, lv)

def get_data(page, data, lv):
    for i in range(len(data)): # <- 32500 items
        lv.controls.append(ft.Text(f"Line {i}"))
        # send page to a page
        if i % 1000 == 0:
            page.update()
    # send the rest to a page
    page.update()

ft.app(target=main, view=ft.AppView.WEB_BROWSER)

But this somehow not:

from data_handler import DataHandler
import flet as ft


class Test1(ft.UserControl):
    def __init__(
        self,
        page,
        data,
    ):
        super().__init__()
        self.page = page
        self.data = data
        self.lv = ft.ListView(expand=1, spacing=10, item_extent=50)
        self.get_data()

    def build(self):
        return self.lv

    def get_data(self):
        for i in range(len(self.data)):  # <- 32500 items
            self.lv.controls.append(ft.Text(f"Line {i}"))
            # send page to a page
            if i % 1000 == 0:
                self.page.update()
        # send the rest to a page
        self.page.update()


def main(page: ft.Page):
    data_handler = DataHandler()
    data = data_handler.deviation_data()

    page.scroll = ft.ScrollMode.ALWAYS

    test1 = Test1(page, data)

    page.add(test1)


ft.app(target=main, view=ft.AppView.WEB_BROWSER)