refactor: extract common functionality

niieani · bbrzoska · commit f22a7e34d3b5 · 2025-05-13T16:46:16.000-07:00
diff --git a/src/v3/ConsoleTraceLogger.ts b/src/v3/ConsoleTraceLogger.ts
@@ -1,15 +1,16 @@
-import {
-  DEFAULT_DEBOUNCE_DURATION,
-  DEFAULT_INTERACTIVE_TIMEOUT_DURATION,
-} from './constants'
 import type {
   AllPossibleRequiredSpanSeenEvents,
   AllPossibleStateTransitionEvents,
   AllPossibleTraceStartEvents,
 } from './debugTypes'
-import { isSuppressedError } from './debugUtils'
+import {
+  extractTimingOffsets,
+  formatMatcher,
+  getComputedResults,
+  getConfigSummary,
+  isSuppressedError,
+} from './debugUtils'
 import type { SpanMatcherFn } from './matchSpan'
-import { createTraceRecording } from './recordingComputeUtils'
 import type { FinalTransition, OnEnterStatePayload } from './Trace'
 import { isTerminalState } from './Trace'
 import type { TraceManager } from './TraceManager'
@@ -34,73 +35,6 @@ interface ConsoleLike {
   // Add other console methods if needed (warn, error, etc.)
 }
 
-/**
- * Formats a SpanMatcherFn into a more readable string representation.
- * This is a basic implementation and can be significantly improved
- * based on the actual structure of `matcher.fromDefinition`.
- *
- * @param matcher The matcher function to format.
- * @param index Optional index for generic naming.
- * @returns A string representation of the matcher.
- */
-export function formatMatcher<
-  SelectedRelationNameT extends keyof RelationSchemasT,
-  RelationSchemasT extends RelationSchemasBase<RelationSchemasT>,
-  VariantsT extends string,
->(
-  matcher: SpanMatcherFn<SelectedRelationNameT, RelationSchemasT, VariantsT>,
-  index?: number,
-): string {
-  // Check if the matcher has attached definition info
-  if (matcher.fromDefinition) {
-    // Attempt to create a more descriptive name from the definition
-    // This part needs customization based on how 'fromDefinition' is structured.
-    // Example: Check for specific properties like 'name', 'type', 'label' etc.
-    const def = matcher.fromDefinition
-    const parts: string[] = []
-
-    if (typeof def === 'object' && def !== null) {
-      // Example: Prioritize 'label' if it exists
-      if ('label' in def && typeof def.label === 'string') {
-        return `Label: "${def.label}"`
-      }
-      // Example: Use 'name' if it exists
-      if ('name' in def) {
-        if (typeof def.name === 'string') {
-          parts.push(`Name: "${def.name}"`)
-        } else if (def.name instanceof RegExp) {
-          parts.push(`Name: /${def.name.source}/${def.name.flags}`)
-        }
-      }
-      // Example: Add type if present
-      if ('type' in def && typeof def.type === 'string') {
-        parts.push(`Type: ${def.type}`)
-      }
-      // Add other relevant properties from your definition structure
-    }
-
-    if (parts.length > 0) {
-      return parts.join(', ')
-    }
-
-    // Fallback: Stringify the definition (can be verbose)
-    try {
-      const defString = JSON.stringify(def)
-      // Limit length to avoid overly long strings
-      return defString.length > 100
-        ? // eslint-disable-next-line no-magic-numbers
-          `${defString.slice(0, 97)}...`
-        : defString
-    } catch {
-      // Fallback if stringify fails
-      return `Matcher Definition #${index ?? '?'}`
-    }
-  }
-
-  // Fallback if no definition info is available
-  return `Matcher #${index ?? '?'}`
-}
-
 /**
  * Options for configuring the ConsoleTraceLogger
  */
@@ -156,45 +90,6 @@ interface TraceInfo<RelationSchemasT> {
   requiredSpans: { name: string; isMatched: boolean; matcher: Function }[]
 }
 
