improve table

[3mora2]

Hi, I am creating a custom table to display a large number of rows, but when I do update or any change in the table which has large data, it takes a long time and lags in other operations, any tips

full code ( in one part)

from typing import Any
import flet as ft
import pandas as pd


############### file 1 ##################
def _(t):
    # Translate
    return t


def lang_dir_list(li: list):
    # remove None and correct dir
    if None in li:
        li.remove(None)
    return li


class _General:
    page: ft.Page

    def get_client_storage(self, key, default=None):
        # get client_storage from anywhere
        if hasattr(self, "page"):
            v = self.page.client_storage.get(key)
            if v is not None:
                return v
        return default

    def snack(self, msg):
        if hasattr(self, "page"):
            self.page.show_snack_bar(
                ft.SnackBar(
                    ft.Text(msg)
                )
            )


General = _General()


################ file 2 ##############

class CustomDropdown(ft.dropdown.Dropdown):
    def __init__(self, *args, **kwargs):
        default = dict(
            expand=True,
        )
        default.update(kwargs)
        super(CustomDropdown, self).__init__(*args, **default)

    @property
    def current_item(self) -> "CustomOption":
        return next(filter(lambda x: x.key == self.value, self.options), None)

    def disable(self, v: bool):
        self.disabled = v
        self.update()

    def set_error_text(self, val):
        self.error_text = val
        self.update()


class CustomOption(ft.dropdown.Option):
    def __init__(self, *args, data: Any = None, **kwargs):
        super(CustomOption, self).__init__(*args, **kwargs)
        self.data = data


class CustomText(ft.Text):
    def __init__(self, *args, **kwargs):
        default = dict(
            # text_align=ft.TextAlign.RIGHT if lang_dir_is_right() else ft.TextAlign.NONE,
        )
        default.update(kwargs)
        super(CustomText, self).__init__(
            *args,
            **default
        )

    def set_value(self, val):
        self.value = val
        self.update()


class CustomTextFiled(ft.TextField):

    def __init__(self, *args, id_="", **kwargs):
        self.on_change_list = [self.on_change_, ]
        default = dict(
            expand=True,
            text_align=ft.TextAlign.CENTER,
            on_change=self._on_change,
        )
        if "on_change" in kwargs:
            self.on_change_list.append(kwargs.pop("on_change"))

        default.update(kwargs)

        super().__init__(
            *args,
            **default
        )
        self.id_ = id_

    def add_handel(self, func):
        self.on_change_list.append(func)

    def _on_change(self, e):
        for func in self.on_change_list:
            if func:
                func(e)

    def on_change_(self, e):
        if self.error_text:
            self.set_error_text(None)

    def set_error_text(self, val):
        self.error_text = val
        self.update()

    def set_value(self, val):
        self.value = val
        if self.error_text:
            self.error_text = None
        self.update()

    def disable(self, v: bool):
        self.disabled = v
        self.update()


class CustomNumberFiled(CustomTextFiled):

    def __init__(self, *args, **kwargs):
        default = dict(
            input_filter=ft.InputFilter(allow=True, regex_string=r'[0-9]', replacement_string=''),
            keyboard_type=ft.KeyboardType.NUMBER,
            value=0,
            on_blur=self.on_blur_
        )
        default.update(kwargs)

        super(CustomNumberFiled, self).__init__(
            *args,
            **default

        )

    def on_blur_(self, e):
        val = super().value
        if isinstance(val, str):
            val = val.replace(",", "")
        if val == "":
            self.set_value(0)
        else:
            self.set_value(int(val))

    @ft.TextField.value.getter
    def value(self):
        try:
            return int(super().value)
        except ValueError:
            return 0


class CustomDecimalNumberFiled(CustomTextFiled):

    def __init__(self, *args, **kwargs):
        default = dict(
            input_filter=ft.InputFilter(allow=True, regex_string=r'[0-9.]', replacement_string=''),
            keyboard_type=ft.KeyboardType.NUMBER,
            value=0.0,
            on_blur=self.on_blur_
        )
        default.update(kwargs)

        super(CustomDecimalNumberFiled, self).__init__(
            *args,
            **default

        )

    def on_blur_(self, e):
        val = super().value
        if isinstance(val, str):
            val = val.replace(",", "")
        if val == "":
            self.set_value(0.0)
        else:
            self.set_value(float(val))

    @ft.TextField.value.getter
    def value(self):
        try:
            return float(super().value)
        except ValueError:
            return 0.0


################## file 3 ########################

class StateOp:
    all = "All"
    done = "Done"
    error = "Error"
    wait = "Waiting"
    not_found = "Not Found"

    @staticmethod
    def list():
        return [_(StateOp.all), _(StateOp.done), _(StateOp.error), _(StateOp.wait), _(StateOp.not_found), ]


