jaegertracing · IstvanCsVarga · Apr 27, 2026
@@ -5,7 +5,6 @@ import * as React from 'react';
 import { useCallback, useEffect, useMemo, useRef } from 'react';
 import { useNavigate, useLocation } from 'react-router-dom';
 import type { Location } from 'react-router-dom';
-import _get from 'lodash/get';
 import { bindActionCreators, Dispatch } from 'redux';
 import { connect, useSelector } from 'react-redux';
 
@@ -239,7 +238,7 @@ export class DeepDependencyGraphPageImpl extends React.PureComponent<TProps, TSt
   updateUrlState = (newValues: Partial<TDdgSparseUrlState>) => {
     const { baseUrl, extraUrlArgs, graphState, navigate, uiFind, urlState } = this.props;
     const getUrlArg = { uiFind, ...urlState, ...newValues, ...extraUrlArgs };
-    const hash = _get(graphState, 'model.hash');
+    const hash = graphState?.state === fetchedState.DONE ? (graphState as IDoneState).model.hash : undefined;
     if (hash) getUrlArg.hash = hash;
     navigate(getUrl(getUrlArg, baseUrl));
   };
@@ -398,7 +397,7 @@ export function mapStateToProps(state: ReduxState, ownProps: TOwnProps): TReduxP
   const showOp = urlStateShowOp !== undefined ? urlStateShowOp : operation !== undefined;
   let graphState: TDdgStateEntry | undefined;
   if (service) {
-    graphState = _get(state.ddg, getStateEntryKey({ service, operation, start: 0, end: 0 }));
+    graphState = state.ddg?.[getStateEntryKey({ service, operation, start: 0, end: 0 })];
   }
   let graph: GraphModel | undefined;
   if (graphState && graphState.state === fetchedState.DONE) {
@@ -408,7 +407,10 @@ export function mapStateToProps(state: ReduxState, ownProps: TOwnProps): TReduxP
     graph,
     graphState,
     showOp,
-    urlState: sanitizeUrlState(urlState, _get(graphState, 'model.hash')),
+    urlState: sanitizeUrlState(
+      urlState,
+      graphState?.state === fetchedState.DONE ? (graphState as IDoneState).model.hash : undefined
+    ),
     uiFind: parseUiFind(ownProps.location.search),
   };
 }
@@ -434,7 +436,7 @@ export function useDdgViewModifierBridgeProps(): TDdgViewModifierProps {
   const { service, operation } = urlState;
   const graphKey = service ? getStateEntryKey({ service, operation, start: 0, end: 0 }) : null;
   const graphState = useSelector((state: ReduxState) =>
-    graphKey ? (_get(state.ddg, graphKey) as TDdgStateEntry | undefined) : undefined
+    graphKey ? state.ddg?.[graphKey] : undefined
   );
   const hash =
     graphState && graphState.state === fetchedState.DONE ? (graphState as IDoneState).model.hash : undefined;

@@ -4,7 +4,6 @@
 import * as React from 'react';
 import { useNavigate } from 'react-router-dom';
 import type { Location } from 'react-router-dom';
-import _get from 'lodash/get';
 import memoizeOne from 'memoize-one';
 import queryString from 'query-string';
 import { connect } from 'react-redux';
@@ -59,7 +58,10 @@ export function mapStateToProps(state: ReduxState, ownProps: TOwnProps): TReduxP
     graph,
     graphState,
     showOp,
-    urlState: sanitizeUrlState(urlState, _get(graphState, 'model.hash')),
+    urlState: sanitizeUrlState(
+      urlState,
+      graphState && 'model' in graphState ? graphState.model.hash : undefined
+    ),
     ...extractUiFindFromState(state),
   };
 }

@@ -3,7 +3,6 @@
 
 import React, { useState, useCallback, useMemo, ComponentProps } from 'react';
 import { Input, Button, Tooltip, Select, Row, Col, Form, Switch } from 'antd';