-/**
- * Extract timing offsets from a transition object
- */
-const extractTimingOffsets = <RelationSchemasT>(
-  transition: OnEnterStatePayload<RelationSchemasT>,
-) => {
-  // ... (implementation unchanged) ...
-  let lastRequiredSpanOffset: number | undefined
-  let completeSpanOffset: number | undefined
-  let cpuIdleSpanOffset: number | undefined
-
-  if (
-    'lastRequiredSpanAndAnnotation' in transition &&
-    transition.lastRequiredSpanAndAnnotation
-  ) {
-    lastRequiredSpanOffset =
-      transition.lastRequiredSpanAndAnnotation.annotation
-        .operationRelativeEndTime
-  }
-
-  if (
-    'completeSpanAndAnnotation' in transition &&
-    transition.completeSpanAndAnnotation
-  ) {
-    completeSpanOffset =
-      transition.completeSpanAndAnnotation.annotation.operationRelativeEndTime
-  }
-
-  if (
-    'cpuIdleSpanAndAnnotation' in transition &&
-    transition.cpuIdleSpanAndAnnotation
-  ) {
-    cpuIdleSpanOffset =
-      transition.cpuIdleSpanAndAnnotation.annotation.operationRelativeEndTime
-  }
-
-  return { lastRequiredSpanOffset, completeSpanOffset, cpuIdleSpanOffset }
-}
-
 /**
  * Format timestamp to readable time
  */
@@ -474,16 +369,7 @@ export function createConsoleTraceLogger<
     }
     log(`   Required spans: ${requiredSpans.length}`)
     // Log config summary