text_size_row = 12

border = ft.border.only(
    top=ft.BorderSide(width=2, color=ft.colors.GREY),
    bottom=ft.BorderSide(width=2, color=ft.colors.GREY),
)
border_row = ft.border.only(
    # top=ft.BorderSide(width=2, color=ft.colors.GREY),
    bottom=ft.BorderSide(width=2, color=ft.colors.GREY),
)
main_border = ft.border.only(
    left=ft.BorderSide(width=2, color=ft.colors.GREY),
    right=ft.BorderSide(width=2, color=ft.colors.GREY),
)


class AmazonUpdatePriceTable(ft.Container):
    def __init__(self, parent, headers, *args, **kwargs):
        self.is_show_image = General.get_client_storage("amazon_update_show_image", False)
        # self.parent = parent
        self.id_width = 70
        self.action_width = None
        self.page_number = CustomText()
        self.dropdown_page_count = CustomDropdown(
            label=_("Count"),
            text_size=text_size_row,
            label_style=ft.TextStyle(size=text_size_row),
            options=[CustomOption(key=count, data=count) for count in [50, 100, 500, 1000000]],
            on_change=self.change_page_count, tooltip=_("Page Count"),
            expand=1,
            # border=ft.InputBorder.OUTLINE,
            content_padding=ft.padding.only(top=2, ),
            alignment=ft.Alignment(0, 0),
            # width=60,
            height=40
        )
        self.dropdown_page_count.value = self.dropdown_page_count.options[0].key
        self.dropdown_show_type = CustomDropdown(
            label=_("Show"),
            text_size=text_size_row,
            label_style=ft.TextStyle(size=text_size_row),
            options=[CustomOption(key=count, data=count) for count in StateOp.list()],
            on_change=self.change_show_type, tooltip=_("Page Show"),
            expand=1,
            # border=ft.InputBorder.OUTLINE,
            content_padding=ft.padding.only(top=2, ),
            alignment=ft.Alignment(0, 0),
            # width=60,
            height=40
        )
        self.dropdown_show_type.value = self.dropdown_show_type.options[0].key
        self.show_type = self.dropdown_show_type.value
        self.page_count = int(self.dropdown_page_count.value)
        self.current_page = 1
        self.all_page = 1
        self.row_pag = ft.Container(
            content=ft.Row(
                lang_dir_list([
                    ft.IconButton(
                        icon=ft.icons.ADD,
                        icon_color=ft.colors.GREEN,
                        tooltip=_("Add"),
                        on_click=self.add_row,
                        expand=1
                    ),
                    ft.IconButton(
                        icon=ft.icons.UPLOAD_FILE,
                        tooltip=_("Upload File"),
                        on_click=lambda x: print("upload"),
                        expand=1
                    ),
                    ft.IconButton(icon=ft.icons.KEYBOARD_DOUBLE_ARROW_LEFT, on_click=self.back_first_page,
                                  tooltip=_("First Page"), expand=1),
                    ft.IconButton(icon=ft.icons.ARROW_BACK_IOS, on_click=self.back_page, tooltip=_("Previous Page"),
                                  expand=1),
                    self.page_number,
                    self.dropdown_page_count,
                    self.dropdown_show_type,
                    ft.IconButton(icon=ft.icons.ARROW_FORWARD_IOS, on_click=self.next_page, tooltip=_("Next Page"),
                                  expand=1),
                    ft.IconButton(icon=ft.icons.KEYBOARD_DOUBLE_ARROW_RIGHT, on_click=self.last_page,
                                  tooltip=_("Last Page"), expand=1),

                    ft.IconButton(icon=ft.icons.SAVE_ALT, on_click=lambda x: print(""), tooltip=_("Save"), expand=1),
                    ft.IconButton(icon=ft.icons.SAVE_AS_SHARP, on_click=lambda x: print(""),
                                  tooltip=_("Save Template"), expand=1),
                    ft.IconButton(
                        icon=ft.icons.DELETE_FOREVER,
                        icon_color=ft.colors.RED_500,
                        tooltip=_("Delete Selected Row"),
                        on_click=self.clear_selected_row,
                        expand=1
                    ),

                ]
                ),
                alignment=ft.MainAxisAlignment.CENTER,
                expand=True
            ),
            border=border,
            padding=3
        )
        self.main_check = ft.Checkbox(label=_("ID"), value=True, width=self.id_width, on_change=self.change_select_all)

        self.headers = ft.Container(ft.Row(
            controls=lang_dir_list([
                self.main_check,
                CustomText(value=_(""), width=60, text_align=ft.TextAlign.CENTER) if self.is_show_image else None,
                *[CustomText(value=h, expand=True, text_align=ft.TextAlign.CENTER, size=text_size_row) for h in
                  headers],

            ]),
        ), border=border, padding=3)

        self.view = ft.ListView(expand=True, first_item_prototype=True)
        self.all_row = []
        default = dict(
            content=ft.Column(
                [
                    self.headers,
                    self.view,
                    self.row_pag,
                ],
                expand=True,
            ),
            expand=2,
            # padding=ft.padding.only(right=4),
            border=main_border,
        )
        default.update(kwargs)
        super(AmazonUpdatePriceTable, self).__init__(*args, **default)

    # def build(self):
    #     return ft.Container(
    #         content=ft.Column(
    #             [
    #                 self.headers,
    #                 self.view,
    #                 self.row_pag,
    #             ],
    #             expand=True,
    #         ),
    #         expand=2,
    #         padding=ft.padding.only(right=4),
    #         border=ft.border.only(
    #             left=ft.BorderSide(width=2, color=ft.colors.GREY),
    #             right=ft.BorderSide(width=2, color=ft.colors.GREY),
    #         )
    #
    #     )

    def disable(self, value):
        self.row_pag.disabled = value
        self.headers.disabled = value
        # self.view.disabled = value
        self.row_pag.update()
        self.headers.update()
        # self.view.update()

    def change_show_type(self, e):
        self.disable(True)
        self.show_type = e.data
        self.current_page = 1
        self.update_all_page()
        self.disable(False)

    def back_page(self, __):
        if 1 < self.current_page:
            self.current_page -= 1
            self.update()

    def back_first_page(self, __):
        self.current_page = 1
        self.update()

    def next_page(self, __):
        if self.current_page < self.all_page:
            self.current_page += 1
            self.update()

    def last_page(self, __):
        self.current_page = self.all_page
        self.update()

    def change_page_count(self, e):
        self.disable(True)
        self.page_count = int(e.data)
        self.current_page = 1
        self.update_all_page()
        self.disable(False)

    def change_select_all(self, e: ft.ControlEvent):
        value = e.control.value
        for r in self.rows():
            r.check.value = value
        self.update()

    def update_all_page(self):
        c = self.all_row_.__len__()
        self.all_page = int(c / self.page_count) + 1 if c / self.page_count > int(c / self.page_count) else int(
            c / self.page_count)
        self.update()

    def clear_selected_row(self, __):
        for row in self.rows():
            if row.check.value:
                self.all_row.remove(row)
        self.update_all_page()
        self.update()

    def rows(self, select=None) -> list["AmazonUpdatePriceTableRow"]:
        if select is None:
            return self.view.controls
        else:
            return list(filter(lambda x: x.check.value is select, self.view.controls))
        # if select is None:
        #     return list(filter(lambda x: isinstance(x, AmazonUpdatePriceTableRow), self.view.controls))
        # else:
        #     return list(filter(lambda x: isinstance(x, AmazonUpdatePriceTableRow) and x.check.value is select,
        #                        self.view.controls))

    def add_row(self, __):
        self.add([{}])

    @property
    def all_row_(self) -> list["AmazonUpdatePriceTableRow"]:
        if self.show_type not in [_(StateOp.wait), _(StateOp.all)]:
            return list(filter(lambda x: x.state.value == self.show_type, self.all_row))
        elif self.show_type == _(StateOp.wait):
            return list(filter(lambda x: not x.state.value, self.all_row))
        return self.all_row

    def update(self):
        self.view.controls.clear()
        s = (self.current_page - 1) * self.page_count
        e = self.current_page * self.page_count
        self.view.controls.extend(self.all_row_[s:e])
        self.view.update()
        self.page_number.set_value(f"{self.current_page}/{self.all_page}")

    def add(self, list_texts: list[dict], *args, **kwargs):
        old_sku = {x.sku.value for x in self.all_row}
        for list_text in list_texts:
            sku = list_text.get("sku", {}).get("value")
            if sku and sku in old_sku:
                continue
            old_sku.add(sku)

            self.all_row.append(
                AmazonUpdatePriceTableRow(
                    *args,
                    list_text=list_text,
                    parent=self,
                    **kwargs,
                )
            )
        self.update_all_page()

    def save_template(self, path):
        self.save(path)

    def save(self, path):
        data = {
            "sku": [],
            "price": [],
            "new_price": [],
            "quantity": [],
            "new_quantity": [],
            "state": [],
        }
        for row in self.all_row_:
            if not row.check.value:
                continue

            data["sku"].append(row.sku.value)
            data["price"].append(row.price.value)
            data["new_price"].append(row.new_price.value)
            data["quantity"].append(row.quantity.value)
            data["new_quantity"].append(row.new_quantity.value)
            data["state"].append(row.state.value)

        pd.DataFrame(data).to_excel(path, index=False)


