snapshot cleanup

PostHog · Dec 20, 2024 · ed7a7d7 · ed7a7d7
1 parent 24451bd
commit ed7a7d7
Show file tree

Hide file tree

Showing 5 changed files with 29 additions and 63 deletions.
diff --git a/frontend/src/lib/components/Errors/ErrorDisplay.stories.tsx b/frontend/src/lib/components/Errors/ErrorDisplay.stories.tsx
@@ -82,8 +82,8 @@ function errorProperties(properties: Record<string, any>): EventType['properties
             customer: 'the-customer',
             instance: 'https://app.posthog.com',
         },
-        $exception_message: 'ResizeObserver loop limit exceeded',
-        $exception_type: 'Error',
+        // $exception_message: 'ResizeObserver loop limit exceeded',
+        // $exception_type: 'Error',
         $exception_fingerprint: 'Error',
         $exception_personURL: 'https://app.posthog.com/person/the-person-id',
         $sentry_event_id: 'id-from-the-sentry-integration',
@@ -135,42 +135,37 @@ function errorProperties(properties: Record<string, any>): EventType['properties
         $lib_version__major: 1,
         $lib_version__minor: 63,
         $lib_version__patch: 3,
+        $exception_list: [
+            {
+                value: 'ResizeObserver loop limit exceeded',
+                type: 'Error',
+            },
+        ],
         ...properties,
     }
 }
 
