feat(webapp): Selectable tabs, conversation filters 2nd attempt [WPB-18861]

[emil-wire]

WPB-18861 [Web] add filter for unread messages, mentions and replies

Pull Request

Summary

Please see #19769 for the original PR. Because of the monorepo change, I just redid my changes on the new base.

---

Security Checklist (required)

• External inputs are validated & sanitized on client and/or server where applicable.
• API responses are validated; unexpected shapes are handled safely (fallbacks or errors).
• No unsafe HTML is rendered; if unavoidable, sanitization is applied and documented where it happens.
• Injection risks (XSS/SQL/command) are prevented via safe APIs and/or escaping.

Accessibility (required)

• I have read and this PR upholds our Accessibility Best Practices.

Standards Acknowledgement (required)

• I have read and this PR upholds our Coding Standards and Tech Radar Choices.

---

Screenshots or demo (if the user interface changed)

Notes for reviewers

• Trade-offs:
• Follow-ups (linked issues):
• Linked PRs (e.g. web-packages): feat(Wpb-18861): Selectable tabs, conversation filters #19769

[codecov]

Codecov Report

❌ Patch coverage is 75.92593% with 39 lines in your changes missing coverage. Please review.
✅ Project coverage is 45.95%. Comparing base (b680ccd) to head (da5708d).
⚠️ Report is 19 commits behind head on dev.

Files with missing lines	Patch %	Lines
...onversations/TabsFilterButton/TabsFilterButton.tsx	64.51%	19 Missing and 3 partials ⚠️
...onversations/ConversationTabs/ConversationTabs.tsx	60.00%	5 Missing and 1 partial ⚠️
...LeftSidebar/panels/Conversations/Conversations.tsx	78.57%	3 Missing ⚠️
...anels/Conversations/hooks/useDraftConversations.ts	75.00%	3 Missing ⚠️
...ftSidebar/panels/Conversations/utils/draftUtils.ts	50.00%	1 Missing and 2 partials ⚠️
...eftSidebar/panels/Conversations/useSidebarStore.ts	93.33%	0 Missing and 1 partial ⚠️
...s/webapp/src/script/util/useChannelsFeatureFlag.ts	75.00%	0 Missing and 1 partial ⚠️

Additional details and impacted files

@@            Coverage Diff             @@
##              dev   #20142      +/-   ##
==========================================
+ Coverage   45.76%   45.95%   +0.18%     
==========================================
  Files        1650     1650              
  Lines       40752    40846      +94     
  Branches     8418     8441      +23     
==========================================
+ Hits        18651    18769     +118     
+ Misses      20149    20113      -36     
- Partials     1952     1964      +12     

Flag	Coverage Δ
app_webapp	44.10% <75.92%> (+0.22%)	⬆️
lib_api_client	51.63% <ø> (ø)
lib_core	59.10% <ø> (ø)

Flags with carried forward coverage won't be shown. Click here to find out more.

Files with missing lines	Coverage Δ
...omponents/InputBar/common/draftState/draftState.ts	45.83% <100.00%> (+4.92%)	⬆️
...ations/ConversationSidebar/ConversationSidebar.tsx	100.00% <ø> (ø)
...ations/TabsFilterButton/TabsFilterButton.styles.ts	100.00% <100.00%> (ø)
.../page/LeftSidebar/panels/Conversations/helpers.tsx	93.10% <100.00%> (+50.24%)	⬆️
apps/webapp/src/script/util/KeyboardUtil.ts	57.44% <100.00%> (+0.92%)	⬆️
...eftSidebar/panels/Conversations/useSidebarStore.ts	95.65% <93.33%> (-4.35%)	⬇️
...s/webapp/src/script/util/useChannelsFeatureFlag.ts	69.44% <75.00%> (+0.69%)	⬆️
...LeftSidebar/panels/Conversations/Conversations.tsx	60.97% <78.57%> (ø)
...anels/Conversations/hooks/useDraftConversations.ts	86.36% <75.00%> (+14.93%)	⬆️
...ftSidebar/panels/Conversations/utils/draftUtils.ts	73.68% <50.00%> (+59.39%)	⬆️
... and 2 more

... and 1 file with indirect coverage changes

🚀 New features to boost your workflow:

• ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

[github-actions]

🔗 Download Full Report Artifact

🧪 Playwright Test Summary

• ✅ Passed: 4
• ❌ Failed: 1
• ⏭ Skipped: 0
• 🔁 Flaky: 0
• 📊 Total: 5
• ⏱ Total Runtime: 169.7s (~ 2 min 50 sec)

specs/Authentication/authentication.spec.ts (❌ 1 failed, ⚠️ 0 flaky)

• ❌ Authentication > Verify current browser is set as temporary device (tags: TC-3460, regression)

[thisisamir98]

@emil-wire could you resolve the conflicts?

[emil-wire]

@emil-wire could you resolve the conflicts?

@thisisamir98 done

[sonarqubecloud]

Quality Gate passed

Issues
0 New issues
0 Accepted issues

Measures
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarQube Cloud