class AmazonUpdatePriceTableRow(ft.Container):
    def __init__(self, *args, list_text: dict, parent: AmazonUpdatePriceTable, **kwargs):
        self.parent = parent
        self.full_data = {}
        index = str(parent.all_row.__len__() + 1)
        self.check = ft.Checkbox(value=parent.main_check.value, label=index, width=parent.id_width)
        self.image = ft.Image(
            src="https://m.media-amazon.com/images/I/01RmK+J4pJL._SS60_.gif",
            width=60, height=60, fit=ft.ImageFit.COVER,
        )

        self.sku = CustomTextFiled(value=list_text.get("sku", {}).get("value"), text_align=ft.TextAlign.CENTER,
                                   text_size=text_size_row, expand=True)
        self.price = CustomText(value=list_text.get("price", {}).get("value", 0), expand=True,
                                text_align=ft.TextAlign.CENTER, size=text_size_row)
        self.quantity = CustomText(value=list_text.get("quantity", {}).get("value", 0), expand=True,
                                   text_align=ft.TextAlign.CENTER, size=text_size_row)
        self.new_price = CustomDecimalNumberFiled(value=list_text.get("price", {}).get("value", 0),
                                                  text_size=text_size_row, expand=True)
        self.new_quantity = CustomNumberFiled(value=list_text.get("quantity", {}).get("value", 0),
                                              text_size=text_size_row, expand=True)
        self.state = CustomText(value=list_text.get("state", {}).get("value", ""), expand=True,
                                text_align=ft.TextAlign.CENTER, size=text_size_row)
        self.normal_border = border_row
        # self.normal_border = ft.border.all(color=ft.colors.GREY)
        self.selected_border = ft.border.all(color=ft.colors.GREEN, width=4)
        super(AmazonUpdatePriceTableRow, self).__init__(
            *args,
            content=ft.Row(
                controls=lang_dir_list([
                    self.check,
                    self.image,
                    self.sku,
                    self.price,
                    self.new_price,
                    self.quantity,
                    self.new_quantity,
                    self.state,
                ]),
                spacing=1
            ),
            border=self.normal_border,
            padding=1,
            key=f"row_0_{index}",
            **kwargs
        )

    # def update_values(self):
    #     self.quantity.set_value(self.full_data.get("seller_central", {}).get("quantity", 0))
    #     self.price.set_value(self.full_data.get("seller_central", {}).get("price", 0.0))
    #     self.sku.tooltip = f'{self.full_data.get("amazon", {})}'
    #     self.sku.update()
    #     image = self.full_data.get("seller_central", {}).get("image")
    #     if image and self.is_show_image:
    #         self.image.src = self.full_data.get("seller_central", {}).get("image")
    #         # self.image.tooltip = f'{self.full_data.get("amazon", {})}'
    #         self.image.update()

    def selected(self, val):
        if val:
            self.border = self.selected_border
            self.update()
        else:
            self.border = self.normal_border
            self.update()
        self.parent.view.scroll_to(key=self.key)


