[BOOKINGSG-9239][RYN] migrate filter component#1154

Open

ryan-nguyen-t wants to merge 30 commits into

pre-release/v4from

BOOKINGSG-9239/filter

ryan-nguyen-t commented May 6, 2026 •

edited

Loading

Checklist

Migrated the component styles
- className is chained correctly with clsx
- User style prop is set as CSS variable
Changes follow the project guidelines in CONVENTIONS_V4.md
Updated Storybook documentation
Added/updated unit tests
Added visual tests

ryan-nguyen-t self-assigned this

Author

ryan-nguyen-t commented May 6, 2026

I've just realized I have missed the ticket description Out of scope: filter/addons
Should I revert the changes for this?

ryan-nguyen-t force-pushed the BOOKINGSG-9239/filter branch from c7c41f6 to 7670507 Compare

May 6, 2026 08:44

qroll reviewed

View reviewed changes

stories/filter/props-table.tsx Outdated

ryan-nguyen-t requested a review from qroll

May 7, 2026 02:46

qroll reviewed

View reviewed changes

src/filter/filter-modal.styles.ts

src/filter/filter.styles.ts

src/filter/filter-item.styles.ts Outdated

src/filter/filter-item.styles.ts Outdated

src/filter/filter-modal.styles.ts

qroll requested changes

View reviewed changes

e2e/tests/components/filter/filter.e2e.spec.ts Outdated

e2e/tests/components/filter/filter.e2e.spec.ts Outdated

e2e/tests/components/filter/filter.e2e.spec.ts Outdated

e2e/tests/components/filter/filter.e2e.spec.ts

e2e/tests/components/filter/filter.e2e.spec.ts

e2e/tests/components/filter/filter.e2e.spec.ts Outdated

e2e/tests/components/filter/filter.e2e.spec.ts Outdated

e2e/tests/components/filter/filter.e2e.spec.ts Outdated

e2e/tests/components/filter/filter.e2e.spec.ts

e2e/tests/components/filter/filter.e2e.spec.ts Outdated

qroll added the type: chore label

ryan-nguyen-t force-pushed the BOOKINGSG-9239/filter branch from 2c702ad to e9b03ea Compare

May 7, 2026 04:47

qroll reviewed

View reviewed changes

e2e/nextjs-app/src/app/components/filter/sidebar.e2e.tsx

qroll reviewed

View reviewed changes

e2e/nextjs-app/src/app/components/filter/modal.e2e.tsx Outdated

qroll reviewed

View reviewed changes

e2e/nextjs-app/src/app/components/filter/modal.e2e.tsx Outdated

ryan-nguyen-t force-pushed the BOOKINGSG-9239/filter branch from c259305 to e73160e Compare

May 7, 2026 09:13

zhaoyanxzy reviewed

View reviewed changes

src/filter/filter-item.tsx

e2e/tests/components/filter/__screenshots__/chromium/Filter-Sidebar-dark-mode---mount.png Outdated

e2e/tests/components/filter/__screenshots__/chromium/Filter-Minimisable-item--expanded.png

qroll reviewed

View reviewed changes

src/filter/filter-modal.tsx Outdated

ryan-nguyen-t force-pushed the BOOKINGSG-9239/filter branch from a213db7 to 2aedc8c Compare

May 8, 2026 08:58

ryan-nguyen-t requested review from qroll and zhaoyanxzy

May 8, 2026 09:13

ryan-nguyen-t force-pushed the BOOKINGSG-9239/filter branch from 13dc3fa to 58145a4 Compare

May 8, 2026 09:20

qroll reviewed

View reviewed changes

e2e/tests/components/filter/filter.e2e.spec.ts Outdated

e2e/tests/components/filter/filter.e2e.spec.ts Outdated

ryan-nguyen-t requested a review from qroll

May 11, 2026 03:04

ghazwan-gt reviewed

View reviewed changes

e2e/tests/components/filter/filter.e2e.spec.ts Outdated

ryan-nguyen-t requested a review from ghazwan-gt

May 11, 2026 06:24

ghazwan-gt approved these changes

View reviewed changes

Ryan.Nguyen added 6 commits

May 13, 2026 12:03


          [BOOKINGSG-9239][RYN] rename styling files' extension and refactor im…

670c18c

…port


          [BOOKINGSG-9239][RYN] migrate V3 design tokens to V4 design tokens

288827e


          [BOOKINGSG-9239][RYN] add e2e tests for filter modal & sidebar

d08cb2f


          [BOOKINGSG-9239][RYN] refactor OPTIONS for checkbox

04ffc60


          [BOOKINGSG-9239][RYN] add e2e tests for item minimisable

f78d2f3


          [BOOKINGSG-9239][RYN] rename e2e test cases

ee13171

Ryan.Nguyen added 24 commits

May 13, 2026 12:03


          [BOOKINGSG-9239][RYN] convert Styled Components interpolations to cla…

49b6ac0

…ss names


          [BOOKINGSG-9239][RYN] convert Styled Components Styled tags to Linari…

8224b8e

…a Css tags


          [BOOKINGSG-9239][RYN] refactor css margin into shorthands

94b9c76


          [BOOKINGSG-9239][RYN] update props table

fd37043


          [BOOKINGSG-9239][RYN] update props table - minimisedHeight

bb67625


          [BOOKINGSG-9239][RYN] add variable reset and restore subheaders in st…

408242a

…yle files


          [BOOKINGSG-9239][RYN] rename screenshots

29defa6


          [BOOKINGSG-9239][RYN] add waitForAnimationEnd util

84455f2


          [BOOKINGSG-9239][RYN] remove locatior options for compareScreenshot

682a840


          [BOOKINGSG-9239][RYN] refactor screenshots & add closed state scenarios

d1e4459


          [BOOKINGSG-9239][RYN] extract minimisable buttons into locators

c6a275a


          [BOOKINGSG-9239][RYN] add item configurations story & e2e test

b0b0e6a


          [BOOKINGSG-9239][RYN] add tooltip e2e tests for modal & sidebar

787c3f2


          [BOOKINGSG-9239][RYN] fix inset for value zero

0ffbb75


          [BOOKINGSG-9239][RYN] add default responsive e2e test

2eaa039


          [BOOKINGSG-9239][RYN] add filter page e2e tests

db3a561


          [BOOKINGSG-9239][RYN] remove redundant fields & refactor test structure

acdd40b


          [BOOKINGSG-9239][RYN] update screenshots

7ca9987


          [BOOKINGSG-9239][RYN] remove divider for first sidebar item in tests

e0c3169


          [BOOKINGSG-9239][RYN] add tests for clearButtonDisabled variants

4c49a7d


          [BOOKINGSG-9239][RYN] fix: destructure className out of otherProps fo…

c9fdb9c

…r filter item


          [BOOKINGSG-9239][RYN] migrate filter callbacks to unit tests

83dac29


          [BOOKINGSG-9239][RYN] remove divider of first modal item

9c89803


          [BOOKINGSG-9239][RYN] remove redundant describe block

d33a03e

ryan-nguyen-t force-pushed the BOOKINGSG-9239/filter branch from 6ea22a3 to d33a03e Compare

May 13, 2026 05:04

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

Labels