Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Move up redux from SpanTreeOffset #529

Draft
wants to merge 2 commits into
base: main
Choose a base branch
from
Draft

Move up redux from SpanTreeOffset #529

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
e884e7c
Move redux up from VirtualizedTraceView
aocenas Feb 5, 2020
56b37bf
Move redux up from spanTreeOffset
aocenas Feb 21, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
9 changes: 9 additions & 0 deletions packages/jaeger-ui/src/components/TracePage/TraceTimelineViewer/SpanBarRow.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -53,6 +53,9 @@ type SpanBarRowProps = {
traceStartTime: number;
span: Span;
focusSpan: (spanID: string) => void;
hoverIndentGuideIds: Set<string>;
addHoverIndentGuideId: (spanID: string) => void;
removeHoverIndentGuideId: (spanID: string) => void;
};

/**
Expand Down Expand Up @@ -92,6 +95,9 @@ export default class SpanBarRow extends React.PureComponent<SpanBarRowProps> {
traceStartTime,
span,
focusSpan,
hoverIndentGuideIds,
addHoverIndentGuideId,
removeHoverIndentGuideId,
} = this.props;
const {
duration,
Expand Down Expand Up @@ -130,6 +136,9 @@ export default class SpanBarRow extends React.PureComponent<SpanBarRowProps> {
childrenVisible={isChildrenExpanded}
span={span}
onClick={isParent ? this._childrenToggle : undefined}
hoverIndentGuideIds={hoverIndentGuideIds}
addHoverIndentGuideId={addHoverIndentGuideId}
removeHoverIndentGuideId={removeHoverIndentGuideId}
/>
<a
className={`span-name ${isDetailExpanded ? 'is-detail-expanded' : ''}`}
Expand Down
14 changes: 13 additions & 1 deletion packages/jaeger-ui/src/components/TracePage/TraceTimelineViewer/SpanDetailRow.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -38,6 +38,9 @@ type SpanDetailRowProps = {
tagsToggle: (spanID: string) => void;
traceStartTime: number;
focusSpan: (uiFind: string) => void;
hoverIndentGuideIds: Set<string>;
addHoverIndentGuideId: (spanID: string) => void;
removeHoverIndentGuideId: (spanID: string) => void;
};

export default class SpanDetailRow extends React.PureComponent<SpanDetailRowProps> {
Expand All @@ -64,11 +67,20 @@ export default class SpanDetailRow extends React.PureComponent<SpanDetailRowProp
tagsToggle,
traceStartTime,
focusSpan,
hoverIndentGuideIds,
addHoverIndentGuideId,
removeHoverIndentGuideId,
} = this.props;
return (
<TimelineRow className="detail-row">
<TimelineRow.Cell width={columnDivision}>
<SpanTreeOffset span={span} showChildrenIcon={false} />
<SpanTreeOffset
span={span}
showChildrenIcon={false}
hoverIndentGuideIds={hoverIndentGuideIds}
addHoverIndentGuideId={addHoverIndentGuideId}
removeHoverIndentGuideId={removeHoverIndentGuideId}
/>
<span>
<span
className="detail-row-expanded-accent"
Expand Down
33 changes: 4 additions & 29 deletions packages/jaeger-ui/src/components/TracePage/TraceTimelineViewer/SpanTreeOffset.test.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@ import React from 'react';
import IoChevronRight from 'react-icons/lib/io/chevron-right';
import IoIosArrowDown from 'react-icons/lib/io/ios-arrow-down';

import { mapDispatchToProps, mapStateToProps, UnconnectedSpanTreeOffset } from './SpanTreeOffset';
import SpanTreeOffset from './SpanTreeOffset';
import spanAncestorIdsSpy from '../../../utils/span-ancestor-ids';

jest.mock('../../../utils/span-ancestor-ids');
Expand All @@ -42,13 +42,13 @@ describe('SpanTreeOffset', () => {
spanID: ownSpanID,
},
};
wrapper = shallow(<UnconnectedSpanTreeOffset {...props} />);
wrapper = shallow(<SpanTreeOffset {...props} />);
});

describe('.SpanTreeOffset--indentGuide', () => {
it('renders only one .SpanTreeOffset--indentGuide for entire trace if span has no ancestors', () => {
spanAncestorIdsSpy.mockReturnValue([]);
wrapper = shallow(<UnconnectedSpanTreeOffset {...props} />);
wrapper = shallow(<SpanTreeOffset {...props} />);
const indentGuides = wrapper.find('.SpanTreeOffset--indentGuide');
expect(indentGuides.length).toBe(1);
expect(indentGuides.prop('data-ancestor-id')).toBe(specialRootID);
Expand All @@ -64,7 +64,7 @@ describe('SpanTreeOffset', () => {

it('adds .is-active to correct indentGuide', () => {
props.hoverIndentGuideIds = new Set([parentSpanID]);
wrapper = shallow(<UnconnectedSpanTreeOffset {...props} />);
wrapper = shallow(<SpanTreeOffset {...props} />);
const activeIndentGuide = wrapper.find('.is-active');
expect(activeIndentGuide.length).toBe(1);
expect(activeIndentGuide.prop('data-ancestor-id')).toBe(parentSpanID);
Expand Down Expand Up @@ -141,29 +141,4 @@ describe('SpanTreeOffset', () => {
expect(props.removeHoverIndentGuideId).toHaveBeenCalledWith(ownSpanID);
});
});

describe('mapDispatchToProps()', () => {
it('creates the actions correctly', () => {
expect(mapDispatchToProps(() => {})).toEqual({
addHoverIndentGuideId: expect.any(Function),
removeHoverIndentGuideId: expect.any(Function),
});
});
});

describe('mapStateToProps()', () => {
it('maps state to props correctly', () => {
const hoverIndentGuideIds = new Set([parentSpanID]);
const state = {
traceTimeline: {
hoverIndentGuideIds,
},
};
const mappedProps = mapStateToProps(state);
expect(mappedProps).toEqual({
hoverIndentGuideIds,
});
expect(mappedProps.hoverIndentGuideIds).toBe(hoverIndentGuideIds);
});
});
});
33 changes: 6 additions & 27 deletions packages/jaeger-ui/src/components/TracePage/TraceTimelineViewer/SpanTreeOffset.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,30 +17,24 @@ import cx from 'classnames';
import _get from 'lodash/get';
import IoChevronRight from 'react-icons/lib/io/chevron-right';
import IoIosArrowDown from 'react-icons/lib/io/ios-arrow-down';
import { connect } from 'react-redux';
import { bindActionCreators, Dispatch } from 'redux';

import { actions } from './duck';
import { ReduxState } from '../../../types';
import { Span } from '../../../types/trace';
import spanAncestorIds from '../../../utils/span-ancestor-ids';

import './SpanTreeOffset.css';

type TDispatchProps = {
addHoverIndentGuideId: (spanID: string) => void;
removeHoverIndentGuideId: (spanID: string) => void;
};

type TProps = TDispatchProps & {
type TProps = {
childrenVisible?: boolean;
hoverIndentGuideIds: Set<string>;
onClick?: () => void;
span: Span;
showChildrenIcon?: boolean;

hoverIndentGuideIds: Set<string>;
addHoverIndentGuideId: (spanID: string) => void;
removeHoverIndentGuideId: (spanID: string) => void;
};

export class UnconnectedSpanTreeOffset extends React.PureComponent<TProps> {
export default class SpanTreeOffset extends React.PureComponent<TProps> {
ancestorIds: string[];

static defaultProps = {
Expand Down Expand Up @@ -126,18 +120,3 @@ export class UnconnectedSpanTreeOffset extends React.PureComponent<TProps> {
);
}
}

export function mapStateToProps(state: ReduxState): { hoverIndentGuideIds: Set<string> } {
const { hoverIndentGuideIds } = state.traceTimeline;
return { hoverIndentGuideIds };
}

export function mapDispatchToProps(dispatch: Dispatch<ReduxState>): TDispatchProps {
const { addHoverIndentGuideId, removeHoverIndentGuideId } = bindActionCreators(actions, dispatch);
return { addHoverIndentGuideId, removeHoverIndentGuideId };
}

export default connect(
mapStateToProps,
mapDispatchToProps
)(UnconnectedSpanTreeOffset);
26 changes: 2 additions & 24 deletions packages/jaeger-ui/src/components/TracePage/TraceTimelineViewer/VirtualizedTraceView.test.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,18 +18,16 @@ import ListView from './ListView';
import SpanBarRow from './SpanBarRow';
import DetailState from './SpanDetail/DetailState';
import SpanDetailRow from './SpanDetailRow';
import { DEFAULT_HEIGHTS, VirtualizedTraceViewImpl } from './VirtualizedTraceView';
import VirtualizedTraceView, { DEFAULT_HEIGHTS } from './VirtualizedTraceView';
import traceGenerator from '../../../demo/trace-generators';
import transformTraceData from '../../../model/transform-trace-data';
import updateUiFindSpy from '../../../utils/update-ui-find';

jest.mock('./SpanTreeOffset');
jest.mock('../../../utils/update-ui-find');

describe('<VirtualizedTraceViewImpl>', () => {
let wrapper;
let instance;
const focusUiFindMatchesMock = jest.fn();

const trace = transformTraceData(traceGenerator.trace({ numberOfSpans: 10 }));
const props = {
Expand All @@ -47,18 +45,11 @@ describe('<VirtualizedTraceViewImpl>', () => {
registerAccessors: jest.fn(),
scrollToFirstVisibleSpan: jest.fn(),
setSpanNameColumnWidth: jest.fn(),
focusUiFindMatches: focusUiFindMatchesMock,
setTrace: jest.fn(),
shouldScrollToFirstUiFindMatch: false,
spanNameColumnWidth: 0.5,
trace,
uiFind: 'uiFind',
history: {
replace: () => {},
},
location: {
search: null,
},
};

function expandRow(rowIndex) {
Expand Down Expand Up @@ -97,7 +88,7 @@ describe('<VirtualizedTraceViewImpl>', () => {
props[key].mockReset();
}
});
wrapper = shallow(<VirtualizedTraceViewImpl {...props} />);
wrapper = shallow(<VirtualizedTraceView {...props} />);
instance = wrapper.instance();
});

Expand Down Expand Up @@ -400,17 +391,4 @@ describe('<VirtualizedTraceViewImpl>', () => {
});
});
});

describe('focusSpan', () => {
it('calls updateUiFind and focusUiFindMatches', () => {
const spanName = 'span1';
instance.focusSpan(spanName);
expect(updateUiFindSpy).toHaveBeenLastCalledWith({
history: props.history,
location: props.location,
uiFind: spanName,
});
expect(focusUiFindMatchesMock).toHaveBeenLastCalledWith(trace, spanName, false);
});
});
});
Loading