-import _get from 'lodash/get';
 import logfmtParser from 'logfmt/lib/logfmt_parser';
 import { stringify as logfmtStringify } from 'logfmt/lib/stringify';
 import dayjs from 'dayjs';
@@ -828,8 +827,8 @@ export function mapStateToProps(state: ReduxState, ownProps: { search?: string }
       maxDuration: (maxDuration as string | undefined) || undefined,
       traceIDs: traceIDs || null,
     },
-    searchMaxLookback: _get(state, 'config.search.maxLookback'),
-    searchAdjustEndTime: _get(state, 'config.search.adjustEndTime'),
+    searchMaxLookback: state.config?.search?.maxLookback,
+    searchAdjustEndTime: state.config?.search?.adjustEndTime,
     submitting: state.trace?.search?.state === fetchedState.LOADING,
   };
 }

@@ -2,7 +2,6 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import { TVertexKey } from '@jaegertracing/plexus/lib/types';
-import _get from 'lodash/get';
 import _map from 'lodash/map';
 import memoizeOne from 'memoize-one';
 
@@ -20,7 +19,7 @@ function getUiFindVertexKeysFn(
   if (!uiFind) return new Set<TVertexKey>();
   const newVertexKeys: Set<TVertexKey> = new Set();
   vertices.forEach(({ key, data: { members } }) => {
-    if (_get(filterSpans(uiFind, _map(members, 'span')), 'size')) {
+    if (filterSpans(uiFind, _map(members, 'span'))?.size) {
       newVertexKeys.add(key);
     }
   });

@@ -3,7 +3,6 @@
 
 import * as React from 'react';
 import { Button, InputRef, Tooltip } from 'antd';
-import _get from 'lodash/get';
 import _maxBy from 'lodash/maxBy';
 import { IoArrowBack, IoFileTrayFull, IoChevronForward, IoWarning } from 'react-icons/io5';
 import { Link } from 'react-router-dom';
@@ -91,7 +90,7 @@ export const HEADER_ITEMS = [
   {
     key: 'depth',
     label: 'Depth',
-    renderer: (trace: IOtelTrace) => _get(_maxBy(trace.spans as any[], 'depth'), 'depth', 0) + 1,
+    renderer: (trace: IOtelTrace) => (_maxBy(trace.spans as any[], 'depth')?.depth ?? 0) + 1,
   },
   {
     key: 'span-count',

@@ -3,7 +3,6 @@
 
 import React, { useMemo } from 'react';
 import cx from 'classnames';
-import _get from 'lodash/get';
 import { connect } from 'react-redux';
 import { bindActionCreators, Dispatch } from 'redux';
 
@@ -61,10 +60,8 @@ export const UnconnectedSpanTreeOffset: React.FC<TProps> = ({
    * @param {string} ancestorId - The span id that the user was hovering over.
    */
   const handleMouseLeave = (event: React.MouseEvent<HTMLSpanElement>, ancestorId: string) => {
-    if (
-      !(event.relatedTarget instanceof HTMLSpanElement) ||
-      _get(event, 'relatedTarget.dataset.ancestorId') !== ancestorId
-    ) {
+    const rt = event.relatedTarget;
+    if (!(rt instanceof HTMLSpanElement) || rt.dataset.ancestorId !== ancestorId) {
       removeHoverIndentGuideId(ancestorId);
     }
   };
@@ -78,10 +75,8 @@ export const UnconnectedSpanTreeOffset: React.FC<TProps> = ({
    * @param {string} ancestorId - The span id that the user is now hovering over.
    */
   const handleMouseEnter = (event: React.MouseEvent<HTMLSpanElement>, ancestorId: string) => {
-    if (
-      !(event.relatedTarget instanceof HTMLSpanElement) ||
-      _get(event, 'relatedTarget.dataset.ancestorId') !== ancestorId
-    ) {
+    const rt = event.relatedTarget;
+    if (!(rt instanceof HTMLSpanElement) || rt.dataset.ancestorId !== ancestorId) {
       addHoverIndentGuideId(ancestorId);
     }
   };

@@ -8,7 +8,6 @@ import { useNormalizeTraceId } from './useNormalizeTraceId';
 import { useNavigate } from 'react-router-dom';
 import type { Location } from 'react-router-dom';
 import _clamp from 'lodash/clamp';
-import _get from 'lodash/get';
 import _mapValues from 'lodash/mapValues';
 import _memoize from 'lodash/memoize';
 import { connect } from 'react-redux';
@@ -376,10 +375,10 @@ export function TracePageImpl(props: TProps) {
   let spanFindMatches: Set<string> | null | undefined;
   if (uiFind) {
     if (viewType === ETraceViewType.TraceGraph) {
-      graphFindMatches = getUiFindVertexKeys(uiFind, _get(traceDagEV, 'vertices', []));
+      graphFindMatches = getUiFindVertexKeys(uiFind, traceDagEV?.vertices ?? []);
       findCount = graphFindMatches ? graphFindMatches.size : 0;
     } else {
-      const allMatches = filterSpansMemo(uiFind, _get(trace, 'data.spans'));
+      const allMatches = filterSpansMemo(uiFind, trace?.data?.spans);
       const otelTrace = trace?.data?.asOtelTrace?.();
       spanFindMatches =
         otelTrace && prunedServices.size > 0

@@ -2,7 +2,6 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import * as React from 'react';
-import _get from 'lodash/get';
 import queryString from 'query-string';
 
 import CircularProgressbar from '../../components/common/CircularProgressbar';
@@ -31,11 +30,12 @@ export default function extractDecorationFromState(
 
   if (!decorationID) return {};
 
-  let decorationValue = _get(state, `pathAgnosticDecorations.${decorationID}.withOp.${service}.${operation}`);
-  let decorationMax = _get(state, `pathAgnosticDecorations.${decorationID}.withOpMax`);
+  const decorationState = state.pathAgnosticDecorations[decorationID];
+  let decorationValue = decorationState?.withOp?.[service]?.[operation as string];
+  let decorationMax = decorationState?.withOpMax;
   if (!decorationValue) {
-    decorationValue = _get(state, `pathAgnosticDecorations.${decorationID}.withoutOp.${service}`);
-    decorationMax = _get(state, `pathAgnosticDecorations.${decorationID}.withoutOpMax`);
+    decorationValue = decorationState?.withoutOp?.[service];
+    decorationMax = decorationState?.withoutOpMax;
   }
 
   const decorationProgressbar =

@@ -165,6 +165,9 @@ export type Config = {
     // which allows passing functions to the configuration.
     // See https://github.com/jaegertracing/jaeger-ui/issues/652 for background.
     customWebAnalytics: IWebAnalyticsFunc | TNil;
+
+    // cookiesToDimensions maps cookie names to Google Analytics custom dimensions.
+    cookiesToDimensions?: readonly { cookie: string; dimension: string }[];
   };
 
   // linkPatterns allow customizing the display of traces with external links.

@@ -7,6 +7,7 @@ import { SearchQuery } from './search';
 import TDdgState from './TDdgState';
 import tNil from './TNil';
 import { Trace } from './trace';
+import TPathAgnosticDecorationsState from './TPathAgnosticDecorationsState';
 import TTraceTimeline from './TTraceTimeline';
 import { MetricsReduxState } from './metrics';
 
@@ -34,6 +35,7 @@ export type ReduxState = {
     loading: boolean;
     error: ApiError | TNil;
   };
+  pathAgnosticDecorations: TPathAgnosticDecorationsState;
   trace: {
     traces: Record<string, FetchedTrace>;
     search: {

@@ -1,7 +1,6 @@
 // Copyright (c) 2017 Uber Technologies, Inc.
 // SPDX-License-Identifier: Apache-2.0
 
-import _get from 'lodash/get';
 import type React from 'react';
 
 import EUpdateTypes from './EUpdateTypes';
@@ -100,7 +99,7 @@ export default class DraggableManager {
   _stopDragging() {
     window.removeEventListener('mousemove', this._handleDragEvent);
     window.removeEventListener('mouseup', this._handleDragEvent);
-    const style = _get(document, 'body.style');
+    const style = document.body?.style;
     if (style) {
       style.removeProperty('userSelect');
     }
@@ -174,7 +173,7 @@ export default class DraggableManager {
       }
       window.addEventListener('mousemove', this._handleDragEvent);
       window.addEventListener('mouseup', this._handleDragEvent);
-      const style = _get(document, 'body.style');
+      const style = document.body?.style;
       if (style) {
         style.userSelect = 'none';
       }

@@ -1,8 +1,6 @@
 // Copyright (c) 2019 Uber Technologies, Inc.
 // SPDX-License-Identifier: Apache-2.0
 
-import _get from 'lodash/get';
-
 const BASE_MATCH_SIZE = 8;
 const SCALABLE_MATCH_SIZE = 4;
 
@@ -19,7 +17,7 @@ export function setOnEdgesContainer(state: { zoomTransform?: { k: number } }) {
 
 export function setOnNodesContainer(state: { zoomTransform?: { k: number } }) {
   const { zoomTransform } = state;
-  const matchSize = BASE_MATCH_SIZE + SCALABLE_MATCH_SIZE / _get(zoomTransform, 'k', 1);
+  const matchSize = BASE_MATCH_SIZE + SCALABLE_MATCH_SIZE / (zoomTransform?.k ?? 1);
   return {
     style: {
       outline: `transparent solid ${matchSize}px`,

@@ -1,7 +1,6 @@
 // Copyright (c) 2021 The Jaeger Authors.
 // SPDX-License-Identifier: Apache-2.0
 
-import _get from 'lodash/get';
 import {
   IErrorData,
   IErrorContext,
@@ -269,10 +268,10 @@ const GA: IWebAnalyticsFunc = (config: Config, versionShort: string, versionLong
   const isTest = appEnv === 'test';
   const isDebugMode =
     (isDev && isTruish(shouldDebugGoogleAnalytics())) ||
-    isTruish(parseQuery(_get(window, 'location.search'))['ga-debug']);
-  const gaID = _get(config, 'tracking.gaID');
-  const isErrorsEnabled = isDebugMode || Boolean(_get(config, 'tracking.trackErrors'));
-  const cookiesToDimensions = _get(config, 'tracking.cookiesToDimensions');
+    isTruish(parseQuery(window.location?.search)['ga-debug']);
+  const gaID = config.tracking?.gaID;
+  const isErrorsEnabled = isDebugMode || Boolean(config.tracking?.trackErrors);
+  const cookiesToDimensions = config.tracking?.cookiesToDimensions;
   const context = isErrorsEnabled ? true : null;
   const EVENT_LENGTHS = {
     action: 499,
@@ -375,16 +374,14 @@ const GA: IWebAnalyticsFunc = (config: Config, versionShort: string, versionLong
     });
 
     if (cookiesToDimensions !== undefined) {
-      (cookiesToDimensions as unknown as Array<{ cookie: string; dimension: string }>).forEach(
-        ({ cookie, dimension }: { cookie: string; dimension: string }) => {
-          const match = ` ${document.cookie}`.match(new RegExp(`[; ]${cookie}=([^\\s;]*)`));
-          if (match) {
-            gtag('set', {
-              [dimension]: match[1],
-            });
-          } else console.warn(`${cookie} not present in cookies, could not set dimension: ${dimension}`);
-        }
-      );
+      cookiesToDimensions.forEach(({ cookie, dimension }) => {
+        const match = ` ${document.cookie}`.match(new RegExp(`[; ]${cookie}=([^\\s;]*)`));
+        if (match) {
+          gtag('set', {
+            [dimension]: match[1],
+          });
+        } else console.warn(`${cookie} not present in cookies, could not set dimension: ${dimension}`);
+      });
     }
     if (isErrorsEnabled) {
       ErrorCaptureInit({