Fix endless trace HTTP requests

src/components/App/TraceIDSearchInput.js

@@ -16,9 +16,11 @@ import PropTypes from 'prop-types';
 import React, { Component } from 'react';
 import { withRouter } from 'react-router-dom';
 
+import prefixUrl from '../../utils/prefix-url';
+
 class TraceIDSearchInput extends Component {
   goToTrace(e) {
-    this.props.history.push(`/trace/${this.traceIDInput.value}`);
+    this.props.history.push(prefixUrl(`/trace/${this.traceIDInput.value}`));
     e.preventDefault();
     return false;
   }

src/components/TracePage/index.js

@@ -20,7 +20,7 @@ import _mapValues from 'lodash/mapValues';
 import _maxBy from 'lodash/maxBy';
 import _values from 'lodash/values';
 import { connect } from 'react-redux';
-import type { Match } from 'react-router-dom';
+import type { RouterHistory, Match } from 'react-router-dom';
 import { bindActionCreators } from 'redux';
 
 import type { CombokeysHandler, ShortcutCallbacks } from './keyboard-shortcuts';
@@ -35,14 +35,16 @@ import NotFound from '../App/NotFound';
 import * as jaegerApiActions from '../../actions/jaeger-api';
 import { getTraceName } from '../../model/trace-viewer';
 import type { Trace } from '../../types';
+import prefixUrl from '../../utils/prefix-url';
 
 import './index.css';
 
 type TracePageProps = {
   fetchTrace: string => void,
-  trace: ?Trace,
-  loading: boolean,
+  history: RouterHistory,
   id: string,
+  loading: boolean,
+  trace: ?Trace,
 };
 
 type TracePageState = {
@@ -205,6 +207,11 @@ export default class TracePage extends React.PureComponent<TracePageProps, Trace
     const { fetchTrace, trace, id, loading } = this.props;
     if (!trace && !loading) {
       fetchTrace(id);
+      return;
+    }
+    const { history } = this.props;
+    if (id && id !== id.toLowerCase()) {
+      history.push(prefixUrl(`/trace/${id.toLowerCase()}`));
     }
   }
 

src/model/transform-trace-data.js

@@ -25,7 +25,12 @@ type SpanWithProcess = SpanData & { process: Process };
  * NOTE: Mutates `data` - Transform the HTTP response data into the form the app
  * generally requires.
  */
-export default function transfromTraceData(data: TraceData & { spans: SpanWithProcess[] }): Trace {
+export default function transfromTraceData(data: TraceData & { spans: SpanWithProcess[] }): ?Trace {
+  const traceID = data.traceID.toLowerCase();
+  if (!traceID) {
+    return null;
+  }
+
   let traceEndTime = 0;
   let traceStartTime = Number.MAX_SAFE_INTEGER;
   const spanIdCounts = new Map();
@@ -87,11 +92,11 @@ export default function transfromTraceData(data: TraceData & { spans: SpanWithPr
   });
   return {
     spans,
+    traceID,
     // can't use spread operator for intersection types
     // repl: https://goo.gl/4Z23MJ
     // issue: https://github.com/facebook/flow/issues/1511
     processes: data.processes,
-    traceID: data.traceID,
     duration: traceEndTime - traceStartTime,
     startTime: traceStartTime,
     endTime: traceEndTime,

src/reducers/trace.js

@@ -28,9 +28,14 @@ function fetchStarted(state) {
   return { ...state, loading: true };
 }
 
-function fetchTraceDone(state, { payload }) {
+function fetchTraceDone(state, { meta, payload }) {
   const trace = transformTraceData(payload.data[0]);
-  const traces = { ...state.traces, [trace.traceID]: trace };
+  let traces;
+  if (!trace) {
+    traces = { ...state.traces, [meta.id]: new Error('Invalid trace data recieved.') };
+  } else {
+    traces = { ...state.traces, [trace.traceID]: trace };
+  }
   return { ...state, traces, loading: false };
 }