Skip to content

refactor(filter): use PolarInput#810

Open
dopenguin wants to merge 5 commits into
nextfrom
refactor/polar-input
Open

refactor(filter): use PolarInput#810
dopenguin wants to merge 5 commits into
nextfrom
refactor/polar-input

Conversation

@dopenguin

@dopenguin dopenguin commented Jun 18, 2026

Copy link
Copy Markdown
Member

Summary

Replaces layout-conditional checkbox/radio components (KernBlockButtonCheckbox, KernCheckbox, KernBlockButtonRadioGroup, KernRadioGroup) in filter with the unified PolarInput component (as proposed in #734).
Simplifies category state from Record<string, boolean> to string[] and introduces a reactive getter/setter-based selection model on categories for direct v-model binding and to get rid of getCategoryStatus and setCategoryStatus.

Also added some small changes to PolarInput and PolarInputGroup.

Instructions for local reproduction and review

  1. npm run snowbox
  2. Open filter
  3. Verify category checkboxes can be toggled individually and via "Alle an-/abwählen"
  4. Verify the 1xx multi-value category entry correctly selects/deselects with its individual values (100, 101, 102)
  5. Verify time filter works
  6. Verify the date range picker scrolls into view when "Zeitraum wählen" is selected and selection works

Additional information

I intend to update the implementation in src/plugins/filter/stores/category.ts (a) and src/plugins/filter/stores/time.ts (#811) as well.
For (a): Currently, if a user switches between two layers, the filter state of the the previous layer is reset. This is odd from a usability perspective. If you agree, I'll change this in a separate PR so that the state stays even if the layer switches.

Tickets

Resolves #779

@dopenguin dopenguin added this to the POLAR@3 milestone Jun 18, 2026
@dopenguin dopenguin self-assigned this Jun 18, 2026
@dopenguin dopenguin requested a review from a team June 18, 2026 17:08
@dopenguin dopenguin requested a review from warm-coolguy as a code owner June 18, 2026 17:08
@dopenguin dopenguin added the refactor Refactoring of previous code label Jun 18, 2026
@github-actions

github-actions Bot commented Jun 18, 2026

Copy link
Copy Markdown
PR Preview Action v1.8.1

QR code for preview link

🚀 View preview at
https://Dataport.github.io/polar/pr-preview/pr-810/

Built to branch gh-pages at 2026-07-02 14:59 UTC.
Preview will be ready when the GitHub Pages deployment is complete.

dopenguin added 5 commits July 2, 2026 16:55
The differentiation between the interface for layout standard and nineRegions including the
components KernCheckbox and KernBlockButtonCheckbox has been removed.

This change includes a refactor of the store and its logic to work without much overhead
together with PolarInput.
The differentiation between the interface for layout standard and nineRegions including the
components KernRadioGroup and KernBlockButtonRadioGroup has been removed.
@dopenguin dopenguin force-pushed the refactor/polar-input branch from 77acbd9 to 226a455 Compare July 2, 2026 14:56

@oeninghe-dataport oeninghe-dataport left a comment

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Without looking into the code, it's stated in #779:

The standard layout's block-button styling is applied via CSS (e.g. a class on the group or scoped styles)

However, the standard layout is not intact anymore but looks like the nineRegions layout.

Before:

Image

After:

Image

Please update your PR such that the styling before is still working.

@dopenguin

Copy link
Copy Markdown
Member Author

Without looking into the code, it's stated in #779:

The standard layout's block-button styling is applied via CSS (e.g. a class on the group or scoped styles)

However, the standard layout is not intact anymore but looks like the nineRegions layout.

Before:
Image

After:
Image

Please update your PR such that the styling before is still working.

After consulting with UX, I've adjusted the issue to scrap the block-button styling as the radios and checkboxes should not behave the same visually as one would not properly discern the possibility to select multiple elements with the checkboxes or is confused as one would only be able to select one element with the radio buttons.
We can revisit this approach later again if needed.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

refactor Refactoring of previous code

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Replace KernBlockButton inputs with PolarInput and PolarInputGroup

2 participants