Unexpected behaviour happens in Table search

[Sivakajan-tech]

Wave SDK Version, OS

Wave SDK: 0.24.2, OS: MacOs

Actual behavior

In a Table ( include table_group), some columns did not disappear after search.

https://github.com/h2oai/wave/assets/51718908/1cc55315-bdac-41b4-ad94-58ab77c973be

Expected behaviour

The searched columns will disappear after close the search. Also, column width change should apply for every rows when we drag the column width.

Steps To Reproduce

Use following sample code to reproduce issue.

from h2o_wave import main, app, Q, ui

@app("/demo")
async def serve(q: Q):
    q.page["form"] = ui.form_card(
        box="1 1 5 9",
        items=[
            ui.table(
                name="deployments_table",
                height="calc(100vh - 325px)",
                columns=[
                    ui.table_column("Col A", "Col A", searchable=True),
                    ui.table_column("Col B", "Col B"),
                ],
                groups=[
                    ui.table_group(
                        label="lab type 1",
                        rows=[ui.table_row("1", ["a", "row 1"])],
                        collapsed=False,
                    ),
                    ui.table_group(
                        label="lab type 2",
                        rows=[ui.table_row("1", ["a b", "row 2"])],
                        collapsed=False,
                    ),
                    ui.table_group(
                        label="lab type 1",
                        rows=[ui.table_row("1", ["a b", "row 4"])],
                        collapsed=False,
                    ),
                ],
            )
        ],
    )

    await q.page.save()

[marek-mihok]

@Sivakajan-tech there is a problem in the example you've provided. The label of ui.table_group is used for the groups indexing and it should be unique. In the example you are using the same label twice: label="lab type 1". The example with correct labels could be as follows:

from h2o_wave import main, app, Q, ui

@app("/demo")
async def serve(q: Q):
    q.page["form"] = ui.form_card(
        box="1 1 5 9",
        items=[
            ui.table(
                name="deployments_table",
                height="calc(100vh - 325px)",
                columns=[
                    ui.table_column("Col A", "Col A", searchable=True),
                    ui.table_column("Col B", "Col B"),
                ],
                groups=[
                    ui.table_group(
                        label="lab type 1",
                        rows=[ui.table_row("1", ["a", "row 1"])],
                        collapsed=False,
                    ),
                    ui.table_group(
                        label="lab type 2",
                        rows=[ui.table_row("1", ["a b", "row 2"])],
                        collapsed=False,
                    ),
                    ui.table_group(
                        label="lab type 3",
                        rows=[ui.table_row("1", ["a b", "row 4"])],
                        collapsed=False,
                    ),
                ],
            )
        ],
    )

    await q.page.save()