From 1c0ffda1ea426120109e58b25d015e6556e71e6a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Thomas=20Oberm=C3=BCller?= Date: Thu, 16 Nov 2023 12:06:27 +0100 Subject: [PATCH] feat(command-bar): various improvements to the command bar (#18649) --- .../lemon-ui-lemon-skeleton--presets.png | Bin 11308 -> 14031 bytes .../components/Breadcrumbs.tsx | 2 +- .../components/ActivityLog/ActivityLog.tsx | 2 +- .../lib/components/CommandBar/ActionBar.tsx | 8 ++-- .../lib/components/CommandBar/ActionInput.tsx | 4 +- .../components/CommandBar/ActionResult.tsx | 4 +- .../components/CommandBar/ActionResults.tsx | 6 +-- .../lib/components/CommandBar/CommandBar.tsx | 37 +++++++++++++----- .../lib/components/CommandBar/SearchBar.tsx | 10 ++--- .../components/CommandBar/SearchBarTab.tsx | 9 +++-- .../lib/components/CommandBar/SearchInput.tsx | 4 +- .../components/CommandBar/SearchResult.tsx | 10 ++--- .../components/CommandBar/SearchResults.tsx | 6 +-- .../lib/components/CommandBar/SearchTabs.tsx | 7 ++-- .../lib/components/CommandBar/constants.ts | 2 +- .../components/CommandBar/searchBarLogic.ts | 10 ++++- .../CommandPalette/CommandPalette.tsx | 2 +- .../Subscriptions/views/EditSubscription.tsx | 6 +-- .../views/ManageSubscriptions.tsx | 2 +- .../LemonSkeleton/LemonSkeleton.stories.tsx | 2 +- .../lemon-ui/LemonSkeleton/LemonSkeleton.tsx | 18 +-------- .../src/scenes/apps/ErrorDetailsModal.tsx | 2 +- frontend/src/scenes/apps/MetricsTab.tsx | 2 +- .../scenes/batch_exports/BatchExportScene.tsx | 2 +- .../src/scenes/experiments/Experiment.tsx | 4 +- .../scenes/ingestion/panels/BillingPanel.tsx | 4 +- .../src/scenes/insights/InsightSkeleton.tsx | 4 +- .../notebooks/Nodes/NotebookNodePerson.tsx | 2 +- .../project-homepage/ProjectHomepage.tsx | 2 +- .../session-recordings/player/PlayerMeta.tsx | 8 ++-- .../playlist-popover/PlaylistPopover.tsx | 2 +- .../playlist/SessionRecordingPreview.tsx | 6 +-- .../SessionRecordingsPlaylistScene.tsx | 4 +- .../project/PersonDisplayNameProperties.tsx | 2 +- .../settings/project/ProjectSettings.tsx | 2 +- .../settings/project/TimezoneConfig.tsx | 2 +- frontend/src/styles/vars.scss | 1 - 37 files changed, 97 insertions(+), 103 deletions(-) diff --git a/frontend/__snapshots__/lemon-ui-lemon-skeleton--presets.png b/frontend/__snapshots__/lemon-ui-lemon-skeleton--presets.png index d26a679f4fd686155c2037a89d3232a7ab5be75c..18ea3052167f09e46645fe2d164b0e8803cb5203 100644 GIT binary patch literal 14031 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 literal 11308 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 diff --git a/frontend/src/layout/navigation-3000/components/Breadcrumbs.tsx b/frontend/src/layout/navigation-3000/components/Breadcrumbs.tsx index b818d42923c95..344d36f55f47c 100644 --- a/frontend/src/layout/navigation-3000/components/Breadcrumbs.tsx +++ b/frontend/src/layout/navigation-3000/components/Breadcrumbs.tsx @@ -124,7 +124,7 @@ interface HereProps { function Here({ breadcrumb }: HereProps): JSX.Element { return (

- {breadcrumb.name || } + {breadcrumb.name || }

) } diff --git a/frontend/src/lib/components/ActivityLog/ActivityLog.tsx b/frontend/src/lib/components/ActivityLog/ActivityLog.tsx index 9cd152bc34778..17c8c06a1ed40 100644 --- a/frontend/src/lib/components/ActivityLog/ActivityLog.tsx +++ b/frontend/src/lib/components/ActivityLog/ActivityLog.tsx @@ -39,7 +39,7 @@ const SkeletonLog = (): JSX.Element => {
- +
diff --git a/frontend/src/lib/components/CommandBar/ActionBar.tsx b/frontend/src/lib/components/CommandBar/ActionBar.tsx index c2a0a50cc7413..24069e307cd41 100644 --- a/frontend/src/lib/components/CommandBar/ActionBar.tsx +++ b/frontend/src/lib/components/CommandBar/ActionBar.tsx @@ -2,10 +2,10 @@ import { useValues } from 'kea' import { actionBarLogic } from './actionBarLogic' -import ActionInput from './ActionInput' -import ActionResults from './ActionResults' +import { ActionInput } from './ActionInput' +import { ActionResults } from './ActionResults' -const ActionBar = (): JSX.Element => { +export const ActionBar = (): JSX.Element => { const { activeFlow } = useValues(actionBarLogic) return ( @@ -15,5 +15,3 @@ const ActionBar = (): JSX.Element => { ) } - -export default ActionBar diff --git a/frontend/src/lib/components/CommandBar/ActionInput.tsx b/frontend/src/lib/components/CommandBar/ActionInput.tsx index a19a72dde307f..879b699ad1930 100644 --- a/frontend/src/lib/components/CommandBar/ActionInput.tsx +++ b/frontend/src/lib/components/CommandBar/ActionInput.tsx @@ -19,7 +19,7 @@ const PrefixIcon = ({ activeFlow }: PrefixIconProps): React.ReactElement | null } } -const ActionInput = (): JSX.Element => { +export const ActionInput = (): JSX.Element => { const { input, activeFlow } = useValues(actionBarLogic) const { setInput } = useActions(actionBarLogic) @@ -39,5 +39,3 @@ const ActionInput = (): JSX.Element => { ) } - -export default ActionInput diff --git a/frontend/src/lib/components/CommandBar/ActionResult.tsx b/frontend/src/lib/components/CommandBar/ActionResult.tsx index 777e3b2e20889..a67082f3dfc98 100644 --- a/frontend/src/lib/components/CommandBar/ActionResult.tsx +++ b/frontend/src/lib/components/CommandBar/ActionResult.tsx @@ -10,7 +10,7 @@ type SearchResultProps = { focused: boolean } -const ActionResult = ({ result, focused }: SearchResultProps): JSX.Element => { +export const ActionResult = ({ result, focused }: SearchResultProps): JSX.Element => { const { executeResult, onMouseEnterResult, onMouseLeaveResult } = useActions(actionBarLogic) const ref = useRef(null) @@ -51,5 +51,3 @@ const ActionResult = ({ result, focused }: SearchResultProps): JSX.Element => { ) } - -export default ActionResult diff --git a/frontend/src/lib/components/CommandBar/ActionResults.tsx b/frontend/src/lib/components/CommandBar/ActionResults.tsx index 9eea58c79787c..059954357506e 100644 --- a/frontend/src/lib/components/CommandBar/ActionResults.tsx +++ b/frontend/src/lib/components/CommandBar/ActionResults.tsx @@ -3,7 +3,7 @@ import { useValues } from 'kea' import { CommandResultDisplayable } from '../CommandPalette/commandPaletteLogic' import { actionBarLogic } from './actionBarLogic' -import ActionResult from './ActionResult' +import { ActionResult } from './ActionResult' import { getNameFromActionScope } from 'lib/components/CommandBar/utils' type ResultsGroupProps = { @@ -27,7 +27,7 @@ const ResultsGroup = ({ scope, results, activeResultIndex }: ResultsGroupProps): ) } -const ActionResults = (): JSX.Element => { +export const ActionResults = (): JSX.Element => { const { commandSearchResultsGrouped, activeResultIndex } = useValues(actionBarLogic) return ( @@ -38,5 +38,3 @@ const ActionResults = (): JSX.Element => { ) } - -export default ActionResults diff --git a/frontend/src/lib/components/CommandBar/CommandBar.tsx b/frontend/src/lib/components/CommandBar/CommandBar.tsx index d293518e140bc..3850051e60551 100644 --- a/frontend/src/lib/components/CommandBar/CommandBar.tsx +++ b/frontend/src/lib/components/CommandBar/CommandBar.tsx @@ -7,24 +7,43 @@ import { commandBarLogic } from './commandBarLogic' import { BarStatus } from './types' import './index.scss' -import SearchBar from './SearchBar' -import { LemonModal } from '@posthog/lemon-ui' -import ActionBar from './ActionBar' +import { SearchBar } from './SearchBar' +import { ActionBar } from './ActionBar' -function CommandBar(): JSX.Element | null { +const CommandBarOverlay = ({ children }: { children?: React.ReactNode }): JSX.Element => ( +
+ {children} +
+) + +export function CommandBar(): JSX.Element | null { const containerRef = useRef(null) const { barStatus } = useValues(commandBarLogic) const { hideCommandBar } = useActions(commandBarLogic) useOutsideClickHandler(containerRef, hideCommandBar, []) + if (barStatus === BarStatus.HIDDEN) { + return null + } + return ( - -
+ +
{barStatus === BarStatus.SHOW_SEARCH ? : }
- + ) } - -export default CommandBar diff --git a/frontend/src/lib/components/CommandBar/SearchBar.tsx b/frontend/src/lib/components/CommandBar/SearchBar.tsx index ac131202a9c4f..fad41fbfa7978 100644 --- a/frontend/src/lib/components/CommandBar/SearchBar.tsx +++ b/frontend/src/lib/components/CommandBar/SearchBar.tsx @@ -2,11 +2,11 @@ import { useMountedLogic } from 'kea' import { searchBarLogic } from './searchBarLogic' -import SearchInput from './SearchInput' -import SearchResults from './SearchResults' -import SearchTabs from './SearchTabs' +import { SearchInput } from './SearchInput' +import { SearchResults } from './SearchResults' +import { SearchTabs } from './SearchTabs' -const SearchBar = (): JSX.Element => { +export const SearchBar = (): JSX.Element => { useMountedLogic(searchBarLogic) // load initial results return ( @@ -17,5 +17,3 @@ const SearchBar = (): JSX.Element => {
) } - -export default SearchBar diff --git a/frontend/src/lib/components/CommandBar/SearchBarTab.tsx b/frontend/src/lib/components/CommandBar/SearchBarTab.tsx index af878016e9bf8..f218824187a26 100644 --- a/frontend/src/lib/components/CommandBar/SearchBarTab.tsx +++ b/frontend/src/lib/components/CommandBar/SearchBarTab.tsx @@ -10,14 +10,15 @@ type SearchBarTabProps = { count?: number | null } -const SearchBarTab = ({ type, active, count }: SearchBarTabProps): JSX.Element => { +export const SearchBarTab = ({ type, active, count }: SearchBarTabProps): JSX.Element => { const { setActiveTab } = useActions(searchBarLogic) return ( -
setActiveTab(type)}> +
setActiveTab(type)} + > {resultTypeToName[type]} {count != null && {count}}
) } - -export default SearchBarTab diff --git a/frontend/src/lib/components/CommandBar/SearchInput.tsx b/frontend/src/lib/components/CommandBar/SearchInput.tsx index 01cf8f05d32ad..40c08c942c5bb 100644 --- a/frontend/src/lib/components/CommandBar/SearchInput.tsx +++ b/frontend/src/lib/components/CommandBar/SearchInput.tsx @@ -5,7 +5,7 @@ import { KeyboardShortcut } from '~/layout/navigation-3000/components/KeyboardSh import { searchBarLogic } from './searchBarLogic' -const SearchInput = (): JSX.Element => { +export const SearchInput = (): JSX.Element => { const { searchQuery } = useValues(searchBarLogic) const { setSearchQuery } = useActions(searchBarLogic) @@ -24,5 +24,3 @@ const SearchInput = (): JSX.Element => {
) } - -export default SearchInput diff --git a/frontend/src/lib/components/CommandBar/SearchResult.tsx b/frontend/src/lib/components/CommandBar/SearchResult.tsx index 4d86c69704cfd..af88481772ff5 100644 --- a/frontend/src/lib/components/CommandBar/SearchResult.tsx +++ b/frontend/src/lib/components/CommandBar/SearchResult.tsx @@ -13,7 +13,7 @@ type SearchResultProps = { keyboardFocused: boolean } -const SearchResult = ({ result, resultIndex, focused, keyboardFocused }: SearchResultProps): JSX.Element => { +export const SearchResult = ({ result, resultIndex, focused, keyboardFocused }: SearchResultProps): JSX.Element => { const { isAutoScrolling } = useValues(searchBarLogic) const { onMouseEnterResult, onMouseLeaveResult, openResult, setIsAutoScrolling } = useActions(searchBarLogic) @@ -76,11 +76,9 @@ const SearchResult = ({ result, resultIndex, focused, keyboardFocused }: SearchR export const SearchResultSkeleton = (): JSX.Element => (
- - - + + +
) - -export default SearchResult diff --git a/frontend/src/lib/components/CommandBar/SearchResults.tsx b/frontend/src/lib/components/CommandBar/SearchResults.tsx index d8355a46597e8..1b2ab8ee00bd7 100644 --- a/frontend/src/lib/components/CommandBar/SearchResults.tsx +++ b/frontend/src/lib/components/CommandBar/SearchResults.tsx @@ -3,9 +3,9 @@ import { useValues } from 'kea' import { DetectiveHog } from '../hedgehogs' import { searchBarLogic } from './searchBarLogic' -import SearchResult, { SearchResultSkeleton } from './SearchResult' +import { SearchResult, SearchResultSkeleton } from './SearchResult' -const SearchResults = (): JSX.Element => { +export const SearchResults = (): JSX.Element => { const { filterSearchResults, searchResponseLoading, activeResultIndex, keyboardResultIndex } = useValues(searchBarLogic) @@ -38,5 +38,3 @@ const SearchResults = (): JSX.Element => { ) } - -export default SearchResults diff --git a/frontend/src/lib/components/CommandBar/SearchTabs.tsx b/frontend/src/lib/components/CommandBar/SearchTabs.tsx index e72700be4f1b1..bc83ed1110a76 100644 --- a/frontend/src/lib/components/CommandBar/SearchTabs.tsx +++ b/frontend/src/lib/components/CommandBar/SearchTabs.tsx @@ -1,10 +1,10 @@ import { useValues } from 'kea' import { searchBarLogic } from './searchBarLogic' -import SearchBarTab from './SearchBarTab' +import { SearchBarTab } from './SearchBarTab' import { ResultType } from './types' -const SearchTabs = (): JSX.Element | null => { +export const SearchTabs = (): JSX.Element | null => { const { searchResponse, activeTab } = useValues(searchBarLogic) if (!searchResponse) { @@ -12,7 +12,7 @@ const SearchTabs = (): JSX.Element | null => { } return ( -
+
{Object.entries(searchResponse.counts).map(([type, count]) => ( @@ -20,4 +20,3 @@ const SearchTabs = (): JSX.Element | null => {
) } -export default SearchTabs diff --git a/frontend/src/lib/components/CommandBar/constants.ts b/frontend/src/lib/components/CommandBar/constants.ts index 4ee4981b0715e..4b0d973cdb95a 100644 --- a/frontend/src/lib/components/CommandBar/constants.ts +++ b/frontend/src/lib/components/CommandBar/constants.ts @@ -6,7 +6,7 @@ export const resultTypeToName: Record = { cohort: 'Cohorts', dashboard: 'Dashboards', experiment: 'Experiments', - feature_flag: 'Feature Flags', + feature_flag: 'Feature flags', insight: 'Insights', } diff --git a/frontend/src/lib/components/CommandBar/searchBarLogic.ts b/frontend/src/lib/components/CommandBar/searchBarLogic.ts index c97781bf2141d..fd69e079ec1a5 100644 --- a/frontend/src/lib/components/CommandBar/searchBarLogic.ts +++ b/frontend/src/lib/components/CommandBar/searchBarLogic.ts @@ -115,8 +115,14 @@ export const searchBarLogic = kea([ // hide command bar actions.hideCommandBar() } else if (event.key === '>') { - if (values.searchQuery.length === 0) { - // transition to actions when entering '>' with empty input + const { value, selectionStart, selectionEnd } = event.target as HTMLInputElement + if ( + values.searchQuery.length === 0 || + (selectionStart !== null && + selectionEnd !== null && + (value.substring(0, selectionStart) + value.substring(selectionEnd)).length === 0) + ) { + // transition to actions when entering '>' with empty input, or when replacing the whole input event.preventDefault() actions.setCommandBar(BarStatus.SHOW_ACTIONS) } diff --git a/frontend/src/lib/components/CommandPalette/CommandPalette.tsx b/frontend/src/lib/components/CommandPalette/CommandPalette.tsx index b1bb0b416ac12..ce07fb425829c 100644 --- a/frontend/src/lib/components/CommandPalette/CommandPalette.tsx +++ b/frontend/src/lib/components/CommandPalette/CommandPalette.tsx @@ -9,7 +9,7 @@ import squeakFile from 'public/squeak.mp3' import './CommandPalette.scss' import { featureFlagLogic } from 'lib/logic/featureFlagLogic' import { FEATURE_FLAGS } from 'lib/constants' -import CommandBar from '../CommandBar/CommandBar' +import { CommandBar } from '../CommandBar/CommandBar' /** Use the new Cmd+K search when the respective feature flag is enabled. */ export function CommandPalette(): JSX.Element { diff --git a/frontend/src/lib/components/Subscriptions/views/EditSubscription.tsx b/frontend/src/lib/components/Subscriptions/views/EditSubscription.tsx index 1926ad2b7fb12..66f19b0bc54cb 100644 --- a/frontend/src/lib/components/Subscriptions/views/EditSubscription.tsx +++ b/frontend/src/lib/components/Subscriptions/views/EditSubscription.tsx @@ -119,11 +119,11 @@ export function EditSubscription({ {!subscription ? ( subscriptionLoading ? (
- + - + - +
) : ( diff --git a/frontend/src/lib/components/Subscriptions/views/ManageSubscriptions.tsx b/frontend/src/lib/components/Subscriptions/views/ManageSubscriptions.tsx index 6707c6a097c55..50c782fc12682 100644 --- a/frontend/src/lib/components/Subscriptions/views/ManageSubscriptions.tsx +++ b/frontend/src/lib/components/Subscriptions/views/ManageSubscriptions.tsx @@ -88,7 +88,7 @@ export function ManageSubscriptions({ {subscriptionsLoading && !subscriptions.length ? (
- +
) : subscriptions.length ? ( diff --git a/frontend/src/lib/lemon-ui/LemonSkeleton/LemonSkeleton.stories.tsx b/frontend/src/lib/lemon-ui/LemonSkeleton/LemonSkeleton.stories.tsx index 7bb37f0f5165b..67850000a6417 100644 --- a/frontend/src/lib/lemon-ui/LemonSkeleton/LemonSkeleton.stories.tsx +++ b/frontend/src/lib/lemon-ui/LemonSkeleton/LemonSkeleton.stories.tsx @@ -54,7 +54,7 @@ export function Presets(): JSX.Element { } >
- +
diff --git a/frontend/src/lib/lemon-ui/LemonSkeleton/LemonSkeleton.tsx b/frontend/src/lib/lemon-ui/LemonSkeleton/LemonSkeleton.tsx index 2cac518029426..6524b6d573e7b 100644 --- a/frontend/src/lib/lemon-ui/LemonSkeleton/LemonSkeleton.tsx +++ b/frontend/src/lib/lemon-ui/LemonSkeleton/LemonSkeleton.tsx @@ -5,29 +5,15 @@ import './LemonSkeleton.scss' export interface LemonSkeletonProps { className?: string - /** Height of the skeleton bar */ - height?: number /** Repeat this component this many of times */ repeat?: number /** Used in combination with repeat to progressively fade out the repeated skeletons */ fade?: boolean active?: boolean } -export function LemonSkeleton({ - className, - repeat, - height = 4, - active = true, - fade = false, -}: LemonSkeletonProps): JSX.Element { +export function LemonSkeleton({ className, repeat, active = true, fade = false }: LemonSkeletonProps): JSX.Element { const content = ( -
+
{/* The span is for accessibility, but also because @storybook/test-runner smoke tests require content */} Loading…
diff --git a/frontend/src/scenes/apps/ErrorDetailsModal.tsx b/frontend/src/scenes/apps/ErrorDetailsModal.tsx index f5cafdedde71d..926177cd552fb 100644 --- a/frontend/src/scenes/apps/ErrorDetailsModal.tsx +++ b/frontend/src/scenes/apps/ErrorDetailsModal.tsx @@ -26,7 +26,7 @@ export function ErrorDetailsModal(): JSX.Element { footer={
{errorDetailsLoading ? ( - + ) : ( <> diff --git a/frontend/src/scenes/apps/MetricsTab.tsx b/frontend/src/scenes/apps/MetricsTab.tsx index 89aed5b90fa45..b5761df9d9815 100644 --- a/frontend/src/scenes/apps/MetricsTab.tsx +++ b/frontend/src/scenes/apps/MetricsTab.tsx @@ -78,7 +78,7 @@ export function MetricsOverview({ exportFailureReason, }: MetricsOverviewProps): JSX.Element { if (metricsLoading) { - return + return } return ( diff --git a/frontend/src/scenes/batch_exports/BatchExportScene.tsx b/frontend/src/scenes/batch_exports/BatchExportScene.tsx index 148297c77d355..f8f1b778ee6bf 100644 --- a/frontend/src/scenes/batch_exports/BatchExportScene.tsx +++ b/frontend/src/scenes/batch_exports/BatchExportScene.tsx @@ -518,7 +518,7 @@ export function BatchExportScene(): JSX.Element {
) : ( - + )}
diff --git a/frontend/src/scenes/experiments/Experiment.tsx b/frontend/src/scenes/experiments/Experiment.tsx index fdc5fe554faee..381aa91a8e51d 100644 --- a/frontend/src/scenes/experiments/Experiment.tsx +++ b/frontend/src/scenes/experiments/Experiment.tsx @@ -855,10 +855,10 @@ export function ResultsTag(): JSX.Element { export function LoadingState(): JSX.Element { return (
- + - +
) } diff --git a/frontend/src/scenes/ingestion/panels/BillingPanel.tsx b/frontend/src/scenes/ingestion/panels/BillingPanel.tsx index f52269890ece0..b42fef3eb9de0 100644 --- a/frontend/src/scenes/ingestion/panels/BillingPanel.tsx +++ b/frontend/src/scenes/ingestion/panels/BillingPanel.tsx @@ -19,8 +19,8 @@ export function BillingPanel(): JSX.Element {
- - + +
diff --git a/frontend/src/scenes/insights/InsightSkeleton.tsx b/frontend/src/scenes/insights/InsightSkeleton.tsx index c376a20158586..1ee2f8c53ff97 100644 --- a/frontend/src/scenes/insights/InsightSkeleton.tsx +++ b/frontend/src/scenes/insights/InsightSkeleton.tsx @@ -4,8 +4,8 @@ export function InsightSkeleton(): JSX.Element { return ( <>
- - + +
diff --git a/frontend/src/scenes/notebooks/Nodes/NotebookNodePerson.tsx b/frontend/src/scenes/notebooks/Nodes/NotebookNodePerson.tsx index d54a338c14b5d..fa6c83a5c868b 100644 --- a/frontend/src/scenes/notebooks/Nodes/NotebookNodePerson.tsx +++ b/frontend/src/scenes/notebooks/Nodes/NotebookNodePerson.tsx @@ -92,7 +92,7 @@ const Component = ({ attributes }: NotebookNodeProps + )}
) diff --git a/frontend/src/scenes/project-homepage/ProjectHomepage.tsx b/frontend/src/scenes/project-homepage/ProjectHomepage.tsx index c8fea74e75c9c..80cc8e5b02b9f 100644 --- a/frontend/src/scenes/project-homepage/ProjectHomepage.tsx +++ b/frontend/src/scenes/project-homepage/ProjectHomepage.tsx @@ -83,7 +83,7 @@ export function ProjectHomepage(): JSX.Element { <>
- {!dashboard && } + {!dashboard && } {dashboard?.name && ( <> diff --git a/frontend/src/scenes/session-recordings/player/PlayerMeta.tsx b/frontend/src/scenes/session-recordings/player/PlayerMeta.tsx index 1baf6cfc23832..08d675cb62db1 100644 --- a/frontend/src/scenes/session-recordings/player/PlayerMeta.tsx +++ b/frontend/src/scenes/session-recordings/player/PlayerMeta.tsx @@ -99,7 +99,7 @@ export function PlayerMeta(): JSX.Element { const whitelabel = getCurrentExporterData()?.whitelabel ?? false const resolutionView = sessionPlayerMetaDataLoading ? ( - + ) : resolution ? (
{!sessionPerson || !startTime ? ( - + ) : (
@@ -186,7 +186,7 @@ export function PlayerMeta(): JSX.Element {
{sessionPlayerMetaDataLoading ? ( - + ) : sessionProperties ? ( {sessionPlayerMetaDataLoading ? ( - + ) : ( <> ) : playlistsLoading ? ( - + ) : (
No playlists found
)} diff --git a/frontend/src/scenes/session-recordings/playlist/SessionRecordingPreview.tsx b/frontend/src/scenes/session-recordings/playlist/SessionRecordingPreview.tsx index 41b2eb89817f2..d3acb8f7aa308 100644 --- a/frontend/src/scenes/session-recordings/playlist/SessionRecordingPreview.tsx +++ b/frontend/src/scenes/session-recordings/playlist/SessionRecordingPreview.tsx @@ -110,7 +110,7 @@ function ActivityIndicators({ ) }) ) : ( - + )}
) @@ -236,8 +236,8 @@ export function SessionRecordingPreview({ export function SessionRecordingPreviewSkeleton(): JSX.Element { return (
- - + +
) } diff --git a/frontend/src/scenes/session-recordings/playlist/SessionRecordingsPlaylistScene.tsx b/frontend/src/scenes/session-recordings/playlist/SessionRecordingsPlaylistScene.tsx index 447fe87662123..61f917d98ddb0 100644 --- a/frontend/src/scenes/session-recordings/playlist/SessionRecordingsPlaylistScene.tsx +++ b/frontend/src/scenes/session-recordings/playlist/SessionRecordingsPlaylistScene.tsx @@ -35,8 +35,8 @@ export function SessionRecordingsPlaylistScene(): JSX.Element { return (
- - + +
diff --git a/frontend/src/scenes/settings/project/PersonDisplayNameProperties.tsx b/frontend/src/scenes/settings/project/PersonDisplayNameProperties.tsx index df85da1d32db3..db44c40c6a962 100644 --- a/frontend/src/scenes/settings/project/PersonDisplayNameProperties.tsx +++ b/frontend/src/scenes/settings/project/PersonDisplayNameProperties.tsx @@ -17,7 +17,7 @@ export function PersonDisplayNameProperties(): JSX.Element { ) if (!currentTeam) { - return + return } return ( diff --git a/frontend/src/scenes/settings/project/ProjectSettings.tsx b/frontend/src/scenes/settings/project/ProjectSettings.tsx index ac6d40c2849a5..3d935f09e3e56 100644 --- a/frontend/src/scenes/settings/project/ProjectSettings.tsx +++ b/frontend/src/scenes/settings/project/ProjectSettings.tsx @@ -58,7 +58,7 @@ export function WebSnippet(): JSX.Element {

{currentTeamLoading && !currentTeam ? (
- +
) : ( diff --git a/frontend/src/scenes/settings/project/TimezoneConfig.tsx b/frontend/src/scenes/settings/project/TimezoneConfig.tsx index 09d7c8a70c026..719b9a94e921c 100644 --- a/frontend/src/scenes/settings/project/TimezoneConfig.tsx +++ b/frontend/src/scenes/settings/project/TimezoneConfig.tsx @@ -17,7 +17,7 @@ export function TimezoneConfig(): JSX.Element { const { updateCurrentTeam } = useActions(teamLogic) if (!preflight?.available_timezones || !currentTeam) { - return + return } const options = Object.entries(preflight.available_timezones).map(([tz, offset]) => ({ key: tz, diff --git a/frontend/src/styles/vars.scss b/frontend/src/styles/vars.scss index 5a433b34540f2..419862be8bbe3 100644 --- a/frontend/src/styles/vars.scss +++ b/frontend/src/styles/vars.scss @@ -185,7 +185,6 @@ $_lifecycle_dormant: $_danger; // Non-color vars --radius: 4px; - --shadow: 0 20px 25px -5px rgb(0 0 0 / 10%), 0 8px 10px -6px rgb(0 0 0 / 10%); --shadow-elevation: 0px 16px 16px -16px rgb(0 0 0 / 35%); --opacity-disabled: 0.6; --font-medium: 500;