Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: inspector search position #28176

Merged
merged 3 commits into from
Feb 3, 2025
+10 −1
Merged

fix: inspector search position #28176

Changes from 1 commit
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
cd4aa51
fix: inspector search position
pauldambra Feb 1, 2025
930d374
Merge branch 'master' into fix/inpector-search
pauldambra Feb 3, 2025
7303b8e
Merge branch 'master' into fix/inpector-search
pauldambra Feb 3, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
11 changes: 10 additions & 1 deletion frontend/src/scenes/session-recordings/player/inspector/PlayerInspectorControls.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -49,6 +49,7 @@ function sideActionForType({
(filter: SharedListMiniFilter) => {
return (
<LemonButton
data-attr={`player-inspector-${filter.key}-mini-filter-toggle`}
fullWidth
size="xsmall"
key={filter.name}
Expand Down Expand Up @@ -142,6 +143,7 @@ function NetworkFilterSettingsButton(): JSX.Element {

return (
<FilterSettingsButton
data-attr="player-inspector-network-toggle-all"
type={FilterableInspectorListItemTypes.NETWORK}
icon={<IconDashboard />}
// we disable the filter toggle-all when there are no items
Expand All @@ -157,6 +159,7 @@ function NetworkFilterSettingsButton(): JSX.Element {
closeOnClickInside: false,
overlay: (
<LemonButton
data-attr="player-inspector-network-upsell"
icon={<IconGear />}
fullWidth
size="xsmall"
Expand Down Expand Up @@ -188,6 +191,7 @@ function ConsoleFilterSettingsButton(): JSX.Element {

return (
<FilterSettingsButton
data-attr="player-inspector-console-toggle-all"
type={FilterableInspectorListItemTypes.CONSOLE}
icon={<IconTerminal />}
// we disable the filter toggle-all when there are no items
Expand All @@ -203,6 +207,7 @@ function ConsoleFilterSettingsButton(): JSX.Element {
closeOnClickInside: false,
overlay: (
<LemonButton
data-attr="player-inspector-console-upsell"
icon={<IconGear />}
fullWidth
size="xsmall"
Expand Down Expand Up @@ -232,6 +237,7 @@ function EventsFilterSettingsButton(): JSX.Element {

return (
<FilterSettingsButton
data-attr="player-inspector-events-toggle-all"
type={FilterableInspectorListItemTypes.EVENTS}
icon={<IconUnverifiedEvent />}
// we disable the filter toggle-all when there are no items
Expand Down Expand Up @@ -262,14 +268,15 @@ export function PlayerInspectorControls(): JSX.Element {
}, [featureFlags, setMiniFilter])

return (
<div className="flex">
<div className="flex flex-col">
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

here's the fix

<SettingsBar border="bottom" className="justify-end">
{mode !== SessionRecordingPlayerMode.Sharing && <EventsFilterSettingsButton />}
<ConsoleFilterSettingsButton />
<NetworkFilterSettingsButton />
{(window.IMPERSONATED_SESSION || featureFlags[FEATURE_FLAGS.SESSION_REPLAY_DOCTOR]) &&
mode !== SessionRecordingPlayerMode.Sharing && (
<SettingsToggle
data-attr="player-inspector-doctor-toggle"
title="Doctor events help diagnose the health of a recording, and are used by PostHog support"
icon={<IconStethoscope />}
label="Doctor"
Expand All @@ -278,6 +285,7 @@ export function PlayerInspectorControls(): JSX.Element {
/>
)}
<LemonButton
data-attr="player-inspector-search-toggle"
icon={<IconSearch />}
size="xsmall"
onClick={() => {
Expand All @@ -296,6 +304,7 @@ export function PlayerInspectorControls(): JSX.Element {
{showSearch && (
<div className="flex px-2 py-1">
<LemonInput
data-attr="player-inspector-search-input"
size="xsmall"
onChange={(e) => setSearchQuery(e)}
placeholder="Search..."
Expand Down
Loading