You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@zipkin.apache.org by ad...@apache.org on 2019/05/10 05:06:18 UTC
[incubator-zipkin] branch master updated (4854ae5 -> d179243)
This is an automated email from the ASF dual-hosted git repository.
adriancole pushed a change to branch master
in repository https://gitbox.apache.org/repos/asf/incubator-zipkin.git.
from 4854ae5 Polishes scribe module (#2575)
new 6125bce Update webpack configs
new d179243 Change suffix js -> jsx
The 2 revisions listed above as "new" are entirely new to this
repository and will be described in separate emails. The revisions
listed as "add" were already present in the repository and have only
been added to this reference.
Summary of changes:
.../src/components/App/{index.js => App.jsx} | 0
.../components/App/{index.test.js => App.test.js} | 2 +-
.../src/components/App/{Layout.js => Layout.jsx} | 0
.../App/Sidebar/{index.js => Sidebar.jsx} | 0
.../App/Sidebar/{index.test.js => Sidebar.test.js} | 2 +-
...{SidebarPageOption.js => SidebarPageOption.jsx} | 0
zipkin-lens/src/components/App/Sidebar/index.js | 84 +---
zipkin-lens/src/components/App/index.js | 52 +--
.../components/Browser/{index.js => Browser.jsx} | 0
.../Browser/{index.test.js => Browser.test.js} | 2 +-
.../{BrowserHeader.js => BrowserHeader.jsx} | 0
.../{BrowserResults.js => BrowserResults.jsx} | 0
.../TraceSummary/{index.js => TraceSummary.jsx} | 0
.../{index.test.js => TraceSummary.test.js} | 2 +-
.../{TraceSummaryBar.js => TraceSummaryBar.jsx} | 0
...ceSummaryButtons.js => TraceSummaryButtons.jsx} | 0
...SummaryUpperBar.js => TraceSummaryUpperBar.jsx} | 0
.../src/components/Browser/TraceSummary/index.js | 103 +----
zipkin-lens/src/components/Browser/index.js | 57 +--
.../Common/{DatePicker.js => DatePicker.jsx} | 0
.../{LoadingOverlay.js => LoadingOverlay.jsx} | 0
.../{ServiceNameBadge.js => ServiceNameBadge.jsx} | 0
.../Dependencies/{index.js => Dependencies.jsx} | 0
.../{index.test.js => Dependencies.test.js} | 2 +-
...{DependenciesGraph.js => DependenciesGraph.jsx} | 0
...endenciesSidebar.js => DependenciesSidebar.jsx} | 0
.../{VizceralExt.js => VizceralExt.jsx} | 0
zipkin-lens/src/components/Dependencies/index.js | 213 +---------
.../DetailedTraceSummary/{index.js => index.jsx} | 0
...{ConditionDuration.js => ConditionDuration.jsx} | 0
.../{ConditionLimit.js => ConditionLimit.jsx} | 0
...{ConditionLookback.js => ConditionLookback.jsx} | 0
.../{ConditionName.js => ConditionName.jsx} | 0
.../{ConditionTags.js => ConditionTags.jsx} | 0
...lobalDropdownMenu.js => GlobalDropdownMenu.jsx} | 0
.../GlobalSearch/{index.js => GlobalSearch.jsx} | 0
.../{SearchCondition.js => SearchCondition.jsx} | 0
zipkin-lens/src/components/GlobalSearch/index.js | 439 +--------------------
.../MiniTimeline/{index.js => MiniTimeline.jsx} | 0
.../{index.test.js => MiniTimeline.test.js} | 2 +-
...{MiniTimelineGraph.js => MiniTimelineGraph.jsx} | 0
...{MiniTimelineLabel.js => MiniTimelineLabel.jsx} | 0
...iniTimelineSlider.js => MiniTimelineSlider.jsx} | 0
...eTimeMarkers.js => MiniTimelineTimeMarkers.jsx} | 0
zipkin-lens/src/components/MiniTimeline/index.js | 53 +--
.../components/Timeline/{index.js => Timeline.jsx} | 0
.../{TimelineHeader.js => TimelineHeader.jsx} | 0
.../Timeline/{TimelineSpan.js => TimelineSpan.jsx} | 0
.../{TimelineSpanData.js => TimelineSpanData.jsx} | 0
zipkin-lens/src/components/Timeline/index.js | 151 +------
.../components/TracePage/{index.js => index.jsx} | 0
.../components/TraceViewer/{index.js => index.jsx} | 0
zipkin-lens/webpack.dev.config.js | 4 +-
zipkin-lens/webpack.prod.config.js | 4 +-
54 files changed, 18 insertions(+), 1154 deletions(-)
copy zipkin-lens/src/components/App/{index.js => App.jsx} (100%)
rename zipkin-lens/src/components/App/{index.test.js => App.test.js} (98%)
rename zipkin-lens/src/components/App/{Layout.js => Layout.jsx} (100%)
copy zipkin-lens/src/components/App/Sidebar/{index.js => Sidebar.jsx} (100%)
rename zipkin-lens/src/components/App/Sidebar/{index.test.js => Sidebar.test.js} (98%)
rename zipkin-lens/src/components/App/Sidebar/{SidebarPageOption.js => SidebarPageOption.jsx} (100%)
copy zipkin-lens/src/components/Browser/{index.js => Browser.jsx} (100%)
rename zipkin-lens/src/components/Browser/{index.test.js => Browser.test.js} (98%)
rename zipkin-lens/src/components/Browser/{BrowserHeader.js => BrowserHeader.jsx} (100%)
rename zipkin-lens/src/components/Browser/{BrowserResults.js => BrowserResults.jsx} (100%)
copy zipkin-lens/src/components/Browser/TraceSummary/{index.js => TraceSummary.jsx} (100%)
rename zipkin-lens/src/components/Browser/TraceSummary/{index.test.js => TraceSummary.test.js} (97%)
rename zipkin-lens/src/components/Browser/TraceSummary/{TraceSummaryBar.js => TraceSummaryBar.jsx} (100%)
rename zipkin-lens/src/components/Browser/TraceSummary/{TraceSummaryButtons.js => TraceSummaryButtons.jsx} (100%)
rename zipkin-lens/src/components/Browser/TraceSummary/{TraceSummaryUpperBar.js => TraceSummaryUpperBar.jsx} (100%)
rename zipkin-lens/src/components/Common/{DatePicker.js => DatePicker.jsx} (100%)
rename zipkin-lens/src/components/Common/{LoadingOverlay.js => LoadingOverlay.jsx} (100%)
rename zipkin-lens/src/components/Common/{ServiceNameBadge.js => ServiceNameBadge.jsx} (100%)
copy zipkin-lens/src/components/Dependencies/{index.js => Dependencies.jsx} (100%)
rename zipkin-lens/src/components/Dependencies/{index.test.js => Dependencies.test.js} (98%)
rename zipkin-lens/src/components/Dependencies/{DependenciesGraph.js => DependenciesGraph.jsx} (100%)
rename zipkin-lens/src/components/Dependencies/{DependenciesSidebar.js => DependenciesSidebar.jsx} (100%)
rename zipkin-lens/src/components/Dependencies/{VizceralExt.js => VizceralExt.jsx} (100%)
rename zipkin-lens/src/components/DetailedTraceSummary/{index.js => index.jsx} (100%)
rename zipkin-lens/src/components/GlobalSearch/{ConditionDuration.js => ConditionDuration.jsx} (100%)
rename zipkin-lens/src/components/GlobalSearch/{ConditionLimit.js => ConditionLimit.jsx} (100%)
rename zipkin-lens/src/components/GlobalSearch/{ConditionLookback.js => ConditionLookback.jsx} (100%)
rename zipkin-lens/src/components/GlobalSearch/{ConditionName.js => ConditionName.jsx} (100%)
rename zipkin-lens/src/components/GlobalSearch/{ConditionTags.js => ConditionTags.jsx} (100%)
rename zipkin-lens/src/components/GlobalSearch/{GlobalDropdownMenu.js => GlobalDropdownMenu.jsx} (100%)
copy zipkin-lens/src/components/GlobalSearch/{index.js => GlobalSearch.jsx} (100%)
rename zipkin-lens/src/components/GlobalSearch/{SearchCondition.js => SearchCondition.jsx} (100%)
copy zipkin-lens/src/components/MiniTimeline/{index.js => MiniTimeline.jsx} (100%)
rename zipkin-lens/src/components/MiniTimeline/{index.test.js => MiniTimeline.test.js} (98%)
rename zipkin-lens/src/components/MiniTimeline/{MiniTimelineGraph.js => MiniTimelineGraph.jsx} (100%)
rename zipkin-lens/src/components/MiniTimeline/{MiniTimelineLabel.js => MiniTimelineLabel.jsx} (100%)
rename zipkin-lens/src/components/MiniTimeline/{MiniTimelineSlider.js => MiniTimelineSlider.jsx} (100%)
rename zipkin-lens/src/components/MiniTimeline/{MiniTimelineTimeMarkers.js => MiniTimelineTimeMarkers.jsx} (100%)
copy zipkin-lens/src/components/Timeline/{index.js => Timeline.jsx} (100%)
rename zipkin-lens/src/components/Timeline/{TimelineHeader.js => TimelineHeader.jsx} (100%)
rename zipkin-lens/src/components/Timeline/{TimelineSpan.js => TimelineSpan.jsx} (100%)
rename zipkin-lens/src/components/Timeline/{TimelineSpanData.js => TimelineSpanData.jsx} (100%)
rename zipkin-lens/src/components/TracePage/{index.js => index.jsx} (100%)
rename zipkin-lens/src/components/TraceViewer/{index.js => index.jsx} (100%)
[incubator-zipkin] 02/02: Change suffix js -> jsx
Posted by ad...@apache.org.
This is an automated email from the ASF dual-hosted git repository.
adriancole pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/incubator-zipkin.git
commit d1792430d0922e36be00431c682db918b29cceb6
Author: tacigar <ig...@gmail.com>
AuthorDate: Fri May 10 13:11:52 2019 +0900
Change suffix js -> jsx
---
.../src/components/App/{index.js => App.jsx} | 0
.../components/App/{index.test.js => App.test.js} | 2 +-
.../src/components/App/{Layout.js => Layout.jsx} | 0
.../App/Sidebar/{index.js => Sidebar.jsx} | 0
.../App/Sidebar/{index.test.js => Sidebar.test.js} | 2 +-
...{SidebarPageOption.js => SidebarPageOption.jsx} | 0
zipkin-lens/src/components/App/Sidebar/index.js | 84 +---
zipkin-lens/src/components/App/index.js | 52 +--
.../components/Browser/{index.js => Browser.jsx} | 0
.../Browser/{index.test.js => Browser.test.js} | 2 +-
.../{BrowserHeader.js => BrowserHeader.jsx} | 0
.../{BrowserResults.js => BrowserResults.jsx} | 0
.../TraceSummary/{index.js => TraceSummary.jsx} | 0
.../{index.test.js => TraceSummary.test.js} | 2 +-
.../{TraceSummaryBar.js => TraceSummaryBar.jsx} | 0
...ceSummaryButtons.js => TraceSummaryButtons.jsx} | 0
...SummaryUpperBar.js => TraceSummaryUpperBar.jsx} | 0
.../src/components/Browser/TraceSummary/index.js | 103 +----
zipkin-lens/src/components/Browser/index.js | 57 +--
.../Common/{DatePicker.js => DatePicker.jsx} | 0
.../{LoadingOverlay.js => LoadingOverlay.jsx} | 0
.../{ServiceNameBadge.js => ServiceNameBadge.jsx} | 0
.../Dependencies/{index.js => Dependencies.jsx} | 0
.../{index.test.js => Dependencies.test.js} | 2 +-
...{DependenciesGraph.js => DependenciesGraph.jsx} | 0
...endenciesSidebar.js => DependenciesSidebar.jsx} | 0
.../{VizceralExt.js => VizceralExt.jsx} | 0
zipkin-lens/src/components/Dependencies/index.js | 213 +---------
.../DetailedTraceSummary/{index.js => index.jsx} | 0
...{ConditionDuration.js => ConditionDuration.jsx} | 0
.../{ConditionLimit.js => ConditionLimit.jsx} | 0
...{ConditionLookback.js => ConditionLookback.jsx} | 0
.../{ConditionName.js => ConditionName.jsx} | 0
.../{ConditionTags.js => ConditionTags.jsx} | 0
...lobalDropdownMenu.js => GlobalDropdownMenu.jsx} | 0
.../GlobalSearch/{index.js => GlobalSearch.jsx} | 0
.../{SearchCondition.js => SearchCondition.jsx} | 0
zipkin-lens/src/components/GlobalSearch/index.js | 439 +--------------------
.../MiniTimeline/{index.js => MiniTimeline.jsx} | 0
.../{index.test.js => MiniTimeline.test.js} | 2 +-
...{MiniTimelineGraph.js => MiniTimelineGraph.jsx} | 0
...{MiniTimelineLabel.js => MiniTimelineLabel.jsx} | 0
...iniTimelineSlider.js => MiniTimelineSlider.jsx} | 0
...eTimeMarkers.js => MiniTimelineTimeMarkers.jsx} | 0
zipkin-lens/src/components/MiniTimeline/index.js | 53 +--
.../components/Timeline/{index.js => Timeline.jsx} | 0
.../{TimelineHeader.js => TimelineHeader.jsx} | 0
.../Timeline/{TimelineSpan.js => TimelineSpan.jsx} | 0
.../{TimelineSpanData.js => TimelineSpanData.jsx} | 0
zipkin-lens/src/components/Timeline/index.js | 151 +------
.../components/TracePage/{index.js => index.jsx} | 0
.../components/TraceViewer/{index.js => index.jsx} | 0
52 files changed, 14 insertions(+), 1150 deletions(-)
diff --git a/zipkin-lens/src/components/App/index.js b/zipkin-lens/src/components/App/App.jsx
similarity index 100%
copy from zipkin-lens/src/components/App/index.js
copy to zipkin-lens/src/components/App/App.jsx
diff --git a/zipkin-lens/src/components/App/index.test.js b/zipkin-lens/src/components/App/App.test.js
similarity index 98%
rename from zipkin-lens/src/components/App/index.test.js
rename to zipkin-lens/src/components/App/App.test.js
index e50c875..58635c4 100644
--- a/zipkin-lens/src/components/App/index.test.js
+++ b/zipkin-lens/src/components/App/App.test.js
@@ -19,7 +19,7 @@ import { Provider } from 'react-redux';
import { BrowserRouter, Route } from 'react-router-dom';
import { shallow } from 'enzyme';
-import App from './index';
+import App from './App';
import Layout from './Layout';
describe('<App />', () => {
diff --git a/zipkin-lens/src/components/App/Layout.js b/zipkin-lens/src/components/App/Layout.jsx
similarity index 100%
rename from zipkin-lens/src/components/App/Layout.js
rename to zipkin-lens/src/components/App/Layout.jsx
diff --git a/zipkin-lens/src/components/App/Sidebar/index.js b/zipkin-lens/src/components/App/Sidebar/Sidebar.jsx
similarity index 100%
copy from zipkin-lens/src/components/App/Sidebar/index.js
copy to zipkin-lens/src/components/App/Sidebar/Sidebar.jsx
diff --git a/zipkin-lens/src/components/App/Sidebar/index.test.js b/zipkin-lens/src/components/App/Sidebar/Sidebar.test.js
similarity index 98%
rename from zipkin-lens/src/components/App/Sidebar/index.test.js
rename to zipkin-lens/src/components/App/Sidebar/Sidebar.test.js
index 3464ef4..00a1d4f 100644
--- a/zipkin-lens/src/components/App/Sidebar/index.test.js
+++ b/zipkin-lens/src/components/App/Sidebar/Sidebar.test.js
@@ -18,7 +18,7 @@ import React from 'react';
import { shallow } from 'enzyme';
import Cookies from 'js-cookie';
-import Sidebar from './index';
+import Sidebar from './Sidebar';
describe('<Sidebar />', () => {
it('should have proper classes', () => {
diff --git a/zipkin-lens/src/components/App/Sidebar/SidebarPageOption.js b/zipkin-lens/src/components/App/Sidebar/SidebarPageOption.jsx
similarity index 100%
rename from zipkin-lens/src/components/App/Sidebar/SidebarPageOption.js
rename to zipkin-lens/src/components/App/Sidebar/SidebarPageOption.jsx
diff --git a/zipkin-lens/src/components/App/Sidebar/index.js b/zipkin-lens/src/components/App/Sidebar/index.js
index e4c6299..928f3ed 100644
--- a/zipkin-lens/src/components/App/Sidebar/index.js
+++ b/zipkin-lens/src/components/App/Sidebar/index.js
@@ -14,86 +14,4 @@
* See the License for the specific language governing permissions and
* limitations under the License.
*/
-import PropTypes from 'prop-types';
-import React from 'react';
-import { withRouter } from 'react-router';
-import Cookies from 'js-cookie';
-
-import SidebarPageOption from './SidebarPageOption';
-import Logo from '../../../img/zipkin-logo.svg';
-
-const propTypes = {
- location: PropTypes.shape({ pathname: PropTypes.string }).isRequired,
- history: PropTypes.shape({ push: PropTypes.func.isRequired }).isRequired,
-};
-
-class Sidebar extends React.Component {
- constructor(props) {
- super(props);
- this.goBackToClassic = this.goBackToClassic.bind(this);
- }
-
- goBackToClassic(event) {
- const { location, history } = this.props;
-
- Cookies.remove('lens');
- if (location.pathname === '/zipkin') {
- history.push('/zipkin/');
- } else {
- history.push(`${location.pathname}`);
- }
- window.location.reload(true);
- event.preventDefault();
- }
-
- render() {
- const { location } = this.props;
- return (
- <div className="sidebar">
- <div
- to={{ pathname: '' }}
- className="sidebar__brand-link"
- >
- <Logo className="sidebar__brand-logo" />
- </div>
- <div className="sidebar__menu">
- <SidebarPageOption location={location} pageName="browser" />
- <SidebarPageOption location={location} pageName="dependencies" />
- </div>
- {
- Cookies.get('lens')
- ? (
- <div className="sidebar__go-back-to-classic-button-wrapper">
- <button
- type="button"
- className="sidebar__go-back-to-classic-button"
- onClick={this.goBackToClassic}
- >
- Go back to classic Zipkin
- </button>
- </div>
- )
- : null
- }
- <div className="sidebar__other-links">
- <a href="https://zipkin.apache.org/" target="_blank" rel="noopener noreferrer">
- <div className="sidebar__other-link fas fa-home" />
- </a>
- <a href="https://github.com/openzipkin/zipkin" target="_blank" rel="noopener noreferrer">
- <div className="sidebar__other-link fab fa-github" />
- </a>
- <a href="https://twitter.com/zipkinproject" target="_blank" rel="noopener noreferrer">
- <div className="sidebar__other-link fab fa-twitter" />
- </a>
- <a href="https://gitter.im/openzipkin/zipkin/" target="_blank" rel="noopener noreferrer">
- <div className="sidebar__other-link fab fa-gitter" />
- </a>
- </div>
- </div>
- );
- }
-}
-
-Sidebar.propTypes = propTypes;
-
-export default withRouter(Sidebar);
+export { default } from './Sidebar';
diff --git a/zipkin-lens/src/components/App/index.js b/zipkin-lens/src/components/App/index.js
index 488338c..9b47f5d 100644
--- a/zipkin-lens/src/components/App/index.js
+++ b/zipkin-lens/src/components/App/index.js
@@ -14,54 +14,4 @@
* See the License for the specific language governing permissions and
* limitations under the License.
*/
-import React from 'react';
-import { Provider } from 'react-redux';
-import { BrowserRouter, Route } from 'react-router-dom';
-
-import Layout from './Layout';
-import BrowserContainer from '../../containers/Browser/BrowserContainer';
-import TracePageContainer from '../../containers/TracePage/TracePageContainer';
-import DependenciesContainer from '../../containers/Dependencies/DependenciesContainer';
-import TraceViewerContainer from '../../containers/TraceViewer/TraceViewerContainer';
-import configureStore from '../../store/configure-store';
-
-const applicationTitle = 'Zipkin';
-
-class App extends React.Component {
- componentDidMount() {
- document.title = applicationTitle;
- }
-
- render() {
- return (
- <Provider store={configureStore()}>
- <BrowserRouter>
- <Layout>
- <Route
- exact
- path="/zipkin/"
- component={BrowserContainer}
- />
- <Route
- exact
- path="/zipkin/traces/:traceId"
- component={TracePageContainer}
- />
- <Route
- exact
- path="/zipkin/dependency"
- component={DependenciesContainer}
- />
- <Route
- exact
- path="/zipkin/traceViewer"
- render={TraceViewerContainer}
- />
- </Layout>
- </BrowserRouter>
- </Provider>
- );
- }
-}
-
-export default App;
+export { default } from './App';
diff --git a/zipkin-lens/src/components/Browser/index.js b/zipkin-lens/src/components/Browser/Browser.jsx
similarity index 100%
copy from zipkin-lens/src/components/Browser/index.js
copy to zipkin-lens/src/components/Browser/Browser.jsx
diff --git a/zipkin-lens/src/components/Browser/index.test.js b/zipkin-lens/src/components/Browser/Browser.test.js
similarity index 98%
rename from zipkin-lens/src/components/Browser/index.test.js
rename to zipkin-lens/src/components/Browser/Browser.test.js
index d86f9c5..9bcbe23 100644
--- a/zipkin-lens/src/components/Browser/index.test.js
+++ b/zipkin-lens/src/components/Browser/Browser.test.js
@@ -17,7 +17,7 @@
import React from 'react';
import { shallow } from 'enzyme';
-import Browser from './index';
+import Browser from './Browser';
import BrowserHeader from './BrowserHeader';
import { sortingMethods } from './sorting';
diff --git a/zipkin-lens/src/components/Browser/BrowserHeader.js b/zipkin-lens/src/components/Browser/BrowserHeader.jsx
similarity index 100%
rename from zipkin-lens/src/components/Browser/BrowserHeader.js
rename to zipkin-lens/src/components/Browser/BrowserHeader.jsx
diff --git a/zipkin-lens/src/components/Browser/BrowserResults.js b/zipkin-lens/src/components/Browser/BrowserResults.jsx
similarity index 100%
rename from zipkin-lens/src/components/Browser/BrowserResults.js
rename to zipkin-lens/src/components/Browser/BrowserResults.jsx
diff --git a/zipkin-lens/src/components/Browser/TraceSummary/index.js b/zipkin-lens/src/components/Browser/TraceSummary/TraceSummary.jsx
similarity index 100%
copy from zipkin-lens/src/components/Browser/TraceSummary/index.js
copy to zipkin-lens/src/components/Browser/TraceSummary/TraceSummary.jsx
diff --git a/zipkin-lens/src/components/Browser/TraceSummary/index.test.js b/zipkin-lens/src/components/Browser/TraceSummary/TraceSummary.test.js
similarity index 97%
rename from zipkin-lens/src/components/Browser/TraceSummary/index.test.js
rename to zipkin-lens/src/components/Browser/TraceSummary/TraceSummary.test.js
index 5589d06..67497dc 100644
--- a/zipkin-lens/src/components/Browser/TraceSummary/index.test.js
+++ b/zipkin-lens/src/components/Browser/TraceSummary/TraceSummary.test.js
@@ -17,7 +17,7 @@
import React from 'react';
import { shallow } from 'enzyme';
-import TraceSummary from './index';
+import TraceSummary from './TraceSummary';
jest.mock('../../../zipkin', () => ({
...(jest.requireActual('../../../zipkin')),
diff --git a/zipkin-lens/src/components/Browser/TraceSummary/TraceSummaryBar.js b/zipkin-lens/src/components/Browser/TraceSummary/TraceSummaryBar.jsx
similarity index 100%
rename from zipkin-lens/src/components/Browser/TraceSummary/TraceSummaryBar.js
rename to zipkin-lens/src/components/Browser/TraceSummary/TraceSummaryBar.jsx
diff --git a/zipkin-lens/src/components/Browser/TraceSummary/TraceSummaryButtons.js b/zipkin-lens/src/components/Browser/TraceSummary/TraceSummaryButtons.jsx
similarity index 100%
rename from zipkin-lens/src/components/Browser/TraceSummary/TraceSummaryButtons.js
rename to zipkin-lens/src/components/Browser/TraceSummary/TraceSummaryButtons.jsx
diff --git a/zipkin-lens/src/components/Browser/TraceSummary/TraceSummaryUpperBar.js b/zipkin-lens/src/components/Browser/TraceSummary/TraceSummaryUpperBar.jsx
similarity index 100%
rename from zipkin-lens/src/components/Browser/TraceSummary/TraceSummaryUpperBar.js
rename to zipkin-lens/src/components/Browser/TraceSummary/TraceSummaryUpperBar.jsx
diff --git a/zipkin-lens/src/components/Browser/TraceSummary/index.js b/zipkin-lens/src/components/Browser/TraceSummary/index.js
index f80af93..e3c01c0 100644
--- a/zipkin-lens/src/components/Browser/TraceSummary/index.js
+++ b/zipkin-lens/src/components/Browser/TraceSummary/index.js
@@ -14,105 +14,4 @@
* See the License for the specific language governing permissions and
* limitations under the License.
*/
-import PropTypes from 'prop-types';
-import React from 'react';
-
-import TraceSummaryBar from './TraceSummaryBar';
-import TraceSummaryUpperBar from './TraceSummaryUpperBar';
-import TraceSummaryButtons from './TraceSummaryButtons';
-import Timeline from '../../Timeline';
-import ServiceNameBadge from '../../Common/ServiceNameBadge';
-import { detailedTraceSummary } from '../../../zipkin';
-import { traceSummaryPropTypes } from '../../../prop-types';
-
-const propTypes = {
- traceSummary: traceSummaryPropTypes.isRequired,
- skewCorrectedTrace: PropTypes.shape({}).isRequired,
-};
-
-class TraceSummary extends React.Component {
- constructor(props) {
- super(props);
- this.state = { isTimelineOpened: false };
- this.handleTimelineOpenToggle = this.handleTimelineOpenToggle.bind(this);
- }
-
- handleTimelineOpenToggle(event) {
- const { isTimelineOpened } = this.state;
- this.setState({ isTimelineOpened: !isTimelineOpened });
- event.stopPropagation();
- }
-
- render() {
- const { traceSummary, skewCorrectedTrace } = this.props;
- const { isTimelineOpened } = this.state;
-
- const detailedTrace = detailedTraceSummary(skewCorrectedTrace);
-
- return (
- <div className="trace-summary">
- <div
- className="trace-summary__summary"
- role="presentation"
- onClick={this.handleTimelineOpenToggle}
- data-test="summary"
- >
- <div className="trace-summary__trace-id">
- Trace ID:
- <b>
- {traceSummary.traceId}
- </b>
- </div>
- <div className="trace-summary__bars-and-buttons">
- <div className="trace-summary__bars">
- <TraceSummaryUpperBar traceSummary={traceSummary} />
- {
- traceSummary.servicePercentage != null && typeof traceSummary.servicePercentage !== 'undefined'
- ? (
- <TraceSummaryBar
- width={traceSummary.servicePercentage}
- infoClass={traceSummary.infoClass}
- >
- {traceSummary.servicePercentage}
- %
- </TraceSummaryBar>
- )
- : null
- }
- </div>
- <TraceSummaryButtons traceId={traceSummary.traceId} />
- </div>
- <div className="trace-summary__service-badges">
- {
- traceSummary.serviceSummaries.map(serviceSummary => (
- <div key={serviceSummary.serviceName} className="trace-summary__badge-wrapper">
- <ServiceNameBadge
- serviceName={serviceSummary.serviceName}
- count={serviceSummary.spanCount}
- />
- </div>
- ))
- }
- </div>
- </div>
- {
- isTimelineOpened
- ? (
- <div className="trace-summary__timeline-wrapper">
- <Timeline
- startTs={0}
- endTs={detailedTrace.duration}
- traceSummary={detailedTrace}
- />
- </div>
- )
- : null
- }
- </div>
- );
- }
-}
-
-TraceSummary.propTypes = propTypes;
-
-export default TraceSummary;
+export { default } from './TraceSummary';
diff --git a/zipkin-lens/src/components/Browser/index.js b/zipkin-lens/src/components/Browser/index.js
index 4cc12e1..e8e914b 100644
--- a/zipkin-lens/src/components/Browser/index.js
+++ b/zipkin-lens/src/components/Browser/index.js
@@ -14,59 +14,4 @@
* See the License for the specific language governing permissions and
* limitations under the License.
*/
-import PropTypes from 'prop-types';
-import React from 'react';
-
-import { sortingMethods } from './sorting';
-import BrowserHeader from './BrowserHeader';
-import BrowserResults from './BrowserResults';
-import LoadingOverlay from '../Common/LoadingOverlay';
-import { traceSummariesPropTypes } from '../../prop-types';
-
-const propTypes = {
- traceSummaries: traceSummariesPropTypes.isRequired,
- tracesMap: PropTypes.shape({}).isRequired,
- isLoading: PropTypes.bool.isRequired,
- clearTraces: PropTypes.func.isRequired,
-};
-
-class Browser extends React.Component {
- constructor(props) {
- super(props);
- this.state = { sortingMethod: sortingMethods.LONGEST };
- this.handleSortingMethodChange = this.handleSortingMethodChange.bind(this);
- }
-
- componentWillUnmount() {
- const { clearTraces } = this.props;
- clearTraces();
- }
-
- handleSortingMethodChange(selected) {
- this.setState({ sortingMethod: selected.value });
- }
-
- render() {
- const { isLoading, traceSummaries, tracesMap } = this.props;
- const { sortingMethod } = this.state;
- return (
- <div className="browser">
- <LoadingOverlay active={isLoading} />
- <BrowserHeader
- numTraces={traceSummaries.length}
- sortingMethod={sortingMethod}
- onChange={this.handleSortingMethodChange}
- />
- <BrowserResults
- traceSummaries={traceSummaries}
- sortingMethod={sortingMethod}
- tracesMap={tracesMap}
- />
- </div>
- );
- }
-}
-
-Browser.propTypes = propTypes;
-
-export default Browser;
+export { default } from './Browser';
diff --git a/zipkin-lens/src/components/Common/DatePicker.js b/zipkin-lens/src/components/Common/DatePicker.jsx
similarity index 100%
rename from zipkin-lens/src/components/Common/DatePicker.js
rename to zipkin-lens/src/components/Common/DatePicker.jsx
diff --git a/zipkin-lens/src/components/Common/LoadingOverlay.js b/zipkin-lens/src/components/Common/LoadingOverlay.jsx
similarity index 100%
rename from zipkin-lens/src/components/Common/LoadingOverlay.js
rename to zipkin-lens/src/components/Common/LoadingOverlay.jsx
diff --git a/zipkin-lens/src/components/Common/ServiceNameBadge.js b/zipkin-lens/src/components/Common/ServiceNameBadge.jsx
similarity index 100%
rename from zipkin-lens/src/components/Common/ServiceNameBadge.js
rename to zipkin-lens/src/components/Common/ServiceNameBadge.jsx
diff --git a/zipkin-lens/src/components/Dependencies/index.js b/zipkin-lens/src/components/Dependencies/Dependencies.jsx
similarity index 100%
copy from zipkin-lens/src/components/Dependencies/index.js
copy to zipkin-lens/src/components/Dependencies/Dependencies.jsx
diff --git a/zipkin-lens/src/components/Dependencies/index.test.js b/zipkin-lens/src/components/Dependencies/Dependencies.test.js
similarity index 98%
rename from zipkin-lens/src/components/Dependencies/index.test.js
rename to zipkin-lens/src/components/Dependencies/Dependencies.test.js
index a981012..c79fba2 100644
--- a/zipkin-lens/src/components/Dependencies/index.test.js
+++ b/zipkin-lens/src/components/Dependencies/Dependencies.test.js
@@ -17,7 +17,7 @@
import React from 'react';
import { shallow } from 'enzyme';
-import { Dependencies } from './index';
+import { Dependencies } from './Dependencies';
describe('<Dependencies>', () => {
it('should not fetch dependencies when location.search is empty', () => {
diff --git a/zipkin-lens/src/components/Dependencies/DependenciesGraph.js b/zipkin-lens/src/components/Dependencies/DependenciesGraph.jsx
similarity index 100%
rename from zipkin-lens/src/components/Dependencies/DependenciesGraph.js
rename to zipkin-lens/src/components/Dependencies/DependenciesGraph.jsx
diff --git a/zipkin-lens/src/components/Dependencies/DependenciesSidebar.js b/zipkin-lens/src/components/Dependencies/DependenciesSidebar.jsx
similarity index 100%
rename from zipkin-lens/src/components/Dependencies/DependenciesSidebar.js
rename to zipkin-lens/src/components/Dependencies/DependenciesSidebar.jsx
diff --git a/zipkin-lens/src/components/Dependencies/VizceralExt.js b/zipkin-lens/src/components/Dependencies/VizceralExt.jsx
similarity index 100%
rename from zipkin-lens/src/components/Dependencies/VizceralExt.js
rename to zipkin-lens/src/components/Dependencies/VizceralExt.jsx
diff --git a/zipkin-lens/src/components/Dependencies/index.js b/zipkin-lens/src/components/Dependencies/index.js
index 00c948f..f34eff3 100644
--- a/zipkin-lens/src/components/Dependencies/index.js
+++ b/zipkin-lens/src/components/Dependencies/index.js
@@ -14,215 +14,4 @@
* See the License for the specific language governing permissions and
* limitations under the License.
*/
-import PropTypes from 'prop-types';
-import React from 'react';
-import { withRouter } from 'react-router';
-import ReactSelect from 'react-select';
-import queryString from 'query-string';
-import moment from 'moment';
-
-import DependenciesGraph from './DependenciesGraph';
-import DependenciesSidebar from './DependenciesSidebar';
-import DatePicker from '../Common/DatePicker';
-import LoadingOverlay from '../Common/LoadingOverlay';
-import { buildQueryParameters } from '../../util/api';
-
-const propTypes = {
- location: PropTypes.shape({}).isRequired,
- isLoading: PropTypes.bool.isRequired,
- graph: PropTypes.shape({}).isRequired,
- fetchDependencies: PropTypes.func.isRequired,
- clearDependencies: PropTypes.func.isRequired,
- history: PropTypes.shape({
- push: PropTypes.func.isRequired,
- }).isRequired,
-};
-
-export class Dependencies extends React.Component { // export for testing without withRouter
- constructor(props) {
- super(props);
-
- this.state = {
- startTs: moment().subtract(1, 'days'),
- endTs: moment(),
- selectedServiceName: '',
- filter: '',
- };
-
- this.handleStartTsChange = this.handleStartTsChange.bind(this);
- this.handleEndTsChange = this.handleEndTsChange.bind(this);
- this.handleServiceSelect = this.handleServiceSelect.bind(this);
- this.handleFilterChange = this.handleFilterChange.bind(this);
- this.handleAnalyzeButtonClick = this.handleAnalyzeButtonClick.bind(this);
- }
-
- componentDidMount() {
- const { location } = this.props;
-
- const queryParams = queryString.parse(location.search);
- const endTs = queryParams.endTs ? moment(parseInt(queryParams.endTs, 10)) : moment();
- const lookback = queryParams.lookback
- ? moment.duration(parseInt(queryParams.lookback, 10))
- : moment.duration(1, 'days');
- const startTs = endTs.clone().subtract(lookback); // subtract is not immutable.
- this.setState({
- startTs,
- endTs,
- });
- this.fetchDependencies(location);
- }
-
- componentWillUnmount() {
- const { clearDependencies } = this.props;
- clearDependencies();
- }
-
- fetchDependencies(location) {
- const { fetchDependencies } = this.props;
- if (location.search !== '' && location.search !== '?') {
- const queryParameters = queryString.parse(location.search);
- fetchDependencies(queryParameters);
- }
- }
-
- handleStartTsChange(startTs) {
- this.setState({ startTs });
- }
-
- handleEndTsChange(endTs) {
- this.setState({ endTs });
- }
-
- handleServiceSelect(selectedServiceName) {
- this.setState({ selectedServiceName });
- }
-
- handleFilterChange(filter) {
- this.setState({ filter });
- }
-
- handleAnalyzeButtonClick() {
- const { startTs, endTs } = this.state;
- const { history } = this.props;
- const queryParameters = buildQueryParameters({
- endTs: endTs.valueOf(),
- lookback: endTs.valueOf() - startTs.valueOf(),
- });
- const location = {
- pathname: '/zipkin/dependency',
- search: queryParameters,
- };
- history.push(location);
- this.fetchDependencies(location);
- }
-
- renderSearch() {
- const { startTs, endTs } = this.state;
- return (
- <div className="dependencies__search">
- <div className="dependencies__lookback-condition">
- <DatePicker
- onChange={this.handleStartTsChange}
- selected={startTs}
- />
- </div>
- <div className="dependencies__lookback-condition-separator">
- -
- </div>
- <div className="dependencies__lookback-condition">
- <DatePicker
- onChange={this.handleEndTsChange}
- selected={endTs}
- />
- </div>
- <div className="dependencies__analyze-button-wrapper">
- <div
- role="presentation"
- onClick={this.handleAnalyzeButtonClick}
- className="dependencies__analyze-button"
- >
- Analyze Dependencies
- </div>
- </div>
- </div>
- );
- }
-
- renderFilter() {
- const { filter } = this.state;
- const { graph } = this.props;
- const options = graph.allNodeNames().map(
- nodeName => ({ value: nodeName, label: nodeName }),
- );
- const value = !filter ? undefined : { value: filter, label: filter };
- return (
- <ReactSelect
- onChange={(selected) => { this.handleFilterChange(selected.value); }}
- options={options}
- value={value}
- styles={{
- control: provided => ({
- ...provided,
- width: '240px',
- }),
- }}
- placeholder="Filter by ..."
- />
- );
- }
-
- render() {
- const { isLoading, graph } = this.props;
- const { selectedServiceName, filter } = this.state;
- const isSidebarOpened = !!selectedServiceName;
-
- return (
- <div className="dependencies">
- <LoadingOverlay active={isLoading} />
- <div className={`dependencies__main ${
- isSidebarOpened
- ? 'dependencies__main--narrow'
- : 'dependencies__main--wide'}`}
- >
- <div className="dependencies__search-wrapper">
- {this.renderSearch()}
- </div>
- {
- graph.allNodes().length === 0
- ? null
- : (
- <div>
- <div className="dependencies__filter-wrapper">
- {this.renderFilter()}
- </div>
- <div className="dependencies__graph-wrapper">
- <DependenciesGraph
- graph={graph}
- onServiceSelect={this.handleServiceSelect}
- selectedServiceName={selectedServiceName}
- filter={filter}
- />
- </div>
- </div>
- )
- }
- </div>
- <div className={`dependencies__sidebar-wrapper ${
- isSidebarOpened
- ? 'dependencies__sidebar-wrapper--opened'
- : 'dependencies__sidebar-wrapper--closed'}`}
- >
- <DependenciesSidebar
- serviceName={selectedServiceName}
- targetEdges={graph.getTargetEdges(selectedServiceName)}
- sourceEdges={graph.getSourceEdges(selectedServiceName)}
- />
- </div>
- </div>
- );
- }
-}
-
-Dependencies.propTypes = propTypes;
-
-export default withRouter(Dependencies);
+export { default } from './Dependencies';
diff --git a/zipkin-lens/src/components/DetailedTraceSummary/index.js b/zipkin-lens/src/components/DetailedTraceSummary/index.jsx
similarity index 100%
rename from zipkin-lens/src/components/DetailedTraceSummary/index.js
rename to zipkin-lens/src/components/DetailedTraceSummary/index.jsx
diff --git a/zipkin-lens/src/components/GlobalSearch/ConditionDuration.js b/zipkin-lens/src/components/GlobalSearch/ConditionDuration.jsx
similarity index 100%
rename from zipkin-lens/src/components/GlobalSearch/ConditionDuration.js
rename to zipkin-lens/src/components/GlobalSearch/ConditionDuration.jsx
diff --git a/zipkin-lens/src/components/GlobalSearch/ConditionLimit.js b/zipkin-lens/src/components/GlobalSearch/ConditionLimit.jsx
similarity index 100%
rename from zipkin-lens/src/components/GlobalSearch/ConditionLimit.js
rename to zipkin-lens/src/components/GlobalSearch/ConditionLimit.jsx
diff --git a/zipkin-lens/src/components/GlobalSearch/ConditionLookback.js b/zipkin-lens/src/components/GlobalSearch/ConditionLookback.jsx
similarity index 100%
rename from zipkin-lens/src/components/GlobalSearch/ConditionLookback.js
rename to zipkin-lens/src/components/GlobalSearch/ConditionLookback.jsx
diff --git a/zipkin-lens/src/components/GlobalSearch/ConditionName.js b/zipkin-lens/src/components/GlobalSearch/ConditionName.jsx
similarity index 100%
rename from zipkin-lens/src/components/GlobalSearch/ConditionName.js
rename to zipkin-lens/src/components/GlobalSearch/ConditionName.jsx
diff --git a/zipkin-lens/src/components/GlobalSearch/ConditionTags.js b/zipkin-lens/src/components/GlobalSearch/ConditionTags.jsx
similarity index 100%
rename from zipkin-lens/src/components/GlobalSearch/ConditionTags.js
rename to zipkin-lens/src/components/GlobalSearch/ConditionTags.jsx
diff --git a/zipkin-lens/src/components/GlobalSearch/GlobalDropdownMenu.js b/zipkin-lens/src/components/GlobalSearch/GlobalDropdownMenu.jsx
similarity index 100%
rename from zipkin-lens/src/components/GlobalSearch/GlobalDropdownMenu.js
rename to zipkin-lens/src/components/GlobalSearch/GlobalDropdownMenu.jsx
diff --git a/zipkin-lens/src/components/GlobalSearch/index.js b/zipkin-lens/src/components/GlobalSearch/GlobalSearch.jsx
similarity index 100%
copy from zipkin-lens/src/components/GlobalSearch/index.js
copy to zipkin-lens/src/components/GlobalSearch/GlobalSearch.jsx
diff --git a/zipkin-lens/src/components/GlobalSearch/SearchCondition.js b/zipkin-lens/src/components/GlobalSearch/SearchCondition.jsx
similarity index 100%
rename from zipkin-lens/src/components/GlobalSearch/SearchCondition.js
rename to zipkin-lens/src/components/GlobalSearch/SearchCondition.jsx
diff --git a/zipkin-lens/src/components/GlobalSearch/index.js b/zipkin-lens/src/components/GlobalSearch/index.js
index a9702ad..08aa9e4 100644
--- a/zipkin-lens/src/components/GlobalSearch/index.js
+++ b/zipkin-lens/src/components/GlobalSearch/index.js
@@ -14,441 +14,4 @@
* See the License for the specific language governing permissions and
* limitations under the License.
*/
-import PropTypes from 'prop-types';
-import React from 'react';
-import { withRouter } from 'react-router';
-import moment from 'moment';
-import queryString from 'query-string';
-
-import SearchCondition from './SearchCondition';
-import ConditionDuration from './ConditionDuration';
-import ConditionLimit from './ConditionLimit';
-import ConditionName from './ConditionName';
-import ConditionTags from './ConditionTags';
-import ConditionLookback from './ConditionLookback';
-import GlobalDropdownMenuContainer from '../../containers/GlobalSearch/GlobalDropdownMenuContainer';
-import {
- isAutocompleteKey,
- defaultConditionValues,
- getConditionKeyListWithAvailability,
- buildQueryParametersWithConditions,
- buildApiQueryParameters,
- extractConditionsFromQueryParameters,
- nextInitialConditionKey,
-} from '../../util/global-search';
-
-const propTypes = {
- services: PropTypes.arrayOf(PropTypes.string).isRequired,
- remoteServices: PropTypes.arrayOf(PropTypes.string).isRequired,
- spans: PropTypes.arrayOf(PropTypes.string).isRequired,
- conditions: PropTypes.arrayOf(PropTypes.shape({
- key: PropTypes.string,
- value: PropTypes.oneOfType([
- PropTypes.string,
- PropTypes.number,
- PropTypes.shape({}),
- ]),
- })).isRequired,
- lookbackCondition: PropTypes.shape({
- value: PropTypes.string,
- endTs: PropTypes.number,
- startTs: PropTypes.number,
- }).isRequired,
- limitCondition: PropTypes.number.isRequired,
- fetchServices: PropTypes.func.isRequired,
- isLoadingServices: PropTypes.bool.isRequired,
- fetchRemoteServices: PropTypes.func.isRequired,
- isLoadingRemoteServices: PropTypes.bool.isRequired,
- fetchSpans: PropTypes.func.isRequired,
- isLoadingSpans: PropTypes.bool.isRequired,
- fetchTraces: PropTypes.func.isRequired,
- fetchAutocompleteKeys: PropTypes.func.isRequired,
- fetchAutocompleteValues: PropTypes.func.isRequired,
- autocompleteKeys: PropTypes.arrayOf(PropTypes.string).isRequired,
- isLoadingAutocompleteKeys: PropTypes.bool.isRequired,
- autocompleteValues: PropTypes.arrayOf(PropTypes.string).isRequired,
- isLoadingAutocompleteValues: PropTypes.bool.isRequired,
- setLookbackCondition: PropTypes.func.isRequired,
- setLimitCondition: PropTypes.func.isRequired,
- addCondition: PropTypes.func.isRequired,
- deleteCondition: PropTypes.func.isRequired,
- changeConditionKey: PropTypes.func.isRequired,
- changeConditionValue: PropTypes.func.isRequired,
- location: PropTypes.shape({
- search: PropTypes.string.isRequired,
- }).isRequired,
- history: PropTypes.shape({
- push: PropTypes.func.isRequired,
- }).isRequired,
-};
-
-class GlobalSearch extends React.Component {
- constructor(props) {
- super(props);
- this.state = {
- isConditionFocused: false,
- };
- this.handleAddButtonClick = this.handleAddButtonClick.bind(this);
- this.handleSearchButtonClick = this.handleSearchButtonClick.bind(this);
- this.handleDeleteConditionButtonClick = this.handleDeleteConditionButtonClick.bind(this);
- this.handleConditionKeyChange = this.handleConditionKeyChange.bind(this);
- this.handleConditionValueChange = this.handleConditionValueChange.bind(this);
- this.handleLookbackChange = this.handleLookbackChange.bind(this);
- this.handleLimitChange = this.handleLimitChange.bind(this);
- this.handleKeyDown = this.handleKeyDown.bind(this);
- this.handleConditionFocus = this.handleConditionFocus.bind(this);
- this.handleConditionKeyBlur = this.handleConditionKeyBlur.bind(this);
- this.handleConditionValueBlur = this.handleConditionValueBlur.bind(this);
- }
-
- componentDidMount() {
- document.addEventListener('keydown', this.handleKeyDown);
- const {
- fetchServices,
- fetchRemoteServices,
- fetchSpans,
- fetchAutocompleteKeys,
- location,
- addCondition,
- setLookbackCondition,
- setLimitCondition,
- } = this.props;
-
- const initialConditions = this.getConditionsFromQueryParameters();
- const { conditions, lookbackCondition, limitCondition } = initialConditions;
- conditions.forEach((condition) => {
- addCondition(condition);
- });
- setLookbackCondition({
- value: lookbackCondition.value || '1h',
- endTs: lookbackCondition.endTs || moment().valueOf(),
- startTs: lookbackCondition.startTs || moment().valueOf(),
- });
- setLimitCondition(limitCondition || 10);
-
- fetchServices();
- const serviceNameCondition = initialConditions.conditions.find(condition => condition.key === 'serviceName');
- if (serviceNameCondition) {
- fetchRemoteServices(serviceNameCondition.value);
- fetchSpans(serviceNameCondition.value);
- }
- fetchAutocompleteKeys();
- this.fetchTraces(location);
- }
-
- componentWillUnmount() {
- document.removeEventListener('keydown', this.handleKeyDown);
- }
-
- getConditionsFromQueryParameters() {
- const { location } = this.props;
- if (location.search !== '' && location.search !== '?') {
- const queryParameters = queryString.parse(location.search);
- return extractConditionsFromQueryParameters(queryParameters);
- }
- return {
- conditions: [],
- lookbackCondition: {},
- limitCondition: null,
- };
- }
-
- fetchTraces(location) {
- const { fetchTraces } = this.props;
- if (location.search !== '' && location.search !== '?') {
- const queryParameters = queryString.parse(location.search);
- const apiQueryParameters = buildApiQueryParameters(queryParameters);
- fetchTraces(apiQueryParameters);
- }
- }
-
- handleAddButtonClick() {
- const { addCondition, conditions, autocompleteKeys } = this.props;
- const nextConditionKey = nextInitialConditionKey(conditions, autocompleteKeys);
- addCondition({
- key: nextConditionKey,
- value: defaultConditionValues(nextConditionKey),
- });
- }
-
- handleKeyDown(event) {
- const { isConditionFocused } = this.state;
- if (event.key === 'Enter' && !isConditionFocused) {
- this.handleSearchButtonClick();
- }
- }
-
- handleSearchButtonClick() {
- const {
- history, conditions, lookbackCondition, limitCondition,
- } = this.props;
-
- const queryParams = buildQueryParametersWithConditions(
- conditions,
- lookbackCondition,
- limitCondition,
- );
- const location = {
- pathname: '/zipkin/',
- search: queryParams,
- };
- history.push(location);
- this.fetchTraces(location);
- }
-
- // Replaces the key of the "index"-th condition with "keyName" and clear value.
- handleConditionKeyChange(index, conditionKey) {
- const {
- changeConditionKey,
- fetchAutocompleteValues,
- } = this.props;
- changeConditionKey(index, conditionKey);
-
- if (isAutocompleteKey(conditionKey)) {
- fetchAutocompleteValues(conditionKey);
- }
- }
-
- // Replaces the value of the "index"-th condition with "value".
- handleConditionValueChange(index, conditionValue) {
- const {
- fetchRemoteServices,
- fetchSpans,
- conditions,
- changeConditionValue,
- } = this.props;
-
- changeConditionValue(index, conditionValue);
- if (conditions[index].key === 'serviceName') {
- fetchRemoteServices(conditionValue);
- fetchSpans(conditionValue);
- }
- }
-
- handleDeleteConditionButtonClick(index) {
- const { deleteCondition } = this.props;
- deleteCondition(index);
- }
-
- handleLookbackChange(lookbackCondition) {
- const { setLookbackCondition } = this.props;
- setLookbackCondition(lookbackCondition);
- }
-
- handleLimitChange(limitCondition) {
- const { setLimitCondition } = this.props;
- setLimitCondition(limitCondition);
- }
-
- handleConditionFocus() {
- this.setState({ isConditionFocused: true });
- }
-
- handleConditionKeyBlur() {
- this.setState({ isConditionFocused: false });
- }
-
- handleConditionValueBlur() {
- // Delay for avoiding to fetch
- setTimeout(() => { this.setState({ isConditionFocused: false }); }, 0);
- }
-
- renderCondition(conditionKey, index, value) {
- const {
- services,
- remoteServices,
- spans,
- isLoadingServices,
- isLoadingRemoteServices,
- isLoadingSpans,
- autocompleteValues,
- isLoadingAutocompleteValues,
- } = this.props;
- const commonProps = {
- value,
- onConditionChange: (val) => { this.handleConditionValueChange(index, val); },
- };
-
- switch (conditionKey) {
- case 'serviceName':
- case 'remoteServiceName':
- case 'spanName': {
- let options;
- let isLoadingOptions;
- if (conditionKey === 'serviceName') {
- options = services;
- isLoadingOptions = isLoadingServices;
- } else if (conditionKey === 'remoteServiceName') {
- options = remoteServices;
- isLoadingOptions = isLoadingRemoteServices;
- } else {
- options = spans;
- isLoadingOptions = isLoadingSpans;
- }
- return ({
- onFocus, onBlur, setNextFocusRef, isFocused,
- }) => (
- <ConditionName
- {...commonProps}
- options={options}
- onFocus={onFocus}
- onBlur={onBlur}
- setNextFocusRef={setNextFocusRef}
- isFocused={isFocused}
- isLoadingOptions={isLoadingOptions}
- />
- );
- }
- case 'minDuration':
- case 'maxDuration':
- return ({
- onFocus, onBlur, setNextFocusRef, isFocused,
- }) => (
- <ConditionDuration
- {...commonProps}
- onFocus={onFocus}
- onBlur={onBlur}
- setNextFocusRef={setNextFocusRef}
- isFocused={isFocused}
- />
- );
- case 'tags':
- return ({
- onFocus, onBlur, setNextFocusRef, isFocused,
- }) => (
- <ConditionTags
- {...commonProps}
- onFocus={onFocus}
- onBlur={onBlur}
- setNextFocusRef={setNextFocusRef}
- isFocused={isFocused}
- />
- );
- default: // autocompleteTags
- return ({
- onFocus, onBlur, setNextFocusRef, isFocused,
- }) => (
- <ConditionName
- {...commonProps}
- options={autocompleteValues}
- onFocus={onFocus}
- onBlur={onBlur}
- setNextFocusRef={setNextFocusRef}
- isFocused={isFocused}
- isLoadingOptions={isLoadingAutocompleteValues}
- />
- );
- }
- }
-
- renderSearchCondition(condition, index) {
- const {
- conditions,
- autocompleteKeys,
- fetchAutocompleteValues,
- } = this.props;
-
- const commonProps = {
- keyString: condition.key,
- keyOptions: getConditionKeyListWithAvailability(condition.key, conditions, autocompleteKeys),
- onConditionKeyChange: (conditionKey) => {
- this.handleConditionKeyChange(index, conditionKey);
- },
- onDeleteButtonClick: () => { this.handleDeleteConditionButtonClick(index); },
- };
-
- if (isAutocompleteKey(condition.key)) {
- return (
- <SearchCondition
- {...commonProps}
- onKeyFocus={() => {
- fetchAutocompleteValues(condition.key);
- this.handleConditionFocus();
- }}
- onValueFocus={() => {
- fetchAutocompleteValues(condition.key);
- this.handleConditionFocus();
- }}
- onKeyBlur={this.handleConditionKeyBlur}
- onValueBlur={this.handleConditionValueBlur}
- >
- { this.renderCondition(condition.key, index, condition.value) }
- </SearchCondition>
- );
- }
- return (
- <SearchCondition
- {...commonProps}
- onKeyFocus={this.handleConditionFocus}
- onValueFocus={this.handleConditionFocus}
- onKeyBlur={this.handleConditionKeyBlur}
- onValueBlur={this.handleConditionValueBlur}
- >
- { this.renderCondition(condition.key, index, condition.value) }
- </SearchCondition>
- );
- }
-
- render() {
- const {
- conditions,
- lookbackCondition,
- limitCondition,
- } = this.props;
- return (
- <div className="global-search">
- <div className="global-search__conditions">
- {
- conditions.length === 0
- ? (
- <div className="global-search__placeholder">
- Please select the criteria for your trace lookup.
- </div>
- )
- : conditions.map((condition, index) => (
- <div
- key={condition._id}
- className="global-search__search-condition-wrapper"
- >
- { this.renderSearchCondition(condition, index) }
- </div>
- ))
- }
- <div
- role="presentation"
- onClick={this.handleAddButtonClick}
- className="global-search__add-condition-button"
- >
- <span className="fas fa-plus global-search__add-condition-button-icon" />
- </div>
- <div
- role="presentation"
- onClick={this.handleSearchButtonClick}
- className="global-search__find-button"
- >
- <span className="fas fa-search global-search__find-button-icon" />
- </div>
- </div>
- <div className="global-search__condition-limit-wrapper">
- <ConditionLimit
- limit={limitCondition}
- onLimitChange={this.handleLimitChange}
- />
- </div>
- <div className="global-search__condition-lookback-wrapper">
- <ConditionLookback
- lookback={lookbackCondition}
- onLookbackChange={this.handleLookbackChange}
- />
- </div>
- <div className="global-search__dropdown-menu-wrapper">
- <GlobalDropdownMenuContainer />
- </div>
- </div>
- );
- }
-}
-
-GlobalSearch.propTypes = propTypes;
-
-export default withRouter(GlobalSearch);
+export { default } from './GlobalSearch';
diff --git a/zipkin-lens/src/components/MiniTimeline/index.js b/zipkin-lens/src/components/MiniTimeline/MiniTimeline.jsx
similarity index 100%
copy from zipkin-lens/src/components/MiniTimeline/index.js
copy to zipkin-lens/src/components/MiniTimeline/MiniTimeline.jsx
diff --git a/zipkin-lens/src/components/MiniTimeline/index.test.js b/zipkin-lens/src/components/MiniTimeline/MiniTimeline.test.js
similarity index 98%
rename from zipkin-lens/src/components/MiniTimeline/index.test.js
rename to zipkin-lens/src/components/MiniTimeline/MiniTimeline.test.js
index 1139bdf..4643cef 100644
--- a/zipkin-lens/src/components/MiniTimeline/index.test.js
+++ b/zipkin-lens/src/components/MiniTimeline/MiniTimeline.test.js
@@ -17,7 +17,7 @@
import React from 'react';
import { shallow } from 'enzyme';
-import MiniTimeline from './index';
+import MiniTimeline from './MiniTimeline';
describe('<MiniTimeline />', () => {
const commonProps = {
diff --git a/zipkin-lens/src/components/MiniTimeline/MiniTimelineGraph.js b/zipkin-lens/src/components/MiniTimeline/MiniTimelineGraph.jsx
similarity index 100%
rename from zipkin-lens/src/components/MiniTimeline/MiniTimelineGraph.js
rename to zipkin-lens/src/components/MiniTimeline/MiniTimelineGraph.jsx
diff --git a/zipkin-lens/src/components/MiniTimeline/MiniTimelineLabel.js b/zipkin-lens/src/components/MiniTimeline/MiniTimelineLabel.jsx
similarity index 100%
rename from zipkin-lens/src/components/MiniTimeline/MiniTimelineLabel.js
rename to zipkin-lens/src/components/MiniTimeline/MiniTimelineLabel.jsx
diff --git a/zipkin-lens/src/components/MiniTimeline/MiniTimelineSlider.js b/zipkin-lens/src/components/MiniTimeline/MiniTimelineSlider.jsx
similarity index 100%
rename from zipkin-lens/src/components/MiniTimeline/MiniTimelineSlider.js
rename to zipkin-lens/src/components/MiniTimeline/MiniTimelineSlider.jsx
diff --git a/zipkin-lens/src/components/MiniTimeline/MiniTimelineTimeMarkers.js b/zipkin-lens/src/components/MiniTimeline/MiniTimelineTimeMarkers.jsx
similarity index 100%
rename from zipkin-lens/src/components/MiniTimeline/MiniTimelineTimeMarkers.js
rename to zipkin-lens/src/components/MiniTimeline/MiniTimelineTimeMarkers.jsx
diff --git a/zipkin-lens/src/components/MiniTimeline/index.js b/zipkin-lens/src/components/MiniTimeline/index.js
index d85435b..7bf72b6 100644
--- a/zipkin-lens/src/components/MiniTimeline/index.js
+++ b/zipkin-lens/src/components/MiniTimeline/index.js
@@ -14,55 +14,4 @@
* See the License for the specific language governing permissions and
* limitations under the License.
*/
-import PropTypes from 'prop-types';
-import React from 'react';
-
-import MiniTimelineGraph from './MiniTimelineGraph';
-import MiniTimelineLabel from './MiniTimelineLabel';
-import MiniTimelineSlider from './MiniTimelineSlider';
-import { detailedTraceSummaryPropTypes } from '../../prop-types';
-
-const defaultNumTimeMarkers = 5;
-
-const propTypes = {
- startTs: PropTypes.number.isRequired,
- endTs: PropTypes.number.isRequired,
- traceSummary: detailedTraceSummaryPropTypes.isRequired,
- onStartAndEndTsChange: PropTypes.func.isRequired,
-};
-
-const MiniTimeline = ({
- startTs, endTs, traceSummary, onStartAndEndTsChange,
-}) => {
- const { spans, duration } = traceSummary;
- if (spans.length <= 1) {
- return null;
- }
-
- return (
- <div className="mini-timeline">
- <MiniTimelineLabel
- numTimeMarkers={defaultNumTimeMarkers}
- duration={duration}
- />
- <MiniTimelineGraph
- spans={spans}
- duration={duration}
- startTs={startTs}
- endTs={endTs}
- onStartAndEndTsChange={onStartAndEndTsChange}
- numTimeMarkers={defaultNumTimeMarkers}
- />
- <MiniTimelineSlider
- duration={duration}
- startTs={startTs}
- endTs={endTs}
- onStartAndEndTsChange={onStartAndEndTsChange}
- />
- </div>
- );
-};
-
-MiniTimeline.propTypes = propTypes;
-
-export default MiniTimeline;
+export { default } from './MiniTimeline';
diff --git a/zipkin-lens/src/components/Timeline/index.js b/zipkin-lens/src/components/Timeline/Timeline.jsx
similarity index 100%
copy from zipkin-lens/src/components/Timeline/index.js
copy to zipkin-lens/src/components/Timeline/Timeline.jsx
diff --git a/zipkin-lens/src/components/Timeline/TimelineHeader.js b/zipkin-lens/src/components/Timeline/TimelineHeader.jsx
similarity index 100%
rename from zipkin-lens/src/components/Timeline/TimelineHeader.js
rename to zipkin-lens/src/components/Timeline/TimelineHeader.jsx
diff --git a/zipkin-lens/src/components/Timeline/TimelineSpan.js b/zipkin-lens/src/components/Timeline/TimelineSpan.jsx
similarity index 100%
rename from zipkin-lens/src/components/Timeline/TimelineSpan.js
rename to zipkin-lens/src/components/Timeline/TimelineSpan.jsx
diff --git a/zipkin-lens/src/components/Timeline/TimelineSpanData.js b/zipkin-lens/src/components/Timeline/TimelineSpanData.jsx
similarity index 100%
rename from zipkin-lens/src/components/Timeline/TimelineSpanData.js
rename to zipkin-lens/src/components/Timeline/TimelineSpanData.jsx
diff --git a/zipkin-lens/src/components/Timeline/index.js b/zipkin-lens/src/components/Timeline/index.js
index 2501057..405b637 100644
--- a/zipkin-lens/src/components/Timeline/index.js
+++ b/zipkin-lens/src/components/Timeline/index.js
@@ -14,153 +14,4 @@
* See the License for the specific language governing permissions and
* limitations under the License.
*/
-import PropTypes from 'prop-types';
-import React from 'react';
-
-import TimelineHeader from './TimelineHeader';
-import TimelineSpan from './TimelineSpan';
-import { detailedTraceSummaryPropTypes } from '../../prop-types';
-
-const propTypes = {
- startTs: PropTypes.number.isRequired,
- endTs: PropTypes.number.isRequired,
- traceSummary: detailedTraceSummaryPropTypes.isRequired,
-};
-
-const defaultServiceNameColumnWidth = 0.2;
-const defaultSpanNameColumnWidth = 0.1;
-const defaultNumTimeMarkers = 5;
-
-class Timeline extends React.Component {
- constructor(props) {
- super(props);
- this.state = {
- serviceNameColumnWidth: defaultServiceNameColumnWidth,
- spanNameColumnWidth: defaultSpanNameColumnWidth,
- childrenClosedSpans: {},
- dataOpenedSpans: {},
- };
- this.handleServiceNameColumnWidthChange = this.handleServiceNameColumnWidthChange.bind(this);
- this.handleSpanNameColumnWidthChange = this.handleSpanNameColumnWidthChange.bind(this);
- this.handleChildrenOpenToggle = this.handleChildrenOpenToggle.bind(this);
- this.handleDataOpenToggle = this.handleDataOpenToggle.bind(this);
- }
-
- handleServiceNameColumnWidthChange(serviceNameColumnWidth) {
- this.setState({ serviceNameColumnWidth });
- }
-
- handleSpanNameColumnWidthChange(spanNameColumnWidth) {
- this.setState({ spanNameColumnWidth });
- }
-
- handleChildrenOpenToggle(spanId) {
- const { childrenClosedSpans: prevChildrenClosedSpans } = this.state;
-
- let childrenClosedSpans = {};
- if (prevChildrenClosedSpans[spanId]) {
- childrenClosedSpans = {
- ...prevChildrenClosedSpans,
- [spanId]: undefined,
- };
- } else {
- childrenClosedSpans = {
- ...prevChildrenClosedSpans,
- [spanId]: true,
- };
- }
- this.setState({ childrenClosedSpans });
- }
-
- handleDataOpenToggle(spanId) {
- const { dataOpenedSpans: prevDataOpenedSpans } = this.state;
-
- let dataOpenedSpans = {};
- if (prevDataOpenedSpans[spanId]) {
- dataOpenedSpans = {
- ...prevDataOpenedSpans,
- [spanId]: false,
- };
- } else {
- dataOpenedSpans = {
- ...prevDataOpenedSpans,
- [spanId]: true,
- };
- }
- this.setState({ dataOpenedSpans });
- }
-
- render() {
- const { startTs, endTs, traceSummary } = this.props;
- const {
- serviceNameColumnWidth,
- spanNameColumnWidth,
- childrenClosedSpans,
- dataOpenedSpans,
- } = this.state;
-
- const closed = {};
- for (let i = 0; i < traceSummary.spans.length; i += 1) {
- if (childrenClosedSpans[traceSummary.spans[i].parentId]) {
- closed[traceSummary.spans[i].spanId] = true;
- }
- }
-
- return (
- <div className="timeline">
- <TimelineHeader
- startTs={startTs}
- endTs={endTs}
- serviceNameColumnWidth={serviceNameColumnWidth}
- spanNameColumnWidth={spanNameColumnWidth}
- numTimeMarkers={defaultNumTimeMarkers}
- onServiceNameColumnWidthChange={this.handleServiceNameColumnWidthChange}
- onSpanNameColumnWidthChange={this.handleSpanNameColumnWidthChange}
- />
- {
- traceSummary.spans.map(
- (span, index, spans) => {
- let hasChildren = false;
- if (index < spans.length - 1) {
- if (spans[index + 1].depth > span.depth) {
- hasChildren = true;
- }
- }
- /* Skip closed spans */
- if (closed[span.spanId]) {
- if (hasChildren) {
- for (let i = 0; i < span.childIds.length; i += 1) {
- closed[span.childIds[i]] = true;
- }
- }
- return null;
- }
- return (
- <TimelineSpan
- key={span.spanId}
- startTs={startTs}
- endTs={endTs}
- traceDuration={traceSummary.duration}
- traceTimestamp={traceSummary.spans[0].timestamp}
- numTimeMarkers={defaultNumTimeMarkers}
- serviceNameColumnWidth={serviceNameColumnWidth}
- spanNameColumnWidth={spanNameColumnWidth}
- span={span}
- hasChildren={hasChildren}
- areChildrenOpened={!childrenClosedSpans[span.spanId]}
- areDataOpened={!!dataOpenedSpans[span.spanId]}
- onChildrenOpenToggle={this.handleChildrenOpenToggle}
- onDataOpenToggle={this.handleDataOpenToggle}
- />
- );
- },
- )
- }
- </div>
- );
- }
-}
-
-Timeline.propTypes = propTypes;
-
-export default Timeline;
+export { default } from './Timeline';
diff --git a/zipkin-lens/src/components/TracePage/index.js b/zipkin-lens/src/components/TracePage/index.jsx
similarity index 100%
rename from zipkin-lens/src/components/TracePage/index.js
rename to zipkin-lens/src/components/TracePage/index.jsx
diff --git a/zipkin-lens/src/components/TraceViewer/index.js b/zipkin-lens/src/components/TraceViewer/index.jsx
similarity index 100%
rename from zipkin-lens/src/components/TraceViewer/index.js
rename to zipkin-lens/src/components/TraceViewer/index.jsx
[incubator-zipkin] 01/02: Update webpack configs
Posted by ad...@apache.org.
This is an automated email from the ASF dual-hosted git repository.
adriancole pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/incubator-zipkin.git
commit 6125bce115b6abebc15f3129d177f0286174038c
Author: tacigar <ig...@gmail.com>
AuthorDate: Fri May 10 13:11:16 2019 +0900
Update webpack configs
---
zipkin-lens/webpack.dev.config.js | 4 ++--
zipkin-lens/webpack.prod.config.js | 4 ++--
2 files changed, 4 insertions(+), 4 deletions(-)
diff --git a/zipkin-lens/webpack.dev.config.js b/zipkin-lens/webpack.dev.config.js
index 435eb17..dbf6f31 100644
--- a/zipkin-lens/webpack.dev.config.js
+++ b/zipkin-lens/webpack.dev.config.js
@@ -29,7 +29,7 @@ module.exports = {
module: {
rules: [
{
- test: /\.js$/,
+ test: /\.(js|jsx)$/,
exclude: [/node_modules/],
use: {
loader: 'babel-loader',
@@ -68,7 +68,7 @@ module.exports = {
],
},
resolve: {
- extensions: ['.js'],
+ extensions: ['.js', '.jsx'],
},
plugins: [
new HtmlWebpackPlugin({
diff --git a/zipkin-lens/webpack.prod.config.js b/zipkin-lens/webpack.prod.config.js
index 6b17a32..fd6131a 100644
--- a/zipkin-lens/webpack.prod.config.js
+++ b/zipkin-lens/webpack.prod.config.js
@@ -32,7 +32,7 @@ module.exports = {
module: {
rules: [
{
- test: /\.js$/,
+ test: /\.(js|jsx)$/,
exclude: [/node_modules/],
use: {
loader: 'babel-loader',
@@ -87,7 +87,7 @@ module.exports = {
],
},
resolve: {
- extensions: ['.js'],
+ extensions: ['.js', '.jsx'],
},
plugins: [
new ExtractTextPlugin('style-[hash].min.css', { allChunks: true }),