########### main file ############


def main(page):
    # Start App
    General.page = page
    table = AmazonUpdatePriceTable(page, headers=[
        _("SKU"), _("Current Price"), _("New Price"), _("Current Quantity"),
        _("New Quantity"), _("State"),  # _("Action")
    ])
    page.add(table)

    def on_price(e):
        price_pres.disable(not price_switch.value)

    price_switch = ft.Switch(on_change=on_price, value=False, label=_("Price"), expand=1)
    price_pres = CustomDecimalNumberFiled(
        label=_("%(+,-)"),
        input_filter=ft.InputFilter(allow=True, regex_string=r'[0-9.-]', replacement_string=''),
        disabled=not price_switch.value,
        expand=1
    )

    page.add(ft.Row([
        price_switch,
        price_pres
    ]))
    # For Test
    table.disable(True)
    table.add([
        {
            "sku": {"value": i, "editable": False, "type": str},
            "price": {"value": 0, "editable": True, "type": float},
            "new_price": {"value": 0, "editable": True, "type": float},
            "quantity": {"value": 0, "editable": True, "type": int},
            "new_quantity": {"value": 0, "editable": True, "type": int},
            "state": {"value": "", "editable": False, "type": None}
        }
        for i in range(100000)
    ])
    table.disable(False)
    print("- add finish")


if __name__ == "__main__":
    ft.app(target=main)