chore(experiments): Rename client-side code to 'Shared Metrics' (#27375)

PostHog · Jan 9, 2025 · 5c0e29c · 5c0e29c
1 parent fd8f7b5
commit 5c0e29c
Show file tree

Hide file tree

Showing 20 changed files with 318 additions and 318 deletions.
diff --git a/frontend/src/scenes/appScenes.ts b/frontend/src/scenes/appScenes.ts
@@ -29,8 +29,8 @@ export const appScenes: Record<Scene, () => any> = {
     [Scene.Group]: () => import('./groups/Group'),
     [Scene.Action]: () => import('./actions/Action'),
     [Scene.Experiments]: () => import('./experiments/Experiments'),
-    [Scene.ExperimentsSavedMetrics]: () => import('./experiments/SavedMetrics/SavedMetrics'),
-    [Scene.ExperimentsSavedMetric]: () => import('./experiments/SavedMetrics/SavedMetric'),
+    [Scene.ExperimentsSharedMetrics]: () => import('./experiments/SharedMetrics/SharedMetrics'),
+    [Scene.ExperimentsSharedMetric]: () => import('./experiments/SharedMetrics/SharedMetric'),
     [Scene.Experiment]: () => import('./experiments/Experiment'),
     [Scene.FeatureFlags]: () => import('./feature-flags/FeatureFlags'),
     [Scene.FeatureManagement]: () => import('./feature-flags/FeatureManagement'),

diff --git a/frontend/src/scenes/experiments/ExperimentView/ExperimentView.tsx b/frontend/src/scenes/experiments/ExperimentView/ExperimentView.tsx
@@ -8,7 +8,7 @@ import { ExperimentImplementationDetails } from '../ExperimentImplementationDeta
 import { experimentLogic } from '../experimentLogic'
 import { MetricModal } from '../Metrics/MetricModal'
 import { MetricSourceModal } from '../Metrics/MetricSourceModal'
-import { SavedMetricModal } from '../Metrics/SavedMetricModal'
+import { SharedMetricModal } from '../Metrics/SharedMetricModal'
 import { MetricsView } from '../MetricsView/MetricsView'
 import {
     ExperimentLoadingAnimation,
@@ -194,8 +194,8 @@ export function ExperimentView(): JSX.Element {
                         <MetricModal experimentId={experimentId} isSecondary={true} />
                         <MetricModal experimentId={experimentId} isSecondary={false} />
 
-                        <SavedMetricModal experimentId={experimentId} isSecondary={true} />
-                        <SavedMetricModal experimentId={experimentId} isSecondary={false} />
+                        <SharedMetricModal experimentId={experimentId} isSecondary={true} />
+                        <SharedMetricModal experimentId={experimentId} isSecondary={false} />
 
                         <DistributionModal experimentId={experimentId} />
                         <ReleaseConditionsModal experimentId={experimentId} />

diff --git a/frontend/src/scenes/experiments/Experiments.tsx b/frontend/src/scenes/experiments/Experiments.tsx
@@ -24,7 +24,7 @@ import { Experiment, ExperimentsTabs, ProductKey, ProgressStatus } from '~/types
 import { experimentsLogic, getExperimentStatus } from './experimentsLogic'
 import { StatusTag } from './ExperimentView/components'
 import { Holdouts } from './Holdouts'
-import { SavedMetrics } from './SavedMetrics/SavedMetrics'
+import { SharedMetrics } from './SharedMetrics/SharedMetrics'
 
 export const scene: SceneExport = {
     component: Experiments,
@@ -222,15 +222,15 @@ export function Experiments(): JSX.Element {
                     { key: ExperimentsTabs.Archived, label: 'Archived experiments' },
                     { key: ExperimentsTabs.Holdouts, label: 'Holdout groups' },
                     ...(featureFlags[FEATURE_FLAGS.EXPERIMENTS_MULTIPLE_METRICS]
-                        ? [{ key: ExperimentsTabs.SavedMetrics, label: 'Shared metrics' }]
+                        ? [{ key: ExperimentsTabs.SharedMetrics, label: 'Shared metrics' }]
                         : []),
                 ]}
             />
 
             {tab === ExperimentsTabs.Holdouts ? (
                 <Holdouts />
-            ) : tab === ExperimentsTabs.SavedMetrics && featureFlags[FEATURE_FLAGS.EXPERIMENTS_MULTIPLE_METRICS] ? (
-                <SavedMetrics />
+            ) : tab === ExperimentsTabs.SharedMetrics && featureFlags[FEATURE_FLAGS.EXPERIMENTS_MULTIPLE_METRICS] ? (
+                <SharedMetrics />
             ) : (
                 <>
                     {tab === ExperimentsTabs.Archived ? (

diff --git a/frontend/src/scenes/experiments/Metrics/MetricSourceModal.tsx b/frontend/src/scenes/experiments/Metrics/MetricSourceModal.tsx
@@ -20,16 +20,16 @@ export function MetricSourceModal({
         closePrimaryMetricSourceModal,
         closeSecondaryMetricSourceModal,
         openPrimaryMetricModal,
-        openPrimarySavedMetricModal,
+        openPrimarySharedMetricModal,
         openSecondaryMetricModal,
-        openSecondarySavedMetricModal,
+        openSecondarySharedMetricModal,
     } = useActions(experimentLogic({ experimentId }))
 
     const metricsField = isSecondary ? 'metrics_secondary' : 'metrics'
     const isOpen = isSecondary ? isSecondaryMetricSourceModalOpen : isPrimaryMetricSourceModalOpen
     const closeCurrentModal = isSecondary ? closeSecondaryMetricSourceModal : closePrimaryMetricSourceModal
     const openMetricModal = isSecondary ? openSecondaryMetricModal : openPrimaryMetricModal
-    const openSavedMetricModal = isSecondary ? openSecondarySavedMetricModal : openPrimarySavedMetricModal
+    const openSharedMetricModal = isSecondary ? openSecondarySharedMetricModal : openPrimarySharedMetricModal
 
     return (
         <LemonModal isOpen={isOpen} onClose={closeCurrentModal} width={1000} title="Choose metric source">
@@ -57,7 +57,7 @@ export function MetricSourceModal({
                     className="flex-1 cursor-pointer p-4 rounded border hover:border-primary-3000"
                     onClick={() => {
                         closeCurrentModal()
-                        openSavedMetricModal(null)
+                        openSharedMetricModal(null)
                     }}
                 >
                     <div className="font-semibold">

diff --git a/.../experiments/Metrics/SavedMetricModal.tsx → ...experiments/Metrics/SharedMetricModal.tsx b/.../experiments/Metrics/SavedMetricModal.tsx → ...experiments/Metrics/SharedMetricModal.tsx
@@ -8,40 +8,40 @@ import { Experiment } from '~/types'
 
 import { experimentLogic } from '../experimentLogic'
 import { MetricDisplayFunnels, MetricDisplayTrends } from '../ExperimentView/Goal'
-import { SavedMetric } from '../SavedMetrics/savedMetricLogic'
+import { SharedMetric } from '../SharedMetrics/sharedMetricLogic'
 
-export function SavedMetricModal({
+export function SharedMetricModal({
     experimentId,
     isSecondary,
 }: {
     experimentId: Experiment['id']
     isSecondary?: boolean
 }): JSX.Element {
-    const { savedMetrics, isPrimarySavedMetricModalOpen, isSecondarySavedMetricModalOpen, editingSavedMetricId } =
+    const { sharedMetrics, isPrimarySharedMetricModalOpen, isSecondarySharedMetricModalOpen, editingSharedMetricId } =
         useValues(experimentLogic({ experimentId }))
     const {
-        closePrimarySavedMetricModal,
-        closeSecondarySavedMetricModal,
-        addSavedMetricToExperiment,
-        removeSavedMetricFromExperiment,
+        closePrimarySharedMetricModal,
+        closeSecondarySharedMetricModal,
+        addSharedMetricToExperiment,
+        removeSharedMetricFromExperiment,
     } = useActions(experimentLogic({ experimentId }))
 
-    const [selectedMetricId, setSelectedMetricId] = useState<SavedMetric['id'] | null>(null)
+    const [selectedMetricId, setSelectedMetricId] = useState<SharedMetric['id'] | null>(null)
     const [mode, setMode] = useState<'create' | 'edit'>('create')
 
     useEffect(() => {
-        if (editingSavedMetricId) {
-            setSelectedMetricId(editingSavedMetricId)
+        if (editingSharedMetricId) {
+            setSelectedMetricId(editingSharedMetricId)
             setMode('edit')
         }
-    }, [editingSavedMetricId])
+    }, [editingSharedMetricId])
 
-    if (!savedMetrics) {
+    if (!sharedMetrics) {
         return <></>
     }
 
-    const isOpen = isSecondary ? isSecondarySavedMetricModalOpen : isPrimarySavedMetricModalOpen
-    const closeModal = isSecondary ? closeSecondarySavedMetricModal : closePrimarySavedMetricModal
+    const isOpen = isSecondary ? isSecondarySharedMetricModalOpen : isPrimarySharedMetricModalOpen
+    const closeModal = isSecondary ? closeSecondarySharedMetricModal : closePrimarySharedMetricModal
 
     return (
         <LemonModal
@@ -52,11 +52,11 @@ export function SavedMetricModal({
             footer={
                 <div className="flex justify-between w-full">
                     <div>
-                        {editingSavedMetricId && (
+                        {editingSharedMetricId && (
                             <LemonButton
                                 status="danger"
                                 onClick={() => {
-                                    removeSavedMetricFromExperiment(editingSavedMetricId)
+                                    removeSharedMetricFromExperiment(editingSharedMetricId)
                                 }}
                                 type="secondary"
                             >
@@ -74,7 +74,7 @@ export function SavedMetricModal({
                             <LemonButton
                                 onClick={() => {
                                     if (selectedMetricId) {
-                                        addSavedMetricToExperiment(selectedMetricId, {
+                                        addSharedMetricToExperiment(selectedMetricId, {
                                             type: isSecondary ? 'secondary' : 'primary',
                                         })
                                     }
@@ -91,9 +91,9 @@ export function SavedMetricModal({
         >
             {mode === 'create' && (
                 <div className="flex gap-4 mb-4">
-                    {savedMetrics.length > 0 ? (
+                    {sharedMetrics.length > 0 ? (
                         <LemonSelect
-                            options={savedMetrics.map((metric: SavedMetric) => ({
+                            options={sharedMetrics.map((metric: SharedMetric) => ({
                                 label: metric.name,
                                 value: metric.id,
                             }))}
@@ -110,7 +110,7 @@ export function SavedMetricModal({
                             type="info"
                             action={{
                                 children: 'New shared metric',
-                                to: urls.experimentsSavedMetric('new'),
+                                to: urls.experimentsSharedMetric('new'),
                             }}
                         >
                             You don't have any shared metrics yet. Shared metrics let you create reusable metrics that
@@ -123,7 +123,7 @@ export function SavedMetricModal({
             {selectedMetricId && (
                 <div>
                     {(() => {
-                        const metric = savedMetrics.find((m: SavedMetric) => m.id === selectedMetricId)
+                        const metric = sharedMetrics.find((m: SharedMetric) => m.id === selectedMetricId)
                         if (!metric) {
                             return <></>
                         }
@@ -135,7 +135,7 @@ export function SavedMetricModal({
                                     <Link
                                         target="_blank"
                                         className="font-semibold flex items-center"
-                                        to={urls.experimentsSavedMetric(metric.id)}
+                                        to={urls.experimentsSharedMetric(metric.id)}
                                     >
                                         <IconOpenInNew fontSize="18" />
                                     </Link>

diff --git a/frontend/src/scenes/experiments/MetricsView/DeltaChart.tsx b/frontend/src/scenes/experiments/MetricsView/DeltaChart.tsx
@@ -108,8 +108,8 @@ export function DeltaChart({
     const {
         openPrimaryMetricModal,
         openSecondaryMetricModal,
-        openPrimarySavedMetricModal,
-        openSecondarySavedMetricModal,
+        openPrimarySharedMetricModal,
+        openSecondarySharedMetricModal,
     } = useActions(experimentLogic)
     const [tooltipData, setTooltipData] = useState<{ x: number; y: number; variant: string } | null>(null)
     const [emptyStateTooltipVisible, setEmptyStateTooltipVisible] = useState(true)
@@ -229,11 +229,11 @@ export function DeltaChart({
                                     size="xsmall"
                                     icon={<IconPencil fontSize="12" />}
                                     onClick={() => {
-                                        if (metric.isSavedMetric) {
+                                        if (metric.isSharedMetric) {
                                             if (isSecondary) {
-                                                openSecondarySavedMetricModal(metric.savedMetricId)
+                                                openSecondarySharedMetricModal(metric.sharedMetricId)
                                             } else {
-                                                openPrimarySavedMetricModal(metric.savedMetricId)
+                                                openPrimarySharedMetricModal(metric.sharedMetricId)
                                             }
                                             return
                                         }
@@ -247,7 +247,7 @@ export function DeltaChart({
                                 <LemonTag type="muted" size="small">
                                     {metric.kind === 'ExperimentFunnelsQuery' ? 'Funnel' : 'Trend'}
                                 </LemonTag>
-                                {metric.isSavedMetric && (
+                                {metric.isSharedMetric && (
                                     <LemonTag type="option" size="small">
                                         Shared
                                     </LemonTag>

diff --git a/frontend/src/scenes/experiments/MetricsView/MetricsView.tsx b/frontend/src/scenes/experiments/MetricsView/MetricsView.tsx
@@ -104,17 +104,17 @@ export function MetricsView({ isSecondary }: { isSecondary?: boolean }): JSX.Ele
     const hasSomeResults = results?.some((result) => result?.insight)
 
     let metrics = isSecondary ? experiment.metrics_secondary : experiment.metrics
-    const savedMetrics = experiment.saved_metrics
-        .filter((savedMetric) => savedMetric.metadata.type === (isSecondary ? 'secondary' : 'primary'))
-        .map((savedMetric) => ({
-            ...savedMetric.query,
-            name: savedMetric.name,
-            savedMetricId: savedMetric.saved_metric,
-            isSavedMetric: true,
+    const sharedMetrics = experiment.saved_metrics
+        .filter((sharedMetric) => sharedMetric.metadata.type === (isSecondary ? 'secondary' : 'primary'))
+        .map((sharedMetric) => ({
+            ...sharedMetric.query,
+            name: sharedMetric.name,
+            sharedMetricId: sharedMetric.saved_metric,
+            isSharedMetric: true,
         }))
 
-    if (savedMetrics) {
-        metrics = [...metrics, ...savedMetrics]
+    if (sharedMetrics) {
+        metrics = [...metrics, ...sharedMetrics]
     }
 
     // Calculate the maximum absolute value across ALL metrics

diff --git a/frontend/src/scenes/experiments/SavedMetrics/savedMetricsLogic.tsx b/frontend/src/scenes/experiments/SavedMetrics/savedMetricsLogic.tsx