feat(replays) - add playlist support from Issue Details and Insights #103007
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
…imestamps Added functionality to display the start and end timestamps of replays in the ReplayTable and ReplayDetails components. This allows users to navigate between replays with context on their timing, improving the overall user experience. Updated ReplayDetailsUserBadge to include navigation buttons for previous and next replays.
…ed props for next and previous replays in the ReplayDetailsUserBadge component, streamlining the code. Adjusted the loading placeholder height for better visual consistency. This change enhances the component's clarity and performance by eliminating unnecessary complexity
…ation Refactored the ReplayDetails component to use 'undefined' instead of 'null' for next and previous replay checks, enhancing clarity. Updated ReplayDetailsPageBreadcrumbs to include navigation buttons for previous and next replays, improving user experience by allowing seamless navigation between replays. This change streamlines the code and enhances the overall functionality of the replay details view.
Replaced the 'Next' icon in ReplayPlayPauseBar with 'IconChevron' for improved clarity. Refactored ReplayDetailsPageBreadcrumbs to utilize 'ButtonBar' for previous and next replay navigation buttons, enhancing the user interface and experience. This change streamlines the navigation between replays, making it more intuitive for users.
…d components Refactored the ReplayTable component to streamline the handling of replay start times by removing the end timestamp logic. Updated related components to eliminate unnecessary props and improve clarity. This change enhances the overall performance and readability of the replay table, making it easier to manage replay data.
…ameters - Imported `encodeSort` from `eventView` to handle sorting in the replay table. - Updated the `ReplaySessionColumn` to utilize the new sorting mechanism without modifying the URL directly. - Refactored query parameters in `ReplayDetails` to include `playlistStart` and improved handling of the `sort` parameter using `useUrlParams`. - Exported `DEFAULT_SORT` from `useReplayTableSort` for broader accessibility.
Updated the replay table component to calculate and pass the latest replay timestamp as 'end' instead of 'start'. Adjusted related components and queries to reflect this change, ensuring consistency across the application.
Clarified the comment in the ReplaySessionColumn regarding how EventView fetches the sort parameter from the URL, ensuring better understanding of the code's functionality.
…andling. Eliminated the calculation of the latest replay timestamp in the ReplayTable component, as it was no longer needed. Updated the ReplaySessionColumn to handle the event view query without the end parameter using exclusively the statsPeriod, ensuring cleaner code and improved clarity in the query string management.
…omponents Added EventView support to the ReplayTable component, allowing for enhanced query handling and sorting. Updated the ReplayDetailsLinkColumn to utilize EventView for constructing query parameters, ensuring a more dynamic interaction with replay data. Adjusted the GroupReplays component to pass the eventView prop, improving overall functionality and user experience.
…es. Updated the logic in the ReplayDetails component to ensure that the next replay is only accessed when the current index is valid, preventing potential out-of-bounds errors.
… integration. Updated ReplayTableColumns to include a new function for generating query strings that incorporates the stats period, ensuring accurate date range handling in replay links.
… and end dates when stats period is provided, improving date range handling in replay links.
…istency - Changed `queryReferrer` from 'replayList' to 'playlist' to align with updated naming conventions. - This change enhances clarity in the query handling logic.
…or query construction - Added EventView integration in ReplayPreviewPlayer to enhance event handling. - Refactored query object construction in ReplaySessionColumn to streamline playlist parameters. - Improved clarity and maintainability of query handling logic across components.
…yDetailsProviders - Updated query construction in `ReplaySessionColumn` to include `start` and `end` parameters for better playlist navigation. - Renamed `queryReferrer` from 'playlist' to 'replaysPlayList' for consistency across components. - Improved clarity in query handling by explicitly managing playlist parameters in `ReplayDetailsProviders`. - Streamlined the query object to avoid confusion with regular parameters, enhancing maintainability.
- Updated query construction to use `DEFAULT_REPLAY_LIST_SORT` for sorting, ensuring consistent default behavior. - Removed conditional check for `playlistSort` to streamline query handling logic. - Enhanced the `enabled` flag in the query to focus on essential parameters, improving clarity in data fetching.
…sPageBreadcrumbs - Replaced `StyledDiv` with `ShortId` to better represent the component's purpose. - Updated the component usage in the breadcrumb section to maintain consistency and improve readability.
- Modified the query sorting logic to use `DEFAULT_REPLAY_LIST_SORT` when `playlistSort` is an empty string, ensuring consistent default behavior. - This change enhances the clarity of the query construction process in the component.
…ter clarity - Updated the query sorting logic to handle cases where `playlistSort` is undefined or an empty string, ensuring consistent default behavior with `DEFAULT_REPLAY_LIST_SORT`. - This change enhances the clarity and robustness of the query construction process.
- Updated the parseStatsPeriod function to include an optional UTC parameter, allowing for more flexible date handling. - Adjusted the ReplaySessionColumn to utilize the new UTC functionality when parsing the stats period, improving the accuracy of date calculations.
…handling - Updated comment in `ReplaySessionColumn` to improve clarity on the manual addition of fields to the query, enhancing code readability.
![cursor[bot]](https://avatars.githubusercontent.com/in/1210556?s=60&v=4){kind=small}
![sentry[bot]](https://avatars.githubusercontent.com/in/12637?s=60&v=4){kind=small}
static/app/views/replays/detail/body/replayDetailsProviders.tsx
Outdated
Show resolved
Hide resolved
…epend on playlist and query state
| }>(queryKey, { | ||
| staleTime: 0, | ||
| enabled: Boolean(playlistStart && playlistEnd), | ||
| enabled: Boolean((playlistStart && playlistEnd) || (query && query.query !== '')), |
Contributor
There was a problem hiding this comment.
Bug: API triggers on missing query.
The condition (query && query.query !== '') incorrectly enables the API query when query.query is undefined. Since undefined !== '' evaluates to true, the API will be called even when no search query is provided. It should check (query.query && query.query !== '') or Boolean(query.query) to only enable when a query string actually exists.
billyvg
reviewed
Nov 14, 2025
Comment on lines
+351
to
+354
| const detailsTab = () => ({ | ||
| pathname: replayDetailsPathname, | ||
| query, | ||
| }); |
Comment on lines
+48
to
+51
| const location = useLocation(); | ||
| if (!eventView) { | ||
| eventView = EventView.fromLocation(location); | ||
| } |
Member
There was a problem hiding this comment.
Why do we have multiple places where we generate the eventView? Couldn't we just do it here in ReplayTable? or closer to where we call generateQueryStringObjectWithPlaylist -- or even a custom hook that's like usePlaylistQueryString
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Depends on #102583
Issue Details:
Performance:
