fix(cdp): example event timeframe + error (#25360)

PostHog · Oct 3, 2024 · 50f9e4f · 50f9e4f
1 parent 32e56c7
commit 50f9e4f
Show file tree

Hide file tree

Showing 3 changed files with 31 additions and 7 deletions.
diff --git a/frontend/src/scenes/pipeline/hogfunctions/HogFunctionTest.tsx b/frontend/src/scenes/pipeline/hogfunctions/HogFunctionTest.tsx
@@ -56,7 +56,7 @@ export function HogFunctionTestPlaceholder(): JSX.Element {
 }
 
 export function HogFunctionTest(props: HogFunctionTestLogicProps): JSX.Element {
-    const { isTestInvocationSubmitting, testResult, expanded, sampleGlobalsLoading } = useValues(
+    const { isTestInvocationSubmitting, testResult, expanded, sampleGlobalsLoading, sampleGlobalsError } = useValues(
         hogFunctionTestLogic(props)
     )
     const { submitTestInvocation, setTestResult, toggleExpanded, loadSampleGlobals } = useActions(
@@ -181,12 +181,15 @@ export function HogFunctionTest(props: HogFunctionTestLogicProps): JSX.Element {
                                 <LemonField name="globals" label="Test invocation context">
                                     {({ value, onChange }) => (
                                         <>
-                                            <div className="flex items-start justify-end">
+                                            <div>
                                                 <p className="flex-1">
                                                     The globals object is the context in which your function will be
                                                     tested. It should contain all the data that your function will need
                                                     to run
                                                 </p>
+                                                {sampleGlobalsError ? (
+                                                    <p className="text-warning">{sampleGlobalsError}</p>
+                                                ) : null}
                                             </div>
 
                                             <HogFunctionTestEditor value={value} onChange={onChange} />

diff --git a/frontend/src/scenes/pipeline/hogfunctions/hogFunctionConfigurationLogic.tsx b/frontend/src/scenes/pipeline/hogfunctions/hogFunctionConfigurationLogic.tsx
@@ -185,6 +185,7 @@ export const hogFunctionConfigurationLogic = kea<hogFunctionConfigurationLogicTy
         loadSampleGlobals: true,
         setUnsavedConfiguration: (configuration: HogFunctionConfigurationType | null) => ({ configuration }),
         persistForUnload: true,
+        setSampleGlobalsError: (error) => ({ error }),
     }),
     reducers({
         showSource: [
@@ -215,8 +216,16 @@ export const hogFunctionConfigurationLogic = kea<hogFunctionConfigurationLogicTy
                     configuration ? { timestamp: Date.now(), configuration } : null,
             },
         ],
+
+        sampleGlobalsError: [
+            null as null | string,
+            {
+                loadSampleGlobals: () => null,
+                setSampleGlobalsError: (_, { error }) => error,
+            },
+        ],
     }),
-    loaders(({ props, values }) => ({
+    loaders(({ actions, props, values }) => ({
         template: [
             null as HogFunctionTemplateType | null,
             {
@@ -320,9 +329,17 @@ export const hogFunctionConfigurationLogic = kea<hogFunctionConfigurationLogicTy
             null as HogFunctionInvocationGlobals | null,
             {
                 loadSampleGlobals: async (_, breakpoint) => {
+                    const errorMessage =
+                        'No events match these filters in the last 30 days. Showing an example $pageview event instead.'
                     try {
                         await breakpoint(values.sampleGlobals === null ? 10 : 1000)
-                        const response = await performQuery(values.lastEventQuery)
+                        let response = await performQuery(values.lastEventQuery)
+                        if (!response?.results?.[0]) {
+                            response = await performQuery(values.lastEventSecondQuery)
+                        }
+                        if (!response?.results?.[0]) {
+                            throw new Error(errorMessage)
+                        }
                         const event: EventType = response?.results?.[0]?.[0]
                         const person: PersonType = response?.results?.[0]?.[1]
                         const globals = convertToHogFunctionInvocationGlobals(event, person)
@@ -350,7 +367,8 @@ export const hogFunctionConfigurationLogic = kea<hogFunctionConfigurationLogicTy
                             url: window.location.href.split('#')[0],
                         }
                         return globals
-                    } catch (e) {
+                    } catch (e: any) {
+                        actions.setSampleGlobalsError(e.message ?? errorMessage)
                         return values.exampleInvocationGlobals
                     }
                 },
@@ -651,7 +669,10 @@ export const hogFunctionConfigurationLogic = kea<hogFunctionConfigurationLogicTy
             },
             { resultEqualityCheck: equal },
         ],
-
+        lastEventSecondQuery: [
+            (s) => [s.lastEventQuery],
+            (lastEventQuery): EventsQuery => ({ ...lastEventQuery, after: '-30d' }),
+        ],
         templateHasChanged: [
             (s) => [s.hogFunction, s.configuration],
             (hogFunction, configuration) => {

diff --git a/frontend/src/scenes/pipeline/hogfunctions/hogFunctionTestLogic.tsx b/frontend/src/scenes/pipeline/hogfunctions/hogFunctionTestLogic.tsx
@@ -31,7 +31,7 @@ export const hogFunctionTestLogic = kea<hogFunctionTestLogicType>([
     connect((props: HogFunctionTestLogicProps) => ({
         values: [
             hogFunctionConfigurationLogic({ id: props.id }),
-            ['configuration', 'configurationHasErrors', 'sampleGlobals', 'sampleGlobalsLoading'],
+            ['configuration', 'configurationHasErrors', 'sampleGlobals', 'sampleGlobalsLoading', 'sampleGlobalsError'],
             groupsModel,
             ['groupTypes'],
         ],