-    const variantConfig = trace.definition.variants[trace.input.variant]
-    const timeout = variantConfig?.timeout
-    const debounce =
-      trace.definition.debounceWindow ?? DEFAULT_DEBOUNCE_DURATION
-    const interactive =
-      typeof trace.definition.captureInteractive === 'object'
-        ? trace.definition.captureInteractive.timeout
-        : trace.definition.captureInteractive
-        ? DEFAULT_INTERACTIVE_TIMEOUT_DURATION
-        : undefined
+    const { timeout, debounce, interactive } = getConfigSummary(trace)
     log(
       `   Config: Timeout=${timeout}ms, Debounce=${debounce}ms${
         interactive ? `, Interactive=${interactive}ms` : ''
@@ -550,12 +436,13 @@ export function createConsoleTraceLogger<
         logTimingInfo(transition)
         // Log computed values and spans
         try {
-          const rec = createTraceRecording(trace, transition)
-          const computedVals = rec.computedValues
-          const { computedSpans } = rec
-          if (computedVals && Object.keys(computedVals).length > 0) {
+          const { computedValues, computedSpans } = getComputedResults(
+            trace,
+            transition,
+          )
+          if (computedValues && Object.keys(computedValues).length > 0) {
             log(
-              `   Computed Values: ${Object.entries(computedVals)
+              `   Computed Values: ${Object.entries(computedValues)
                 .map(([k, v]) => `${k}=${v}`)
                 .join(', ')}`,
             )
@@ -587,15 +474,13 @@ export function createConsoleTraceLogger<
         logTimingInfo(transition)
         // Log computed values and spans
         try {
-          const rec = createTraceRecording(
+          const { computedValues, computedSpans } = getComputedResults(
             trace,
             transition as FinalTransition<RelationSchemasT>,
           )
-          const computedVals = rec.computedValues
-          const { computedSpans } = rec
-          if (computedVals && Object.keys(computedVals).length > 0) {
+          if (computedValues && Object.keys(computedValues).length > 0) {
             log(
-              `   Computed Values: ${Object.entries(computedVals)
+              `   Computed Values: ${Object.entries(computedValues)
                 .map(([k, v]) => `${k}=${v}`)
                 .join(', ')}`,
             )
diff --git a/src/v3/TraceManagerDebugger.tsx b/src/v3/TraceManagerDebugger.tsx
@@ -1,9 +1,11 @@
 import React, { useEffect, useRef, useState } from 'react'
 import {
-  DEFAULT_DEBOUNCE_DURATION,
-  DEFAULT_INTERACTIVE_TIMEOUT_DURATION,
-} from './constants'
-import { isSuppressedError } from './debugUtils'
+  formatMatcher,
+  formatMs,
+  getComputedResults,
+  getConfigSummary,
+  isSuppressedError,
+} from './debugUtils'
 import { createTraceRecording } from './recordingComputeUtils'
 import type { SpanAndAnnotation } from './spanAnnotationTypes'
 import {
@@ -557,53 +559,6 @@ function getStateStyle(state: string) {
 
 const TRACE_HISTORY_LIMIT = 15
 
-// Add a helper to format ms
-function formatMs(ms?: number) {
-  if (ms == null) return ''
-  if (ms < 1_000) return `${ms}ms`
-  return `${(ms / 1_000).toFixed(2)}s`
-}
-
-// Add a helper to get config summary from traceContext
-function getConfigSummary<RelationSchemasT>(
-  trace: TraceInfo<RelationSchemasT>,
-) {
-  if (!trace.traceContext) return {}
-  const def = trace.traceContext.definition
-  const variant = def.variants[trace.variant]
-  const timeout = variant?.timeout
-  const debounce =
-    (def.debounceOnSpans ?? []).length > 0
-      ? def.debounceWindow ?? DEFAULT_DEBOUNCE_DURATION
-      : undefined
-  const interactive =
-    typeof def.captureInteractive === 'object'
-      ? def.captureInteractive.timeout
-      : def.captureInteractive
-      ? DEFAULT_INTERACTIVE_TIMEOUT_DURATION
-      : undefined
-  return { timeout, debounce, interactive }
-}
-
-// Add a helper to get computed values/spans for completed/interrupted traces
-function getComputedResults<RelationSchemasT>(
-  trace: TraceInfo<RelationSchemasT>,
-) {
-  if (!trace.traceContext || !trace.finalTransition) return {}
-  try {
-    const recording = createTraceRecording(
-      trace.traceContext,
-      trace.finalTransition,
-    )
-    return {
-      computedValues: recording.computedValues,
-      computedSpans: recording.computedSpans,
-    }
-  } catch {
-    return {}
-  }
-}
-
 // TraceAttributes component to display attributes as chips
 function TraceAttributes({
   attributes,
@@ -994,7 +949,9 @@ function TraceItem<
       <div style={styles.configInfoRow}>
         {/* Config summary chips */}
         {(() => {
-          const { timeout, debounce, interactive } = getConfigSummary(trace)
+          const { timeout, debounce, interactive } = trace.traceContext
+            ? getConfigSummary(trace.traceContext)
+            : {}
           return (
             <>
               {timeout != null && (
@@ -1038,7 +995,13 @@ function TraceItem<
                   {name}
                   {trace.state === 'complete' || trace.state === 'interrupted'
                     ? (() => {
-                        const { computedSpans } = getComputedResults(trace)
+                        const { computedSpans } =
+                          trace.traceContext && trace.finalTransition
+                            ? getComputedResults(
+                                trace.traceContext,
+                                trace.finalTransition,
+                              )
+                            : {}
                         if (computedSpans?.[name]) {
                           return (
                             <span style={{ marginLeft: 8, color: '#1976d2' }}>
@@ -1061,7 +1024,13 @@ function TraceItem<
                   {name}
                   {trace.state === 'complete' || trace.state === 'interrupted'
                     ? (() => {
-                        const { computedValues } = getComputedResults(trace)
+                        const { computedValues } =
+                          trace.traceContext && trace.finalTransition
+                            ? getComputedResults(
+                                trace.traceContext,
+                                trace.finalTransition,
+                              )
+                            : {}
                         if (computedValues?.[name] !== undefined) {
                           return (
                             <span style={{ marginLeft: 8, color: '#1976d2' }}>
@@ -1210,7 +1179,7 @@ export default function TraceManagerDebugger<
           ? { ...trace.input.relatedTo }
           : undefined,
         requiredSpans: trace.definition.requiredSpans.map((matcher, index) => {
-          const name = `Matcher #${index}`
+          const name = formatMatcher(matcher, index)
 
           return {
             name,
diff --git a/src/v3/debugTypes.ts b/src/v3/debugTypes.ts
@@ -129,3 +129,5 @@ export type DebugEventType =
   | 'trace-start'
   | 'state-transition'
   | 'required-span-seen'
+  | 'add-span-to-recording'
+  | 'definition-modified'
diff --git a/src/v3/debugUtils.ts b/src/v3/debugUtils.ts
