From 15216eba6ae344e5304bfb5522f48eb0ac028779 Mon Sep 17 00:00:00 2001 From: Alberto Gutierrez Date: Sun, 11 Nov 2018 21:15:48 +0100 Subject: [PATCH] Commnets addressed Signed-off-by: Alberto Gutierrez --- packages/jaeger-ui/src/components/App/Page.js | 7 +- .../SearchResults/ResultItem.js | 2 +- .../SearchTracePage/SearchResults/index.js | 53 ++++-- .../SearchResults/index.test.js | 6 - .../src/components/SearchTracePage/index.js | 34 ++-- .../components/SearchTracePage/index.test.js | 19 +- .../components/TracePage/TracePageHeader.css | 11 +- .../components/TracePage/TracePageHeader.js | 106 +++-------- .../TracePage/TracePageHeaderEmbed.js | 178 ++++++++++++++++++ .../TracePage/TracePageHeaderEmbed.test.js | 54 ++++++ .../src/components/TracePage/index.js | 103 +++++----- .../src/components/TracePage/index.test.js | 8 +- .../jaeger-ui/src/utils/embedded/index.js | 25 +++ 13 files changed, 411 insertions(+), 195 deletions(-) create mode 100644 packages/jaeger-ui/src/components/TracePage/TracePageHeaderEmbed.js create mode 100644 packages/jaeger-ui/src/components/TracePage/TracePageHeaderEmbed.test.js create mode 100644 packages/jaeger-ui/src/utils/embedded/index.js diff --git a/packages/jaeger-ui/src/components/App/Page.js b/packages/jaeger-ui/src/components/App/Page.js index c4ea04bfe4..fe18c06f6a 100644 --- a/packages/jaeger-ui/src/components/App/Page.js +++ b/packages/jaeger-ui/src/components/App/Page.js @@ -20,7 +20,7 @@ import Helmet from 'react-helmet'; import { connect } from 'react-redux'; import type { Location } from 'react-router-dom'; import { withRouter } from 'react-router-dom'; - +import { isEmbed } from '../../utils/embedded'; import TopNav from './TopNav'; import { trackPageView } from '../../utils/tracking'; @@ -52,17 +52,16 @@ export class PageImpl extends React.Component { } render() { - const isEmbed = this.props.search.includes('embed'); return (
- {!isEmbed && ( + {!isEmbed(this.props.search) && (
)} - {this.props.children} + {this.props.children}
); diff --git a/packages/jaeger-ui/src/components/SearchTracePage/SearchResults/ResultItem.js b/packages/jaeger-ui/src/components/SearchTracePage/SearchResults/ResultItem.js index fd6c7fddd1..b72d93d7da 100644 --- a/packages/jaeger-ui/src/components/SearchTracePage/SearchResults/ResultItem.js +++ b/packages/jaeger-ui/src/components/SearchTracePage/SearchResults/ResultItem.js @@ -46,10 +46,10 @@ export default class ResultItem extends React.PureComponent { render() { const { + disableComparision, durationPercent, isInDiffCohort, linkTo, - disableComparision, toggleComparison, trace, } = this.props; diff --git a/packages/jaeger-ui/src/components/SearchTracePage/SearchResults/index.js b/packages/jaeger-ui/src/components/SearchTracePage/SearchResults/index.js index 82f8923bcd..d6a25b792f 100644 --- a/packages/jaeger-ui/src/components/SearchTracePage/SearchResults/index.js +++ b/packages/jaeger-ui/src/components/SearchTracePage/SearchResults/index.js @@ -15,7 +15,7 @@ // limitations under the License. import * as React from 'react'; -import { Button, Select } from 'antd'; +import { Select, Button } from 'antd'; import { Field, reduxForm, formValueSelector } from 'redux-form'; import DiffSelection from './DiffSelection'; @@ -27,6 +27,7 @@ import * as orderBy from '../../../model/order-by'; import { getPercentageOfDuration } from '../../../utils/date'; import prefixUrl from '../../../utils/prefix-url'; import reduxFormFieldAdapter from '../../../utils/redux-form-field-adapter'; +import { VERSION_API } from '../../../utils/embedded'; import type { FetchedTrace } from '../../../types'; @@ -37,11 +38,10 @@ type SearchResultsProps = { cohortRemoveTrace: string => void, diffCohort: FetchedTrace[], goToTrace: string => void, - isEmbed?: boolean, + embed?: boolean, hideGraph?: boolean, - disableComparision?: boolean, loading: boolean, - onGoFullClicked: () => void, + getSearchURL: () => string, maxTraceDuration: number, skipMessage?: boolean, traces: TraceSummary[], @@ -89,8 +89,20 @@ export default class SearchResults extends React.PureComponent; + const { + loading, + diffCohort, + skipMessage, + traces, + goToTrace, + embed, + hideGraph, + getSearchURL, + maxTraceDuration, + } = this.props; + const diffSelection = !embed && ( + + ); if (loading) { return ( @@ -111,14 +123,6 @@ export default class SearchResults extends React.PureComponent ); } - const { - goToTrace, - isEmbed, - hideGraph, - disableComparision, - onGoFullClicked, - maxTraceDuration, - } = this.props; const cohortIds = new Set(diffCohort.map(datum => datum.id)); return (
@@ -142,9 +146,14 @@ export default class SearchResults extends React.PureComponent - {isEmbed && ( + {embed && ( @@ -156,17 +165,23 @@ export default class SearchResults extends React.PureComponent
- {!disableComparision && diffSelection} + {diffSelection}
    {traces.map(trace => (
  • ))} diff --git a/packages/jaeger-ui/src/components/SearchTracePage/SearchResults/index.test.js b/packages/jaeger-ui/src/components/SearchTracePage/SearchResults/index.test.js index b70d365df7..0242f0fe15 100644 --- a/packages/jaeger-ui/src/components/SearchTracePage/SearchResults/index.test.js +++ b/packages/jaeger-ui/src/components/SearchTracePage/SearchResults/index.test.js @@ -20,7 +20,6 @@ import * as markers from './index.markers'; import ResultItem from './ResultItem'; import ScatterPlot from './ScatterPlot'; import LoadingIndicator from '../../common/LoadingIndicator'; -import DiffSelection from './DiffSelection'; describe('', () => { let wrapper; @@ -54,11 +53,6 @@ describe('', () => { expect(wrapper.find(ScatterPlot).length).toBe(0); }); - it('hide DiffSelection if queryparam disableComparision', () => { - wrapper.setProps({ disableComparision: true }); - expect(wrapper.find(DiffSelection).length).toBe(0); - }); - describe('search finished with results', () => { it('shows a scatter plot', () => { expect(wrapper.find(ScatterPlot).length).toBe(1); diff --git a/packages/jaeger-ui/src/components/SearchTracePage/index.js b/packages/jaeger-ui/src/components/SearchTracePage/index.js index 90738b4268..fb84ebaa71 100644 --- a/packages/jaeger-ui/src/components/SearchTracePage/index.js +++ b/packages/jaeger-ui/src/components/SearchTracePage/index.js @@ -30,6 +30,7 @@ import { fetchedState } from '../../constants'; import { sortTraces } from '../../model/search'; import getLastXformCacher from '../../utils/get-last-xform-cacher'; import prefixUrl from '../../utils/prefix-url'; +import { isEmbed } from '../../utils/embedded'; import './index.css'; import JaegerLogo from '../../img/jaeger-logo.svg'; @@ -60,15 +61,14 @@ export class SearchTracePageImpl extends Component { } goToTrace = traceID => { - const url = this.props.isEmbed ? `/trace/${traceID}?embed` : `/trace/${traceID}`; + const url = this.props.embed ? `/trace/${traceID}?embed` : `/trace/${traceID}`; this.props.history.push(prefixUrl(url)); }; - goFullView = () => { + getSearchURL = () => { const urlQuery = this.props.query; delete urlQuery.embed; - const url = `/search?${queryString.stringify(urlQuery)}`; - window.open(prefixUrl(url), '_blank'); + return `/search?${queryString.stringify(urlQuery)}`; }; render() { @@ -83,9 +83,8 @@ export class SearchTracePageImpl extends Component { maxTraceDuration, services, traceResults, - isEmbed, + embed, hideGraph, - disableComparision, } = this.props; const hasTraceResults = traceResults && traceResults.length > 0; const showErrors = errors && !loadingTraces; @@ -93,7 +92,7 @@ export class SearchTracePageImpl extends Component { return (
    - {!isEmbed && ( + {!embed && (

    Find Traces

    @@ -101,7 +100,7 @@ export class SearchTracePageImpl extends Component {
    )} - + {showErrors && (

    There was an error querying for traces:

    @@ -117,15 +116,14 @@ export class SearchTracePageImpl extends Component { cohortRemoveTrace={cohortRemoveTrace} diffCohort={diffCohort} skipMessage={isHomepage} - onGoFullClicked={this.goFullView} + getSearchURL={this.getSearchURL} traces={traceResults} - isEmbed={isEmbed} + embed={embed} hideGraph={hideGraph} - disableComparision={disableComparision} /> )} {showLogo && - !isEmbed && ( + !embed && ( presentation { // export to test export function mapStateToProps(state) { const query = queryString.parse(state.router.location.search); - const isEmbed = 'embed' in query; - const hideGraph = 'hideGraph' in query; - const disableComparision = 'disableComparision' in query; + const { hideGraph } = queryString.parse(state.router.location.search); const isHomepage = !Object.keys(query).length; const { traces, maxDuration, traceError, loadingTraces } = stateTraceXformer(state.trace); const diffCohort = stateTraceDiffXformer(state.trace, state.traceDiff); @@ -237,9 +232,8 @@ export function mapStateToProps(state) { return { query, diffCohort, - isEmbed, - hideGraph, - disableComparision, + embed: isEmbed(state.router.location.search), + hideGraph: hideGraph !== undefined, isHomepage, loadingServices, loadingTraces, diff --git a/packages/jaeger-ui/src/components/SearchTracePage/index.test.js b/packages/jaeger-ui/src/components/SearchTracePage/index.test.js index 904151dfa2..7a86061ef3 100644 --- a/packages/jaeger-ui/src/components/SearchTracePage/index.test.js +++ b/packages/jaeger-ui/src/components/SearchTracePage/index.test.js @@ -12,8 +12,6 @@ // See the License for the specific language governing permissions and // limitations under the License. -import prefixUrl from '../../utils/prefix-url'; - jest.mock('redux-form', () => { function reduxForm() { return component => component; @@ -50,8 +48,7 @@ describe('', () => { traceResults = [{ traceID: 'a', spans: [], processes: {} }, { traceID: 'b', spans: [], processes: {} }]; props = { traceResults, - isEmbed: false, - disableComparision: false, + embed: false, isHomepage: false, loadingServices: false, loadingTraces: false, @@ -106,21 +103,14 @@ describe('', () => { }); it('hide SearchForm if is embed', () => { - wrapper.setProps({ isEmbed: true }); + wrapper.setProps({ embed: true }); expect(wrapper.find(SearchForm).length).toBe(0); }); it('hide logo if is embed', () => { - wrapper.setProps({ isEmbed: true }); + wrapper.setProps({ embed: true }); expect(wrapper.find('.js-test-logo').length).toBe(0); }); - - it('open a window when goFullView is called', () => { - wrapper.setProps({ query: { embed: 'embed', service: 'jaeger-query' } }); - global.open = jest.fn(); - wrapper.instance().goFullView(); - expect(global.open).toBeCalledWith(prefixUrl('/search?service=jaeger-query'), '_blank'); - }); }); describe('mapStateToProps()', () => { @@ -161,9 +151,8 @@ describe('mapStateToProps()', () => { expect(diffCohort[0].data.traceID).toBe(trace.traceID); expect(rest).toEqual({ - isEmbed: false, + embed: false, hideGraph: false, - disableComparision: false, query: {}, isHomepage: true, // the redux-form `formValueSelector` mock returns `null` for "sortBy" diff --git a/packages/jaeger-ui/src/components/TracePage/TracePageHeader.css b/packages/jaeger-ui/src/components/TracePage/TracePageHeader.css index fb663ad358..1fb0c04bd4 100644 --- a/packages/jaeger-ui/src/components/TracePage/TracePageHeader.css +++ b/packages/jaeger-ui/src/components/TracePage/TracePageHeader.css @@ -19,10 +19,6 @@ limitations under the License. display: flex; } -Divider { - color: red; -} - .TracePageHeader--titleRowEmbed { align-items: center; background-color: #ececec; @@ -30,15 +26,12 @@ Divider { display: flex; } -.TracePageHeader--title { +.TracePageHeader--title, +TracePageHeader--titleEmbed { margin: 0; padding: 0.25rem 0.5rem; } -.TracePageHeader--titleEmbed { - margin: 0; - padding: 0.25rem 0.5rem; -} .TracePageHeader--title:hover { background: #f5f5f5; } diff --git a/packages/jaeger-ui/src/components/TracePage/TracePageHeader.js b/packages/jaeger-ui/src/components/TracePage/TracePageHeader.js index a657ffa704..8689264b7c 100644 --- a/packages/jaeger-ui/src/components/TracePage/TracePageHeader.js +++ b/packages/jaeger-ui/src/components/TracePage/TracePageHeader.js @@ -15,10 +15,9 @@ // limitations under the License. import * as React from 'react'; -import { Button, Dropdown, Icon, Input, Menu, Divider } from 'antd'; +import { Button, Dropdown, Icon, Input, Menu } from 'antd'; import IoChevronDown from 'react-icons/lib/io/chevron-down'; import IoChevronRight from 'react-icons/lib/io/chevron-right'; -import IoChevronLeft from 'react-icons/lib/io/chevron-left'; import IoIosFilingOutline from 'react-icons/lib/io/ios-filing-outline'; import { Link } from 'react-router-dom'; @@ -46,10 +45,6 @@ type TracePageHeaderProps = { resultCount: number, archiveButtonVisible: boolean, onArchiveClicked: () => void, - onGoBackClicked: () => void, - onGoFullViewClicked: () => void, - embed: boolean, - details: boolean, // these props are used by the `HEADER_ITEMS` // eslint-disable-next-line react/no-unused-prop-types timestamp: number, @@ -109,8 +104,6 @@ export function TracePageHeaderFn(props: TracePageHeaderProps) { name, slimView, onSlimViewClicked, - onGoBackClicked, - onGoFullViewClicked, updateTextFilter, textFilter, prevResult, @@ -118,8 +111,6 @@ export function TracePageHeaderFn(props: TracePageHeaderProps) { clearSearch, resultCount, forwardedRef, - embed, - details, } = props; if (!traceID) { @@ -179,74 +170,39 @@ export function TracePageHeaderFn(props: TracePageHeaderProps) { }, ]; - const embedComponent = ( -
    - - Go back - - -

    - {name || FALLBACK_TRACE_NAME} -

    - - View Trace - - -
    - ); - return (
    - {embed ? ( - embedComponent - ) : ( -
    - -

    - {slimView ? : } - {name || FALLBACK_TRACE_NAME} -

    -
    - - - - - +
    + +

    + {slimView ? : } + {name || FALLBACK_TRACE_NAME} +

    +
    + + + + + - {archiveButtonVisible && ( - - )} -
    - )} - {((!slimView && !embed) || (embed && details)) && ( - - )} + {archiveButtonVisible && ( + + )} +
    + {!slimView && }
    ); } diff --git a/packages/jaeger-ui/src/components/TracePage/TracePageHeaderEmbed.js b/packages/jaeger-ui/src/components/TracePage/TracePageHeaderEmbed.js new file mode 100644 index 0000000000..101285aa39 --- /dev/null +++ b/packages/jaeger-ui/src/components/TracePage/TracePageHeaderEmbed.js @@ -0,0 +1,178 @@ +// @flow + +// Copyright (c) 2017 Uber Technologies, Inc. +// +// Licensed under the Apache License, Version 2.0 (the "License"); +// you may not use this file except in compliance with the License. +// You may obtain a copy of the License at +// +// http://www.apache.org/licenses/LICENSE-2.0 +// +// Unless required by applicable law or agreed to in writing, software +// distributed under the License is distributed on an "AS IS" BASIS, +// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +// See the License for the specific language governing permissions and +// limitations under the License. + +import * as React from 'react'; +import { Input, Button } from 'antd'; +import IoChevronLeft from 'react-icons/lib/io/chevron-left'; + +import TracePageSearchBar from './TracePageSearchBar'; +import LabeledList from '../common/LabeledList'; +import { FALLBACK_TRACE_NAME } from '../../constants'; +import { formatDatetime, formatDuration } from '../../utils/date'; +import { VERSION_API } from '../../utils/embedded'; + +import './TracePageHeader.css'; + +type TracePageHeaderEmbedProps = { + traceID: string, + name: String, + slimView: boolean, + updateTextFilter: string => void, + textFilter: string, + prevResult: () => void, + nextResult: () => void, + clearSearch: () => void, + forwardedRef: { current: Input | null }, + resultCount: number, + fromSearch: string, + onGoFullViewClicked: () => void, + enableDetails: boolean, + // these props are used by the `HEADER_ITEMS` + // eslint-disable-next-line react/no-unused-prop-types + timestamp: number, + // eslint-disable-next-line react/no-unused-prop-types + duration: number, + // eslint-disable-next-line react/no-unused-prop-types + numServices: number, + // eslint-disable-next-line react/no-unused-prop-types + maxDepth: number, + // eslint-disable-next-line react/no-unused-prop-types + numSpans: number, +}; + +export const HEADER_ITEMS = [ + { + key: 'timestamp', + title: 'Trace Start', + propName: null, + renderer: (props: TracePageHeaderEmbedProps) => formatDatetime(props.timestamp), + }, + { + key: 'duration', + title: 'Duration', + propName: null, + renderer: (props: TracePageHeaderEmbedProps) => formatDuration(props.duration), + }, + { + key: 'service-count', + title: 'Services', + propName: 'numServices', + renderer: null, + }, + { + key: 'depth', + title: 'Depth', + propName: 'maxDepth', + renderer: null, + }, + { + key: 'span-count', + title: 'Total Spans', + propName: 'numSpans', + renderer: null, + }, +]; + +export function TracePageHeaderEmbedFn(props: TracePageHeaderEmbedProps) { + const { + duration, + maxDepth, + numSpans, + timestamp, + numServices, + traceID, + name, + slimView, + onGoFullViewClicked, + updateTextFilter, + textFilter, + prevResult, + nextResult, + clearSearch, + resultCount, + forwardedRef, + enableDetails, + fromSearch, + } = props; + + if (!traceID) { + return null; + } + + const overviewItems = [ + { + key: 'start', + label: 'Trace Start:', + value: formatDatetime(timestamp), + }, + { + key: 'duration', + label: 'Duration:', + value: formatDuration(duration), + }, + { + key: 'svc-count', + label: 'Services:', + value: numServices, + }, + { + key: 'depth', + label: 'Depth:', + value: maxDepth, + }, + { + key: 'span-count', + label: 'Total Spans:', + value: numSpans, + }, + ]; + + return ( +
    +
    + {fromSearch !== undefined && + fromSearch !== '' && ( + + )} +

    + {name || FALLBACK_TRACE_NAME} +

    + + +
    + {enableDetails && + !slimView && } +
    + ); +} + +// ghetto fabulous cast because the 16.3 API is not in flow yet +// https://github.com/facebook/flow/issues/6103 +export default (React: any).forwardRef((props, ref) => ( + +)); diff --git a/packages/jaeger-ui/src/components/TracePage/TracePageHeaderEmbed.test.js b/packages/jaeger-ui/src/components/TracePage/TracePageHeaderEmbed.test.js new file mode 100644 index 0000000000..fdb8aa817a --- /dev/null +++ b/packages/jaeger-ui/src/components/TracePage/TracePageHeaderEmbed.test.js @@ -0,0 +1,54 @@ +// Copyright (c) 2017 Uber Technologies, Inc. +// +// Licensed under the Apache License, Version 2.0 (the "License"); +// you may not use this file except in compliance with the License. +// You may obtain a copy of the License at +// +// http://www.apache.org/licenses/LICENSE-2.0 +// +// Unless required by applicable law or agreed to in writing, software +// distributed under the License is distributed on an "AS IS" BASIS, +// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +// See the License for the specific language governing permissions and +// limitations under the License. + +import React from 'react'; +import { shallow, mount } from 'enzyme'; + +import { TracePageHeaderEmbedFn as TracePageHeaderEmbed, HEADER_ITEMS } from './TracePageHeaderEmbed'; + +describe('', () => { + const defaultProps = { + traceID: 'some-trace-id', + name: 'some-trace-name', + textFilter: '', + updateTextFilter: () => {}, + }; + + let wrapper; + + beforeEach(() => { + wrapper = shallow(); + }); + + it('renders a
    ', () => { + expect(wrapper.find('header').length).toBe(1); + }); + + it('renders an empty
    if no traceID is present', () => { + wrapper = mount(); + expect(wrapper.children().length).toBe(0); + }); + + it('renders the trace title', () => { + const h1 = wrapper.find('h1').first(); + expect(h1.contains(defaultProps.name)).toBeTruthy(); + }); + + it('renders the header items', () => { + wrapper.find('.horizontal .item').forEach((item, i) => { + expect(item.contains(HEADER_ITEMS[i].title)).toBeTruthy(); + expect(item.contains(HEADER_ITEMS[i].renderer(defaultProps.trace))).toBeTruthy(); + }); + }); +}); diff --git a/packages/jaeger-ui/src/components/TracePage/index.js b/packages/jaeger-ui/src/components/TracePage/index.js index 931c8b9355..bedb886dbd 100644 --- a/packages/jaeger-ui/src/components/TracePage/index.js +++ b/packages/jaeger-ui/src/components/TracePage/index.js @@ -33,6 +33,7 @@ import { cancel as cancelScroll, scrollBy, scrollTo } from './scroll-page'; import ScrollManager from './ScrollManager'; import SpanGraph from './SpanGraph'; import TracePageHeader from './TracePageHeader'; +import TracePageHeaderEmbed from './TracePageHeaderEmbed'; import { trackSlimHeaderToggle } from './TracePageHeader.track'; import TraceTimelineViewer from './TraceTimelineViewer'; import ErrorMessage from '../common/ErrorMessage'; @@ -41,6 +42,7 @@ import * as jaegerApiActions from '../../actions/jaeger-api'; import { fetchedState } from '../../constants'; import { getTraceName } from '../../model/trace-viewer'; import prefixUrl from '../../utils/prefix-url'; +import { isEmbed } from '../../utils/embedded'; import type { CombokeysHandler, ShortcutCallbacks } from './keyboard-shortcuts'; import type { ViewRange, ViewRangeTimeUpdate } from './types'; @@ -57,12 +59,13 @@ type TracePageProps = { acknowledgeArchive: string => void, fetchTrace: string => void, history: RouterHistory, + searchParams: string, id: string, trace: ?FetchedTrace, - isEmbed?: boolean, - minimap?: boolean, - details?: boolean, + embed?: boolean, + enableDetails?: boolean, mapCollapsed?: boolean, + fromSearch?: string, }; type TracePageState = { @@ -162,9 +165,6 @@ export class TracePageImpl extends React.PureComponent { - this.props.history.goBack(); - }; - goFullView = () => { window.open(prefixUrl(`/trace/${this.props.id.toLowerCase()}`), '_blank'); }; render() { - const { archiveEnabled, archiveTraceState, trace, isEmbed, minimap, details } = this.props; + const { + archiveEnabled, + archiveTraceState, + trace, + embed, + mapCollapsed, + enableDetails, + searchParams, + fromSearch, + } = this.props; const { slimView, headerHeight, textFilter, viewRange, findMatchesIDs } = this.state; if (!trace || trace.state === fetchedState.LOADING) { return ; @@ -353,37 +358,46 @@ export class TracePageImpl extends React.PureComponent p.serviceName)).size; + const tracePageProps = { + duration, + maxDepth: maxSpanDepth, + name: getTraceName(spans), + numServices: numberOfServices, + numSpans: spans.length, + slimView, + timestamp: startTime, + traceID, + onSlimViewClicked: this.toggleSlimView, + textFilter, + prevResult: this._scrollManager.scrollToPrevVisibleSpan, + nextResult: this._scrollManager.scrollToNextVisibleSpan, + clearSearch: this.clearSearch, + resultCount: findMatchesIDs ? findMatchesIDs.size : 0, + updateTextFilter: this.updateTextFilter, + archiveButtonVisible: archiveEnabled, + onArchiveClicked: this.archiveTrace, + ref: this._searchBar, + }; + + const tracePageEmbedProps = { + searchParams, + fromSearch, + enableDetails, + onGoFullViewClicked: this.goFullView, + }; + return (
    {archiveEnabled && ( )}
    - - {((!slimView && !isEmbed) || (isEmbed && minimap)) && ( + {embed ? ( + + ) : ( + + )} + {((!slimView && !embed) || (embed && !mapCollapsed)) && ( ', () => { }); it('collapse map if queryparam mapCollapsed', () => { - wrapper.setProps({ mapCollapsed: true }); + wrapper.setProps({ mapCollapsed: true, embed: true }); expect(wrapper.find(SpanGraph).length).toBe(0); }); @@ -392,9 +392,9 @@ describe('mapStateToProps()', () => { expect(props).toEqual({ id, archiveEnabled: false, - isEmbed: false, - details: false, - minimap: false, + embed: false, + enableDetails: false, + fromSearch: undefined, mapCollapsed: false, archiveTraceState: undefined, trace: { data: {}, state: fetchedState.DONE }, diff --git a/packages/jaeger-ui/src/utils/embedded/index.js b/packages/jaeger-ui/src/utils/embedded/index.js new file mode 100644 index 0000000000..8c7b185ef1 --- /dev/null +++ b/packages/jaeger-ui/src/utils/embedded/index.js @@ -0,0 +1,25 @@ +// Copyright (c) 2017 Uber Technologies, Inc. +// +// Licensed under the Apache License, Version 2.0 (the "License"); +// you may not use this file except in compliance with the License. +// You may obtain a copy of the License at +// +// http://www.apache.org/licenses/LICENSE-2.0 +// +// Unless required by applicable law or agreed to in writing, software +// distributed under the License is distributed on an "AS IS" BASIS, +// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +// See the License for the specific language governing permissions and +// limitations under the License. + +import queryString from 'query-string'; + +export const VERSION_API = 'v0'; + +export function isEmbed(query: string) { + const { embed } = queryString.parse(query); + if (embed === VERSION_API) { + return true; + } + return false; +}