Table (Group by) Selections No Longer Highlighted in Wave v22+

[chelseanbr]

Wave SDK Version, OS

H2O Wave v0.22+ (v0.22.0 and v0.23.1) on macOS

Actual behavior

In Wave v0.22+ (v0.22.0 and v0.23.1), table selections are no longer highlighted as shown below.
This makes it harder to tell which groups are selected. For example, I grouped by Status and selected the "Closed" group in both screenshots below. To clearly see everything selected, the groups have to be expanded.

Expected behavior

In Wave v0.16.0, table selections are highlighted as shown below.
This makes it easier to tell which groups or rows are selected. For example, I once again grouped by Status and selected the "Closed" group in both screenshots below. My group/row selections were highlighted in gray as shown below.

Steps To Reproduce

1. Run table_groupby_selection.py below with Faker==13.3.4 installed.
   (wave run table_groupby_selection.py)
   1. Run with h2o-wave==0.16.0
   2. Run with h2o-wave==0.22.0 and/or h2o-wave==0.23.1

table_groupby_selection.py:

# Table / Group by
# Allow grouping a table by column values.
# #table
# ---
import random
from faker import Faker
from h2o_wave import main, app, Q, ui

fake = Faker()

_id = 0


class Issue:
    def __init__(self, text: str, status: str, progress: float, icon: str, notifications: str):
        global _id
        _id += 1
        self.id = f'I{_id}'
        self.text = text
        self.status = status
        self.views = 0
        self.progress = progress
        self.icon = icon
        self.notifications = notifications


# Create some issues
issues = [
    Issue(
        text=fake.sentence(),
        status=('Closed' if i % 2 == 0 else 'Open'),
        progress=random.random(),
        icon=('BoxCheckmarkSolid' if random.random() > 0.5 else 'BoxMultiplySolid'),
        notifications=('Off' if random.random() > 0.5 else 'On')) for i in range(100)
]

# Create columns for our issue table.
columns = [
    ui.table_column(name='text', label='Issue'),
    ui.table_column(name='status', label='Status'),
    ui.table_column(name='notifications', label='Notifications'),
    ui.table_column(name='done', label='Done', cell_type=ui.icon_table_cell_type()),
    ui.table_column(name='views', label='Views'),
    ui.table_column(name='progress', label='Progress', cell_type=ui.progress_table_cell_type()),
]


@app('/demo')
async def serve(q: Q):
    if q.args.show_inputs:
        q.page['form'].items = [
            ui.text(f'selected={q.args.issues}'),
            ui.button(name='show_form', label='Back', primary=True),
        ]
    else:
        q.page['form'] = ui.form_card(box='1 1 -1 11', items=[
            ui.table(
                name='issues',
                columns=columns,
                rows=[ui.table_row(
                    name=issue.id,
                    cells=[issue.text, issue.status, issue.notifications, issue.icon, str(issue.views),
                        str(issue.progress)]) for issue in issues],
                groupable=True,
                values=['']
            ),
            ui.button(name='show_inputs', label='Submit', primary=True)
        ])
    await q.page.save()

requirements.txt:

Faker==13.3.4

Would it be possible to please get this table selection highlighting back? This would make it much easier to select groups in tables. Thank you!

[mturoci]

Thanks for the super-detailed report @chelseanbr! Will try to get this in the next (0.25) release.