diff --git a/frontend/__snapshots__/components-properties-table--dollar-properties-on-person-hidden--dark.png b/frontend/__snapshots__/components-properties-table--dollar-properties-on-person-hidden--dark.png new file mode 100644 index 0000000000000..cb009d55395dd Binary files /dev/null and b/frontend/__snapshots__/components-properties-table--dollar-properties-on-person-hidden--dark.png differ diff --git a/frontend/__snapshots__/components-properties-table--dollar-properties-on-person-hidden--light.png b/frontend/__snapshots__/components-properties-table--dollar-properties-on-person-hidden--light.png new file mode 100644 index 0000000000000..4c8ac367ea329 Binary files /dev/null and b/frontend/__snapshots__/components-properties-table--dollar-properties-on-person-hidden--light.png differ diff --git a/frontend/__snapshots__/components-properties-table--dollar-properties-on-person-searchable--dark.png b/frontend/__snapshots__/components-properties-table--dollar-properties-on-person-searchable--dark.png new file mode 100644 index 0000000000000..d8a5618560ff3 Binary files /dev/null and b/frontend/__snapshots__/components-properties-table--dollar-properties-on-person-searchable--dark.png differ diff --git a/frontend/__snapshots__/components-properties-table--dollar-properties-on-person-searchable--light.png b/frontend/__snapshots__/components-properties-table--dollar-properties-on-person-searchable--light.png new file mode 100644 index 0000000000000..88a2b1085bae5 Binary files /dev/null and b/frontend/__snapshots__/components-properties-table--dollar-properties-on-person-searchable--light.png differ diff --git a/frontend/__snapshots__/lemon-ui-lemon-checkbox--bordered--dark.png b/frontend/__snapshots__/lemon-ui-lemon-checkbox--bordered--dark.png index 6dba78ce8a720..9b3f25ef524ce 100644 Binary files a/frontend/__snapshots__/lemon-ui-lemon-checkbox--bordered--dark.png and b/frontend/__snapshots__/lemon-ui-lemon-checkbox--bordered--dark.png differ diff --git a/frontend/__snapshots__/lemon-ui-lemon-checkbox--bordered--light.png b/frontend/__snapshots__/lemon-ui-lemon-checkbox--bordered--light.png index 92b06894e5bdd..f24e45c527717 100644 Binary files a/frontend/__snapshots__/lemon-ui-lemon-checkbox--bordered--light.png and b/frontend/__snapshots__/lemon-ui-lemon-checkbox--bordered--light.png differ diff --git a/frontend/__snapshots__/lemon-ui-lemon-checkbox--overview--dark.png b/frontend/__snapshots__/lemon-ui-lemon-checkbox--overview--dark.png index 9d11b77a107be..aadf83a5cca37 100644 Binary files a/frontend/__snapshots__/lemon-ui-lemon-checkbox--overview--dark.png and b/frontend/__snapshots__/lemon-ui-lemon-checkbox--overview--dark.png differ diff --git a/frontend/__snapshots__/lemon-ui-lemon-checkbox--overview--light.png b/frontend/__snapshots__/lemon-ui-lemon-checkbox--overview--light.png index 467fff8f7e1ca..6020cb5ecb1bb 100644 Binary files a/frontend/__snapshots__/lemon-ui-lemon-checkbox--overview--light.png and b/frontend/__snapshots__/lemon-ui-lemon-checkbox--overview--light.png differ diff --git a/frontend/__snapshots__/lemon-ui-lemon-field--fields-with-kea-form--dark.png b/frontend/__snapshots__/lemon-ui-lemon-field--fields-with-kea-form--dark.png index 25f23db23c6e6..8fbdfe8b76fef 100644 Binary files a/frontend/__snapshots__/lemon-ui-lemon-field--fields-with-kea-form--dark.png and b/frontend/__snapshots__/lemon-ui-lemon-field--fields-with-kea-form--dark.png differ diff --git a/frontend/__snapshots__/lemon-ui-lemon-field--fields-with-kea-form--light.png b/frontend/__snapshots__/lemon-ui-lemon-field--fields-with-kea-form--light.png index 8e192d169ba4f..25d4b1bc1c185 100644 Binary files a/frontend/__snapshots__/lemon-ui-lemon-field--fields-with-kea-form--light.png and b/frontend/__snapshots__/lemon-ui-lemon-field--fields-with-kea-form--light.png differ diff --git a/frontend/__snapshots__/lemon-ui-lemon-field--pure-fields--dark.png b/frontend/__snapshots__/lemon-ui-lemon-field--pure-fields--dark.png index 24eac264804e4..99779f0baae6d 100644 Binary files a/frontend/__snapshots__/lemon-ui-lemon-field--pure-fields--dark.png and b/frontend/__snapshots__/lemon-ui-lemon-field--pure-fields--dark.png differ diff --git a/frontend/__snapshots__/lemon-ui-lemon-field--pure-fields--light.png b/frontend/__snapshots__/lemon-ui-lemon-field--pure-fields--light.png index df046c562eb4f..24cf27496c843 100644 Binary files a/frontend/__snapshots__/lemon-ui-lemon-field--pure-fields--light.png and b/frontend/__snapshots__/lemon-ui-lemon-field--pure-fields--light.png differ diff --git a/frontend/__snapshots__/lemon-ui-lemon-progress-circle--overview--dark.png b/frontend/__snapshots__/lemon-ui-lemon-progress-circle--overview--dark.png index f271cd3ec278a..50a7c500c0453 100644 Binary files a/frontend/__snapshots__/lemon-ui-lemon-progress-circle--overview--dark.png and b/frontend/__snapshots__/lemon-ui-lemon-progress-circle--overview--dark.png differ diff --git a/frontend/__snapshots__/lemon-ui-lemon-progress-circle--overview--light.png b/frontend/__snapshots__/lemon-ui-lemon-progress-circle--overview--light.png index e703172e04fa2..966d2e5bd7c3c 100644 Binary files a/frontend/__snapshots__/lemon-ui-lemon-progress-circle--overview--light.png and b/frontend/__snapshots__/lemon-ui-lemon-progress-circle--overview--light.png differ diff --git a/frontend/__snapshots__/scenes-other-billing--billing-unsubscribe-modal--dark.png b/frontend/__snapshots__/scenes-other-billing--billing-unsubscribe-modal--dark.png index f1495e24cf60f..83009eedca75c 100644 Binary files a/frontend/__snapshots__/scenes-other-billing--billing-unsubscribe-modal--dark.png and b/frontend/__snapshots__/scenes-other-billing--billing-unsubscribe-modal--dark.png differ diff --git a/frontend/__snapshots__/scenes-other-billing--billing-unsubscribe-modal--light.png b/frontend/__snapshots__/scenes-other-billing--billing-unsubscribe-modal--light.png index e751008bc5d59..1ef92fbabedfa 100644 Binary files a/frontend/__snapshots__/scenes-other-billing--billing-unsubscribe-modal--light.png and b/frontend/__snapshots__/scenes-other-billing--billing-unsubscribe-modal--light.png differ diff --git a/frontend/__snapshots__/scenes-other-billing--billing-unsubscribe-modal-data-pipelines--dark.png b/frontend/__snapshots__/scenes-other-billing--billing-unsubscribe-modal-data-pipelines--dark.png index bb709a5c87410..b646b463af3f0 100644 Binary files a/frontend/__snapshots__/scenes-other-billing--billing-unsubscribe-modal-data-pipelines--dark.png and b/frontend/__snapshots__/scenes-other-billing--billing-unsubscribe-modal-data-pipelines--dark.png differ diff --git a/frontend/__snapshots__/scenes-other-billing--billing-unsubscribe-modal-data-pipelines--light.png b/frontend/__snapshots__/scenes-other-billing--billing-unsubscribe-modal-data-pipelines--light.png index 3bda7cb85e52f..475c2c0eff0ef 100644 Binary files a/frontend/__snapshots__/scenes-other-billing--billing-unsubscribe-modal-data-pipelines--light.png and b/frontend/__snapshots__/scenes-other-billing--billing-unsubscribe-modal-data-pipelines--light.png differ diff --git a/frontend/src/lib/components/PropertiesTable/PropertiesTable.stories.tsx b/frontend/src/lib/components/PropertiesTable/PropertiesTable.stories.tsx index 440000f5200b5..9f2ab2f83704f 100644 --- a/frontend/src/lib/components/PropertiesTable/PropertiesTable.stories.tsx +++ b/frontend/src/lib/components/PropertiesTable/PropertiesTable.stories.tsx @@ -1,4 +1,7 @@ import { Meta, StoryFn } from '@storybook/react' +import { useActions } from 'kea' +import { userPreferencesLogic } from 'lib/logic/userPreferencesLogic' +import { useEffect } from 'react' import { PropertyDefinitionType } from '~/types' @@ -46,7 +49,7 @@ export const DollarPropertiesOnEvent: StoryFn = () => { return } -export const DollarPropertiesOnPerson: StoryFn = () => { +export const DollarPropertiesOnPersonSearchable: StoryFn = () => { const properties = { pineapple_enjoyment_score: 3, $browser: 'Chrome', @@ -56,5 +59,24 @@ export const DollarPropertiesOnPerson: StoryFn = () => { $initial_utm_campaign: 'summer_sale', $initial_geoip_country_code: 'US', } - return + return +} + +export const DollarPropertiesOnPersonHidden: StoryFn = () => { + const { setHidePostHogPropertiesInTable } = useActions(userPreferencesLogic) + + useEffect(() => setHidePostHogPropertiesInTable(true), []) + + const properties = { + pineapple_enjoyment_score: 3, + $browser: 'Chrome', + utm_campaign: 'summer_sale', + $geoip_country_code: 'US', + $initial_browser: 'Chrome', + $initial_utm_campaign: 'summer_sale', + $initial_geoip_country_code: 'US', + } + return ( + + ) } diff --git a/frontend/src/lib/components/PropertiesTable/PropertiesTable.tsx b/frontend/src/lib/components/PropertiesTable/PropertiesTable.tsx index b245d5db8bae4..296317e5d7e7b 100644 --- a/frontend/src/lib/components/PropertiesTable/PropertiesTable.tsx +++ b/frontend/src/lib/components/PropertiesTable/PropertiesTable.tsx @@ -9,9 +9,9 @@ import { LemonButton } from 'lib/lemon-ui/LemonButton' import { LemonTable, LemonTableColumns, LemonTableProps } from 'lib/lemon-ui/LemonTable' import { userPreferencesLogic } from 'lib/logic/userPreferencesLogic' import { + CLOUD_INTERNAL_POSTHOG_PROPERTY_KEYS, CORE_FILTER_DEFINITIONS_BY_GROUP, getCoreFilterDefinition, - NON_DOLLAR_POSTHOG_PROPERTY_KEYS, PROPERTY_KEYS, } from 'lib/taxonomy' import { isURL } from 'lib/utils' @@ -249,8 +249,8 @@ export function PropertiesTable({ if (filterable && hidePostHogPropertiesInTable) { entries = entries.filter(([key]) => { - const isPostHogProperty = key.startsWith('$') && PROPERTY_KEYS.includes(key) - const isNonDollarPostHogProperty = isCloudOrDev && NON_DOLLAR_POSTHOG_PROPERTY_KEYS.includes(key) + const isPostHogProperty = key.startsWith('$') || PROPERTY_KEYS.includes(key) + const isNonDollarPostHogProperty = isCloudOrDev && CLOUD_INTERNAL_POSTHOG_PROPERTY_KEYS.includes(key) return !isPostHogProperty && !isNonDollarPostHogProperty }) } @@ -410,9 +410,10 @@ export function PropertiesTable({ {searchable && ( )} diff --git a/frontend/src/lib/lemon-ui/LemonCheckbox/LemonCheckbox.scss b/frontend/src/lib/lemon-ui/LemonCheckbox/LemonCheckbox.scss index 6af35383fcc7e..b991fcd6121a3 100644 --- a/frontend/src/lib/lemon-ui/LemonCheckbox/LemonCheckbox.scss +++ b/frontend/src/lib/lemon-ui/LemonCheckbox/LemonCheckbox.scss @@ -1,4 +1,6 @@ .LemonCheckbox { + --lemon-checkbox-height: calc(2.125rem + 3px); // Medium size button height + button shadow height; + display: flex; align-items: center; width: fit-content; @@ -88,7 +90,7 @@ line-height: 1.4; label { - min-height: 2.5rem; + min-height: var(--lemon-checkbox-height); padding: 0 0.75rem; background: var(--bg-light); border: 1px solid var(--border); diff --git a/frontend/src/lib/taxonomy.tsx b/frontend/src/lib/taxonomy.tsx index 76c60960eec8e..a578556789410 100644 --- a/frontend/src/lib/taxonomy.tsx +++ b/frontend/src/lib/taxonomy.tsx @@ -158,7 +158,7 @@ export const CORE_FILTER_DEFINITIONS_BY_GROUP = { description: 'Automatically captured exceptions from the client Sentry integration', }, $web_vitals: { - label: 'Web vitals', + label: 'Web Vitals', description: 'Automatically captured web vitals data', }, // Mobile SDKs events @@ -1417,7 +1417,7 @@ export const PROPERTY_KEYS = Object.keys(CORE_FILTER_DEFINITIONS_BY_GROUP.event_ * but often more numerous than actual properties set on events and useful to hide * to make those properties discoverable */ -export const NON_DOLLAR_POSTHOG_PROPERTY_KEYS = [ +export const CLOUD_INTERNAL_POSTHOG_PROPERTY_KEYS = [ 'billing_period_end', 'billing_period_start', 'current_amount_usd.data_warehouse', @@ -1443,6 +1443,13 @@ export const NON_DOLLAR_POSTHOG_PROPERTY_KEYS = [ 'custom_limits.product_analytics', 'custom_limits.session_replay', 'custom_limits.surveys', + 'custom_limits_usd.data_warehouse', + 'custom_limits_usd.feature_flags', + 'custom_limits_usd.integrations', + 'custom_limits_usd.platform_and_support', + 'custom_limits_usd.product_analytics', + 'custom_limits_usd.session_replay', + 'custom_limits_usd.surveys', 'free_allocation.data_warehouse', 'free_allocation.feature_flags', 'free_allocation.integrations', diff --git a/frontend/src/scenes/session-recordings/player/inspector/components/eventPropertyFilteringLogic.ts b/frontend/src/scenes/session-recordings/player/inspector/components/eventPropertyFilteringLogic.ts index 2f3ca7b84ae6c..ee56f834a4515 100644 --- a/frontend/src/scenes/session-recordings/player/inspector/components/eventPropertyFilteringLogic.ts +++ b/frontend/src/scenes/session-recordings/player/inspector/components/eventPropertyFilteringLogic.ts @@ -1,6 +1,6 @@ import { connect, kea, path, selectors } from 'kea' import { userPreferencesLogic } from 'lib/logic/userPreferencesLogic' -import { NON_DOLLAR_POSTHOG_PROPERTY_KEYS, PROPERTY_KEYS } from 'lib/taxonomy' +import { CLOUD_INTERNAL_POSTHOG_PROPERTY_KEYS, PROPERTY_KEYS } from 'lib/taxonomy' import { preflightLogic } from 'scenes/PreflightCheck/preflightLogic' import type { eventPropertyFilteringLogicType } from './eventPropertyFilteringLogicType' @@ -50,7 +50,7 @@ export const eventPropertyFilteringLogic = kea( Object.entries(props).filter(([key]) => { const isPostHogProperty = key.startsWith('$') && PROPERTY_KEYS.includes(key) const isNonDollarPostHogProperty = - isCloudOrDev && NON_DOLLAR_POSTHOG_PROPERTY_KEYS.includes(key) + isCloudOrDev && CLOUD_INTERNAL_POSTHOG_PROPERTY_KEYS.includes(key) return !isPostHogProperty && !isNonDollarPostHogProperty }) ) diff --git a/frontend/src/scenes/teamLogic.tsx b/frontend/src/scenes/teamLogic.tsx index 2ebf076409061..3f6d102270525 100644 --- a/frontend/src/scenes/teamLogic.tsx +++ b/frontend/src/scenes/teamLogic.tsx @@ -260,7 +260,7 @@ export const teamLogic = kea([ if (switchedTeam) { lemonToast.info( <> - You've switched to project + You've switched to project{' '} {values.featureFlags[FEATURE_FLAGS.ENVIRONMENTS] ? `${currentProject?.name}, environment ${currentTeam?.name}` : currentTeam?.name}