diff --git a/frontend/src/scenes/session-recordings/player/inspector/PlayerInspectorControls.tsx b/frontend/src/scenes/session-recordings/player/inspector/PlayerInspectorControls.tsx index a292b3495d4eb..af21f1f660a75 100644 --- a/frontend/src/scenes/session-recordings/player/inspector/PlayerInspectorControls.tsx +++ b/frontend/src/scenes/session-recordings/player/inspector/PlayerInspectorControls.tsx @@ -1,5 +1,4 @@ -import { LemonButton, LemonInput, LemonSelect, LemonCheckbox } from '@posthog/lemon-ui' -import { Tooltip } from 'antd' +import { LemonButton, LemonInput, LemonSelect, LemonCheckbox, Tooltip } from '@posthog/lemon-ui' import { useValues, useActions } from 'kea' import { IconInfo, @@ -17,6 +16,7 @@ import { IconWindow } from 'scenes/session-recordings/player/icons' import { playerSettingsLogic } from '../playerSettingsLogic' import { SessionRecordingPlayerMode, sessionRecordingPlayerLogic } from '../sessionRecordingPlayerLogic' import { playerInspectorLogic } from './playerInspectorLogic' +import { InspectorSearchInfo } from './components/InspectorSearchInfo' const TabToIcon = { [SessionRecordingPlayerTab.ALL]: undefined, @@ -88,6 +88,11 @@ export function PlayerInspectorControls(): JSX.Element { type="search" value={searchQuery} fullWidth + suffix={ + }> + + + } /> {windowIds.length > 1 ? ( diff --git a/frontend/src/scenes/session-recordings/player/inspector/components/InspectorSearchInfo.tsx b/frontend/src/scenes/session-recordings/player/inspector/components/InspectorSearchInfo.tsx new file mode 100644 index 0000000000000..167ecd298a19f --- /dev/null +++ b/frontend/src/scenes/session-recordings/player/inspector/components/InspectorSearchInfo.tsx @@ -0,0 +1,92 @@ +export function InspectorSearchInfo(): JSX.Element { + return ( + <> + Searching is "fuzzy" by default meaning that it will try and match many properties that are close to + the search query. +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
TokenMatch typeDescription
+ jscript + fuzzy-match + Items that fuzzy match jscript +
+ =scheme + exact-match + Items that are scheme +
+ 'python + include-match + Items that include python +
+ !ruby + inverse-exact-match + Items that do not include ruby +
+ ^java + prefix-exact-match + Items that start with java +
+ !^earlang + inverse-prefix-exact-match + Items that do not start with earlang +
+ .js$ + suffix-exact-match + Items that end with .js +
+ !.go$ + inverse-suffix-exact-match + Items that do not end with .go +
+ + ) +} diff --git a/frontend/src/scenes/session-recordings/player/inspector/playerInspectorLogic.ts b/frontend/src/scenes/session-recordings/player/inspector/playerInspectorLogic.ts index 5b4cec5c21332..bcc5c01b6c275 100644 --- a/frontend/src/scenes/session-recordings/player/inspector/playerInspectorLogic.ts +++ b/frontend/src/scenes/session-recordings/player/inspector/playerInspectorLogic.ts @@ -713,6 +713,7 @@ export const playerInspectorLogic = kea([ findAllMatches: true, ignoreLocation: true, shouldSort: false, + useExtendedSearch: true, }), ],