feat(flags): support semver targeting in feature flags UI

frontend/src/lib/components/PropertyFilters/components/OperatorValueSelect.tsx

@@ -1,9 +1,12 @@
+import { useValues } from 'kea'
 import { useEffect, useState } from 'react'
 
 import { LemonDropdownProps, LemonSelect, LemonSelectProps } from '@posthog/lemon-ui'
 
 import { allOperatorsToHumanName } from 'lib/components/DefinitionPopover/utils'
+import { FEATURE_FLAGS } from 'lib/constants'
 import { dayjs } from 'lib/dayjs'
+import { featureFlagLogic } from 'lib/logic/featureFlagLogic'
 import {
     allOperatorsMapping,
     chooseOperatorMap,
@@ -13,6 +16,7 @@ import {
     isOperatorMulti,
     isOperatorRange,
     isOperatorRegex,
+    isOperatorSemver,
 } from 'lib/utils'
 
 import {
@@ -107,6 +111,8 @@ export function OperatorValueSelect({
     operatorAllowlist,
     forceSingleSelect,
 }: OperatorValueSelectProps): JSX.Element {
+    const { featureFlags } = useValues(featureFlagLogic)
+    const semverTargetingEnabled = !!featureFlags[FEATURE_FLAGS.SEMVER_TARGETING]
     const lookupKey = type === PropertyFilterType.DataWarehousePersonProperty ? 'id' : 'name'
     const propertyDefinition = propertyDefinitions.find((pd) => pd[lookupKey] === propertyKey)
 
@@ -157,6 +163,10 @@ export function OperatorValueSelect({
         const operatorMapping: Record<string, string> = chooseOperatorMap(propertyType)
 
         let operators = (Object.keys(operatorMapping) as Array<PropertyOperator>).filter((op) => {
+            // Filter out semver operators if feature flag is not enabled
+            if (!semverTargetingEnabled && isOperatorSemver(op)) {
+                return false
+            }
             return !operatorAllowlist || operatorAllowlist.includes(op)
         })
 
@@ -190,7 +200,7 @@ export function OperatorValueSelect({
             }
             setCurrentOperator(defaultProperty)
         }
-    }, [propertyDefinition, propertyKey, operator, operatorAllowlist]) // oxlint-disable-line react-hooks/exhaustive-deps
+    }, [propertyDefinition, propertyKey, operator, operatorAllowlist, semverTargetingEnabled]) // oxlint-disable-line react-hooks/exhaustive-deps
     return (
         <>
             <div data-attr="taxonomic-operator">

frontend/src/lib/components/PropertyFilters/components/PropertyValue.tsx

@@ -79,6 +79,10 @@ export function PropertyValue({
     const isAssigneeProperty =
         propertyKey && describeProperty(propertyKey, propertyDefinitionType) === PropertyType.Assignee
 
+    // TODO: Add semver input validation when a semver operator is selected.
+    // This will require detecting isOperatorSemver(operator) and validating the input
+    // matches semver format (e.g., "1.2.3", "1.2.3-alpha", etc.)
+
     const load = useCallback(
         (newInput: string | undefined): void => {
             loadPropertyValues({

frontend/src/lib/constants.tsx

@@ -334,6 +334,7 @@ export const FEATURE_FLAGS = {
     SCHEMA_MANAGEMENT: 'schema-management', // owner: @aspicer
     SEEKBAR_PREVIEW_SCRUBBING: 'seekbar-preview-scrubbing', // owner: @pauldambra #team-replay
     SESSIONS_EXPLORER: 'sessions-explorer', // owner: @jabahamondes #team-web-analytics
+    SEMVER_TARGETING: 'semver-targeting', // owner: #team-feature-flags
     SHOPIFY_DWH: 'shopify-dwh', // owner: @andrew #team-data-stack
     SHOW_REFERRER_FAVICON: 'show-referrer-favicon', // owner: @jordanm-posthog #team-web-analytics
     SHOW_REPLAY_FILTERS_FEEDBACK_BUTTON: 'show-replay-filters-feedback-button', // owner: @ksvat #team-replay

frontend/src/lib/utils.tsx

@@ -263,6 +263,15 @@ export const stringOperatorMap: Record<string, string> = {
     not_regex: "≁ doesn't match regex",
     is_set: '✓ is set',
     is_not_set: '✕ is not set',
+    semver_eq: '= equals (semver)',
+    semver_neq: '≠ not equal (semver)',
+    semver_gt: '> greater than (semver)',
+    semver_gte: '≥ greater than or equal (semver)',
+    semver_lt: '< less than (semver)',
+    semver_lte: '≤ less than or equal (semver)',
+    semver_tilde: '~ tilde range (semver)',
+    semver_caret: '^ caret range (semver)',
+    semver_wildcard: '* wildcard (semver)',
 }
 
 export const stringArrayOperatorMap: Record<string, string> = {
@@ -330,15 +339,15 @@ export const cleanedPathOperatorMap: Record<string, string> = {
 }
 
 export const semverOperatorMap: Record<string, string> = {
-    semver_eq: '= equals',
-    semver_neq: '≠ not equal',
-    semver_gt: '> greater than',
-    semver_gte: '≥ greater than or equal',
-    semver_lt: '< less than',
-    semver_lte: '≤ less than or equal',
-    semver_tilde: '~ tilde range',
-    semver_caret: '^ caret range',
-    semver_wildcard: '* wildcard',
+    semver_eq: '= equals (semver)',
+    semver_neq: '≠ not equal (semver)',
+    semver_gt: '> greater than (semver)',
+    semver_gte: '≥ greater than or equal (semver)',
+    semver_lt: '< less than (semver)',
+    semver_lte: '≤ less than or equal (semver)',
+    semver_tilde: '~ tilde range (semver)',
+    semver_caret: '^ caret range (semver)',
+    semver_wildcard: '* wildcard (semver)',
 }
 
 export const assigneeOperatorMap: Record<string, string> = {
@@ -351,7 +360,7 @@ export const allOperatorsMapping: Record<string, string> = {
     ...assigneeOperatorMap,
     ...stickinessOperatorMap,
     ...dateTimeOperatorMap,
-    ...stringOperatorMap,
+    ...semverOperatorMap,
     ...stringArrayOperatorMap,
     ...numericOperatorMap,
     ...genericOperatorMap,
@@ -361,7 +370,7 @@ export const allOperatorsMapping: Record<string, string> = {
     ...cohortOperatorMap,
     ...featureFlagOperatorMap,
     ...cleanedPathOperatorMap,
-    ...semverOperatorMap,
+    ...stringOperatorMap,
     // slight overkill to spread all of these into the map
     // but gives freedom for them to diverge more over time
 }
@@ -377,6 +386,7 @@ const operatorMappingChoice: Record<keyof typeof PropertyType, Record<string, st
     Flag: featureFlagOperatorMap,
     Assignee: assigneeOperatorMap,
     StringArray: stringArrayOperatorMap,
+    Semver: semverOperatorMap,
 }
 
 export function chooseOperatorMap(propertyType: PropertyType | undefined): Record<string, string> {
@@ -407,6 +417,20 @@ export function isOperatorRegex(operator: PropertyOperator): boolean {
     return [PropertyOperator.Regex, PropertyOperator.NotRegex].includes(operator)
 }
 
+export function isOperatorSemver(operator: PropertyOperator): boolean {
+    return [
+        PropertyOperator.SemverEq,
+        PropertyOperator.SemverNeq,
+        PropertyOperator.SemverGt,
+        PropertyOperator.SemverGte,
+        PropertyOperator.SemverLt,
+        PropertyOperator.SemverLte,
+        PropertyOperator.SemverTilde,
+        PropertyOperator.SemverCaret,
+        PropertyOperator.SemverWildcard,
+    ].includes(operator)
+}
+
 export function isOperatorRange(operator: PropertyOperator): boolean {
     return [
         PropertyOperator.GreaterThan,

frontend/src/types.ts

@@ -4000,6 +4000,7 @@ export enum PropertyType {
     Assignee = 'Assignee',
     StringArray = 'StringArray',
     Flag = 'Flag',
+    Semver = 'Semver',
 }
 
 export enum PropertyDefinitionType {

rust/feature-flags/src/properties/property_matching.rs

@@ -35,12 +35,12 @@ pub fn to_f64_representation(value: &Value) -> Option<f64> {
 
 /// Strip 'v' prefix if present (e.g., "v1.2.3" -> "1.2.3")
 fn normalize_version_string(version: &str) -> &str {
-    version.strip_prefix('v').unwrap_or(version)
+    version.strip_prefix('v').unwrap_or(version).trim()
 }
 
 pub fn to_semver_representation(value: &Value) -> Option<Version> {
     let version_string = to_string_representation(value);
-    let normalized = normalize_version_string(&version_string).trim();
+    let normalized = normalize_version_string(&version_string);
     // TODO: Build metadata (e.g., "1.0.0+build.1") is not currently supported because
     // our `sortableSemver` method in ClickHouse/HogQL doesn't support it yet.
     // For semver equality checks, use regular string equality operators instead.
@@ -298,7 +298,7 @@ pub fn match_property(
 
             // Build the version requirement string based on the operator
             let version_string = to_string_representation(value);
-            let normalized_version = normalize_version_string(&version_string).trim();
+            let normalized_version = normalize_version_string(&version_string);
 
             let requirement_string = match operator {
                 OperatorType::SemverTilde => format!("~{normalized_version}"),