diff --git a/frontend/src/scenes/session-recordings/player/controller/PlayerController.tsx b/frontend/src/scenes/session-recordings/player/controller/PlayerController.tsx
index 9306afef52bbd..919fa8b6bd042 100644
--- a/frontend/src/scenes/session-recordings/player/controller/PlayerController.tsx
+++ b/frontend/src/scenes/session-recordings/player/controller/PlayerController.tsx
@@ -163,7 +163,11 @@ function FullScreen(): JSX.Element {
setIsFullScreen(!isFullScreen)}
- tooltip={`${!isFullScreen ? 'Go' : 'Exit'} full screen (F)`}
+ tooltip={
+ <>
+ {!isFullScreen ? 'Go' : 'Exit'} full screen
+ >
+ }
>
@@ -194,7 +198,11 @@ function Maximise(): JSX.Element {
+ {isMaximised ? 'Open' : 'Close'} other panels
+ >
+ }
icon={isMaximised ? : }
/>
)
diff --git a/frontend/src/scenes/session-recordings/player/controller/PlayerControllerTime.tsx b/frontend/src/scenes/session-recordings/player/controller/PlayerControllerTime.tsx
index 53ac102c92028..417dba1109ce4 100644
--- a/frontend/src/scenes/session-recordings/player/controller/PlayerControllerTime.tsx
+++ b/frontend/src/scenes/session-recordings/player/controller/PlayerControllerTime.tsx
@@ -7,6 +7,9 @@ import { capitalizeFirstLetter, colonDelimitedDuration } from 'lib/utils'
import { SimpleTimeLabel } from 'scenes/session-recordings/components/SimpleTimeLabel'
import { ONE_FRAME_MS, sessionRecordingPlayerLogic } from 'scenes/session-recordings/player/sessionRecordingPlayerLogic'
+import { KeyboardShortcut } from '~/layout/navigation-3000/components/KeyboardShortcut'
+import { HotKeyOrModifier } from '~/types'
+
import { playerSettingsLogic, TimestampFormat } from '../playerSettingsLogic'
import { seekbarLogic } from './seekbarLogic'
@@ -44,10 +47,14 @@ export function SeekSkip({ direction }: { direction: 'forward' | 'backward' }):
const altKeyHeld = useKeyHeld('Alt')
const jumpTimeSeconds = altKeyHeld ? 1 : jumpTimeMs / 1000
- const altKeyName = navigator.platform.includes('Mac') ? '⌥' : 'Alt'
- const arrowSymbol = direction === 'forward' ? '→' : '←'
- const arrowName = direction === 'forward' ? 'right' : 'left'
+ const arrowKey: Partial> = {}
+ if (direction === 'forward') {
+ arrowKey.arrowright = true
+ }
+ if (direction === 'backward') {
+ arrowKey.arrowleft = true
+ }
return (
{!altKeyHeld ? (
<>
- {capitalizeFirstLetter(direction)} {jumpTimeSeconds}s (
-
- {arrowSymbol} {arrowName} arrow
-
- )
+ {capitalizeFirstLetter(direction)} {jumpTimeSeconds}s
+
>
) : null}
- {capitalizeFirstLetter(direction)} 1 frame ({ONE_FRAME_MS}ms) (
-
- {altKeyName} + {arrowSymbol}
-
- )
+ {capitalizeFirstLetter(direction)} 1 frame ({ONE_FRAME_MS}ms){' '}
+
}
>