fix(#11184): update task filter UI to match reports filter

[santhosh-7777]

Description

Updated the task filter UI to match the existing reports filter UI.

Fixes #11184
Changes made:

• Changed Due date options from clickable list items to radio buttons
• Added Apply button footer to tasks sidebar filter
• Changed "Clear all filters" label to "Reset"

Code review checklist

• Readable: Concise, well named, follows the style guide
• Internationalised: All user facing text

[santhosh-7777]

@mrjones-plip The "Compile the app" failure is a CI infrastructure issue
(Docker port binding error: "address already in use"),
not related to my code changes.

[mrjones-plip]

@santhosh-7777 thanks for the PR!

Please:

• update your branch with most recent changes from master. I see your branch is out of date
• manually confirm you code changes work. When I load your branch locally nothing has changed.
• make sure your tests actually test what you changed. Your test now checks for a label so the tests passes, but it does not actually test that the form uses a radio box.

To this end, please provide a short 5-10 second video showing you've successfully implemented the requested changes on the three filter UIs. This will save the time of the reviewer before they start to look at the code.

[santhosh-7777]

@mrjones-plip Added a short demo video showing the three UI changes working (radio buttons for Due date, single-select behavior, Apply button on mobile view, and Reset label).
Also updated the test in filterByOverdue to directly click input[type="radio"] instead of just the label, ensuring the test actually validates the radio button interaction.

[santhosh-7777]

Community.Health.Toolkit.-.Google.Chrome.2026-06-19.12-51-56.mp4

[mrjones-plip]

Thanks @santhosh-7777 ! Can you make the radio button values not bold (#1)? As well, it appears maybe "place" is missing (#2)?

[santhosh-7777]

@mrjones-plip Fixed the bold styling on radio button labels (#1). For the Place filter (#2) , this is existing behavior controlled by *ngIf="showPlaceFilter" which calls hasMultiplePlaces(). It only shows when the user has multiple facilities. In my demo video the test user only had one facility (Test District), so Place was correctly hidden.

[mrjones-plip]

Thanks for the explanation about the missing place.

see request about moving CSS deceleration.

[mrjones-plip]

thanks for this fix! I don't see any inline styles in any of the cht-core/webapp/src/ts/* files - can you please move this change to the appropriate file in cht-core/webapp/src/css/*?

Thanks!

[santhosh-7777]

Moved the font-weight: normal style from inline HTML to the label block in webapp/src/css/sidebar-filter.less as requested.

[santhosh-7777]

@mrjones-plip i have made requested changes could u please review . happy to make if changes are needed. thank you!

[mrjones-plip]

Thanks @santhosh-7777 - LGTM