[WEB-2370]chore: activity filters #6324
Conversation
chore: added sort order to local storage
WalkthroughThe pull request introduces changes to the issue activity management system, focusing on sorting and filtering mechanisms. The modifications include updating the Changes
Sequence DiagramsequenceDiagram
participant User
participant Component
participant LocalStorage
participant Store
User->>Component: Interact with sort/filter
Component->>LocalStorage: Save sort order/filters
LocalStorage-->>Component: Retrieve stored values
Component->>Store: Call method with sort order
Store->>Store: Apply sorting
Store-->>Component: Return sorted activities
Component->>User: Display sorted activities
Possibly related PRs
Suggested labels
Suggested reviewers
Poem
Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media? 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 0
🧹 Nitpick comments (3)
web/core/components/issues/issue-detail/issue-activity/sort-root.tsx (1)
6-11: Use the enum values directly in conditionals.Currently, the conditional checks rely on the literal strings
"asc"or"desc". SincesortOrderis defined asTSORT_ORDER, consider usingTSORT_ORDER.ASCorTSORT_ORDER.DESCto maintain strict typing and avoid potential mismatches.{props.sortOrder === TSORT_ORDER.ASC ? ( <ArrowUpWideNarrow className={cn("size-4", props.iconClassName)} /> ) : ( <ArrowDownWideNarrow className={cn("size-4", props.iconClassName)} /> )}web/core/components/issues/issue-detail/issue-activity/activity-comment-root.tsx (1)
30-39: Redundant empty object destructuring.The
comment: {}destructuring returns an empty pattern. If it's not used, remove it to avoid confusion or consider expanding it if there are intended properties.- const { - activity: { getActivityCommentByIssueId }, - comment: {}, - } = useIssueDetail(); + const { + activity: { getActivityCommentByIssueId }, + // comment: {}, // Remove or include relevant properties if needed. + } = useIssueDetail();web/core/components/issues/issue-detail/issue-activity/root.tsx (1)
45-49: Encourage fallback checks.Storing filters in local storage is useful. However, if the stored data is corrupted or an unexpected type, consider adding a fallback or validation to avoid potential runtime errors.
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (6)
web/ce/store/issue/issue-details/activity.store.ts(4 hunks)web/core/components/issues/issue-detail/issue-activity/activity-comment-root.tsx(2 hunks)web/core/components/issues/issue-detail/issue-activity/activity-filter.tsx(1 hunks)web/core/components/issues/issue-detail/issue-activity/root.tsx(6 hunks)web/core/components/issues/issue-detail/issue-activity/sort-root.tsx(1 hunks)web/core/constants/common.ts(1 hunks)
🧰 Additional context used
🪛 Biome (1.9.4)
web/core/components/issues/issue-detail/issue-activity/activity-comment-root.tsx
[error] 43-43: Unexpected empty object pattern.
(lint/correctness/noEmptyPattern)
⏰ Context from checks skipped due to timeout of 90000ms (3)
- GitHub Check: lint-web
- GitHub Check: Analyze (javascript)
- GitHub Check: Analyze (python)
🔇 Additional comments (17)
web/core/constants/common.ts (1)
31-35: Well-defined enum for sort order.Declaring a dedicated enum for
ASCandDESCfosters strong type checks and simplifies the promotion of consistent usage across the codebase.web/core/components/issues/issue-detail/issue-activity/activity-filter.tsx (1)
29-31: Nicely implemented indicator for modified filters.Displaying a small dot to indicate partially selected filters is a clear visual cue. Good job.
web/core/components/issues/issue-detail/issue-activity/activity-comment-root.tsx (3)
3-4: Enum import is appropriate.Importing
TSORT_ORDERfrom the common constants ensures consistent usage of the sort order enum.
26-26: Good property addition for maintaining consistent sorting.Adding
sortOrderto the prop list aligns well with the new sorting approach.
46-46: Sorting query usage is clear.Calling
getActivityCommentByIssueId(issueId, sortOrder)is consistent with the new enum-based approach. Validate that the store function behaves correctly and returns results in the specified order.✅ Verification successful
Sort order implementation is correctly handling comment ordering.
The
getActivityCommentByIssueIdfunction properly implements sorting using thesortOrderparameter to order comments by their creation timestamp. The implementation is type-safe and correctly handles the sorting direction.🏁 Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash # Description: Verify that getActivityCommentByIssueId responds correctly to the 'sortOrder' argument. rg -A 5 $'getActivityCommentByIssueId(issueId, sortOrder)'Length of output: 59
Script:
#!/bin/bash # Find function definition ast-grep --pattern 'function getActivityCommentByIssueId($_) { $$$ }' # Find export of this function ast-grep --pattern 'export const getActivityCommentByIssueId = $_' # Look for imports and usage rg "getActivityCommentByIssueId" # Look for sort order related code rg -i "sortorder" -A 5Length of output: 34568
web/ce/store/issue/issue-details/activity.store.ts (4)
19-19: Consistent introduction of a typed sort order.Importing
TSORT_ORDERclarifies the valid sort values and improves type safety throughout.
87-87: Leverage computedFn for memoization.Using mobx-utils’
computedFnis great for memoization based on strict arguments. Make sure there’s no global state usage inside that could invalidate or incorrectly cache results.
118-118: Validate date parsing edge cases.
new Date(e.created_at || 0)might parse a fallback epoch date whencreated_atis undefined or null. Consider verifying all activities consistently have valid timestamps or provide a fallback strategy.
46-46: Ensure all callsites provide the new parameter.Accepting
sortOrderas a required parameter is a breaking change. Verify that all existing code that callsgetActivityCommentByIssueIdis updated to supplysortOrder.✅ Verification successful
All callsites properly provide the new
sortOrderparameterThe only callsite in
web/core/components/issues/issue-detail/issue-activity/activity-comment-root.tsxcorrectly provides bothissueIdandsortOrderparameters.🏁 Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash # Description: Find all callsites of getActivityCommentByIssueId to confirm they pass the new parameter rg -A 4 'getActivityCommentByIssueId\('Length of output: 720
Script:
#!/bin/bash # Search for any destructuring or references of getActivityCommentByIssueId rg 'getActivityCommentByIssueId' # Search for potential destructuring patterns using AST ast-grep --pattern 'const { $$$, getActivityCommentByIssueId, $$$ } = $_'Length of output: 698
web/core/components/issues/issue-detail/issue-activity/root.tsx (8)
3-3: Minimal import changes are fine.The addition of
FC, useMemoimport is consistent with React conventions.
5-5: Local storage hook usage is a good approach.Using
useLocalStorageis an elegant solution for persisting user preferences across sessions.
68-78: Prevent empty filters edge cases.By returning early when
selectedFiltersis empty or undefined, you avoid unintended states. Confirm that UI components gracefully handle scenarios where no filters remain.
80-81: Simple and effective sort toggling.This toggle logic is clean and easy to follow. Good job avoiding in-place mutations.
177-177: Clear usage of sort order props.Passing
sortOrderand a toggle function toActivitySortRootis consistent with the store changes. Great decoupling of UI from store logic.
179-179: Use typed local storage defaults.Using
selectedFilters || defaultActivityFiltersensures a robust fallback. Continue verifying that the UI gracefully handles corner cases.
195-195: Confirm consistent filter handling.Make sure the logic in
IssueActivityCommentRootaligns with any updates you make in the toggle logic and filter array structure.
199-199: Synchronized sort order prop usage.Passing
sortOrdertoIssueActivityCommentRootensures the comment component respects current user preferences. This is a great extension of your local storage approach.
Description
Added activity filters to local storage.
Added indicator to filters button to indicate modified filters.
Moved activity sort order from store to local storage.
Type of Change
References
WEB-2370
Summary by CodeRabbit
Release Notes
New Features
Improvements
Technical Updates