-export function ResizeObserverLoopLimitExceeded(): JSX.Element {
+export function StacktracelessSafariScriptError(): JSX.Element {
     return (
         <ErrorDisplay
             eventProperties={errorProperties({
-                $exception_message: 'ResizeObserver loop limit exceeded',
-                $exception_type: 'Error',
-                $exception_personURL: 'https://app.posthog.com/person/the-person-id',
+                $exception_list: [{ type: 'ScriptError', value: 'Script error.', mechanism: { synthetic: true } }],
             })}
         />
     )
 }
 
-export function SafariScriptError(): JSX.Element {
+export function StacktracelessImportModuleError(): JSX.Element {
     return (
         <ErrorDisplay
             eventProperties={errorProperties({
-                $exception_type: 'Error',
-                $exception_message: 'Script error.',
-                $exception_is_synthetic: true,
-            })}
-        />
-    )
-}
-
-export function ImportingModule(): JSX.Element {
-    return (
-        <ErrorDisplay
-            eventProperties={errorProperties({
-                $exception_type: 'UnhandledRejection',
-                $exception_message: "Importing module '/static/chunk-PIJHGO7Q.js' is not found.",
-                $exception_list: [],
-                $exception_handled: false,
+                $exception_list: [
+                    {
+                        type: 'UnhandledRejection',
+                        value: "Importing module '/static/chunk-PIJHGO7Q.js' is not found.",
+                        mechanism: { handled: true },
+                    },
+                ],
             })}
         />
     )
@@ -207,8 +202,6 @@ export function ChainedErrorStack(): JSX.Element {
     return (
         <ErrorDisplay
             eventProperties={errorProperties({
-                $exception_type: 'ZeroDivisionError',
-                $exception_message: 'division by zero',
                 $exception_list: [
                     {
                         module: null,
@@ -285,7 +278,7 @@ export function StackTraceWithLineContext(): JSX.Element {
     )
 }
 
-export function Stacktraceless(): JSX.Element {
+export function WithCymbalErrors(): JSX.Element {
     return (
         <ErrorDisplay
             eventProperties={errorProperties({
@@ -295,22 +288,20 @@ export function Stacktraceless(): JSX.Element {
                         value: 'wat123',
                     },
                 ],
+                $cymbal_errors: ['This is an ingestion error', 'This is a second one'],
             })}
         />
     )
 }
 
-export function WithCymbalErrors(): JSX.Element {
+export function LegacyEventProperties(): JSX.Element {
     return (
         <ErrorDisplay
             eventProperties={errorProperties({
-                $exception_list: [
-                    {
-                        type: 'Error',
-                        value: 'wat123',
-                    },
-                ],
-                $cymbal_errors: ['This is an ingestion error', 'This is a second one'],
+                $exception_message: 'ResizeObserver loop limit exceeded',
+                $exception_type: 'Error',
+                $exception_personURL: 'https://app.posthog.com/person/the-person-id',
+                $exception_synthetic: true,
             })}
         />
     )

diff --git a/frontend/src/lib/components/Errors/ErrorDisplay.tsx b/frontend/src/lib/components/Errors/ErrorDisplay.tsx
@@ -3,7 +3,6 @@ import { useActions, useValues } from 'kea'
 import { TitledSnack } from 'lib/components/TitledSnack'
 import { LemonDivider } from 'lib/lemon-ui/LemonDivider'
 import { LemonSwitch } from 'lib/lemon-ui/LemonSwitch'
-import { LemonTag } from 'lib/lemon-ui/LemonTag/LemonTag'
 import { Link } from 'lib/lemon-ui/Link'
 import { getExceptionAttributes, hasAnyInAppFrames, hasStacktrace } from 'scenes/error-tracking/utils'
 
@@ -14,27 +13,16 @@ import { ChainedStackTraces } from './StackTraces'
 import { ErrorTrackingException } from './types'
 
 export function ErrorDisplay({ eventProperties }: { eventProperties: EventType['properties'] }): JSX.Element {
-    const {
-        type,
-        value,
-        synthetic,
-        library,
-        browser,
-        os,
-        sentryUrl,
-        exceptionList,
-        level,
-        ingestionErrors,
-        unhandled,
-    } = getExceptionAttributes(eventProperties)
+    const { type, value, library, browser, os, sentryUrl, exceptionList, level, ingestionErrors, unhandled } =
+        getExceptionAttributes(eventProperties)
 
     const exceptionWithStack = hasStacktrace(exceptionList)
 
     return (
         <div className="flex flex-col space-y-2 pb-2">
             <h1 className="mb-0">{type || level}</h1>
+            {!exceptionWithStack && <div className="text-muted italic">{value}</div>}
             <div className="flex flex-row gap-2 flex-wrap">
-                <LemonTag type="danger">{value}</LemonTag>
                 <TitledSnack
                     type="success"
                     title="captured by"
@@ -52,8 +40,7 @@ export function ErrorDisplay({ eventProperties }: { eventProperties: EventType['
                         )
                     }
                 />
-                <TitledSnack title="synthetic" value={synthetic ?? false} />
-                <TitledSnack title="unhandled" value={unhandled} />
+                <TitledSnack title="unhandled" value={String(unhandled)} />
                 <TitledSnack title="library" value={library} />
                 <TitledSnack title="browser" value={browser ?? 'unknown'} />
                 <TitledSnack title="os" value={os ?? 'unknown'} />

diff --git a/frontend/src/scenes/error-tracking/ErrorTracking.scss b/frontend/src/scenes/error-tracking/ErrorTracking.scss
@@ -17,10 +17,6 @@
         max-width: 300px;
     }
 
-    & .Playlist__list {
-        width: 100%;
-    }
-
     & .SessionRecordingPlayer {
         height: 24rem;
     }

diff --git a/frontend/src/scenes/error-tracking/errorTrackingIssueSceneLogic.ts b/frontend/src/scenes/error-tracking/errorTrackingIssueSceneLogic.ts
@@ -77,7 +77,6 @@ export const errorTrackingIssueSceneLogic = kea<errorTrackingIssueSceneLogicType
                             dateRange: values.dateRange,
                             filterTestAccounts: values.filterTestAccounts,
                             filterGroup: values.filterGroup,
-                            sparklineSelectedPeriod: '7d',
                         }),
                         {},
                         undefined,

diff --git a/frontend/src/scenes/error-tracking/queries.ts b/frontend/src/scenes/error-tracking/queries.ts
@@ -122,21 +122,14 @@ export const errorTrackingIssueQuery = ({
     dateRange,
     filterTestAccounts,
     filterGroup,
-    sparklineSelectedPeriod,
 }: {
     issueId: string
     dateRange: DateRange
     filterTestAccounts: boolean
     filterGroup: UniversalFiltersGroup
-} & {
-    sparklineSelectedPeriod: string
 }): ErrorTrackingQuery => {
-    const { value, displayAs, offsetHours } = parseSparklineSelection(sparklineSelectedPeriod)
-    const { labels, data } = generateSparklineProps({ value, displayAs, offsetHours })
-
     return {
         kind: NodeKind.ErrorTrackingQuery,
-        select: [`<Sparkline data={${data}} labels={[${labels.join(',')}]} /> as volume`],
         issueId: issueId,
         dateRange: dateRange,
         filterGroup: filterGroup as PropertyGroupFilter,