+
-
+
Queue metrics not available
diff --git a/x-pack/plugins/monitoring/public/components/logstash/pipeline_viewer/views/config_viewer/statement.js b/x-pack/plugins/monitoring/public/components/logstash/pipeline_viewer/views/statement.js
similarity index 83%
rename from x-pack/plugins/monitoring/public/components/logstash/pipeline_viewer/views/config_viewer/statement.js
rename to x-pack/plugins/monitoring/public/components/logstash/pipeline_viewer/views/statement.js
index 545c7934db8e0..590302128efde 100644
--- a/x-pack/plugins/monitoring/public/components/logstash/pipeline_viewer/views/config_viewer/statement.js
+++ b/x-pack/plugins/monitoring/public/components/logstash/pipeline_viewer/views/statement.js
@@ -6,15 +6,15 @@
import React from 'react';
import PropTypes from 'prop-types';
-import { PluginStatement as PluginStatementModel } from '../../models/pipeline/plugin_statement';
+import { PluginStatement as PluginStatementModel } from '../models/pipeline/plugin_statement';
import { CollapsibleStatement } from './collapsible_statement';
-import { IfElement } from '../../models/list/if_element';
+import { IfElement } from '../models/list/if_element';
import { PluginStatement } from './plugin_statement';
function renderNestingSpacers(depth) {
const spacers = [];
for (let i = 0; i < depth; i += 1) {
- spacers.push(
);
+ spacers.push(
);
}
return spacers;
}
@@ -56,8 +56,8 @@ export function Statement(props) {
const { depth } = props.element;
return (
-
-
+
+
{renderNestingSpacers(depth)}
{renderStatement(props)}
diff --git a/x-pack/plugins/monitoring/public/components/logstash/pipeline_viewer/views/config_viewer/statement_list_heading.js b/x-pack/plugins/monitoring/public/components/logstash/pipeline_viewer/views/statement_list_heading.js
similarity index 100%
rename from x-pack/plugins/monitoring/public/components/logstash/pipeline_viewer/views/config_viewer/statement_list_heading.js
rename to x-pack/plugins/monitoring/public/components/logstash/pipeline_viewer/views/statement_list_heading.js
diff --git a/x-pack/plugins/monitoring/public/components/logstash/pipeline_viewer/views/config_viewer/statement_section.js b/x-pack/plugins/monitoring/public/components/logstash/pipeline_viewer/views/statement_section.js
similarity index 97%
rename from x-pack/plugins/monitoring/public/components/logstash/pipeline_viewer/views/config_viewer/statement_section.js
rename to x-pack/plugins/monitoring/public/components/logstash/pipeline_viewer/views/statement_section.js
index f0f165c82ea7e..57cdf164c12be 100644
--- a/x-pack/plugins/monitoring/public/components/logstash/pipeline_viewer/views/config_viewer/statement_section.js
+++ b/x-pack/plugins/monitoring/public/components/logstash/pipeline_viewer/views/statement_section.js
@@ -19,7 +19,7 @@ export function StatementSection({
if (!elements.length) { return null; }
return (
-
+
+
{
elements.map(this.renderStatement)
}
diff --git a/x-pack/plugins/monitoring/public/directives/logstash/pipeline_viewer/index.js b/x-pack/plugins/monitoring/public/directives/logstash/pipeline_viewer/index.js
index 5c52c2a83ecce..da2d90ab49ac1 100644
--- a/x-pack/plugins/monitoring/public/directives/logstash/pipeline_viewer/index.js
+++ b/x-pack/plugins/monitoring/public/directives/logstash/pipeline_viewer/index.js
@@ -8,42 +8,40 @@ import React from 'react';
import { render } from 'react-dom';
import moment from 'moment';
import { uiModules } from 'ui/modules';
-import { ConfigViewer } from 'plugins/monitoring/components/logstash/pipeline_viewer';
+import { PipelineViewer } from 'plugins/monitoring/components/logstash/pipeline_viewer';
import { Pipeline } from 'plugins/monitoring/components/logstash/pipeline_viewer/models/pipeline';
import { List } from 'plugins/monitoring/components/logstash/pipeline_viewer/models/list';
import { PipelineState } from 'plugins/monitoring/components/logstash/pipeline_viewer/models/pipeline_state';
const uiModule = uiModules.get('monitoring/directives', []);
-uiModule.directive('monitoringLogstashPipelineViewer', ($injector) => {
+uiModule.directive('monitoringLogstashPipelineViewer', $injector => {
const config = $injector.get('config');
const dateFormat = config.get('dateFormat');
- const timeseriesTooltipXValueFormatter = xValue => moment(xValue).format(dateFormat);
+ const timeseriesTooltipXValueFormatter = xValue =>
+ moment(xValue).format(dateFormat);
return {
restrict: 'E',
scope: {
- pipeline: '='
+ pipeline: '=',
},
- link: function (scope, $el) {
+ link: (scope, $el) => {
const pipelineState = new PipelineState(scope.pipeline);
- scope.$watch('pipeline', (updatedPipeline) => {
+ scope.$watch('pipeline', updatedPipeline => {
pipelineState.update(updatedPipeline);
- const configViewer = (
-
+ />,
+ $el[0]
);
- render(configViewer, $el[0]);
});
- }
+ },
};
});
diff --git a/x-pack/plugins/monitoring/public/less/components/logstash/config_viewer.less b/x-pack/plugins/monitoring/public/less/components/logstash/config_viewer.less
deleted file mode 100644
index b237affc0c530..0000000000000
--- a/x-pack/plugins/monitoring/public/less/components/logstash/config_viewer.less
+++ /dev/null
@@ -1,98 +0,0 @@
-@import (reference) '~ui/styles/variables/colors';
-
-monitoring-main[page="pipeline"] {
- background: @globalColorLightestGray;
- min-height: 100vh;
-}
-
-.configViewer {
- max-width: 1000px;
-}
-
-.configViewer__statement {
- padding-left: 12px;
-}
-
-.configViewer__plugin {
- margin-left: 4px;
-}
-
-.configViewer__spaceContainer {
- background-color: white;
- align-self: stretch;
- display: flex;
- // Separates the left border spaces properly
- border-bottom: solid 2px white;
-}
-
-.configViewer__spacer {
- width: 12px;
- align-self: stretch;
- margin-left: 12px;
- border-left: 1px @globalColorMediumGray dashed;
-
- // This allows the border to be flush
- &:last-child {
- width: 0px;
- }
-
- &:first-child {
- // Odd number is because of the single pixel border.
- margin-left: 23px;
- }
-}
-
-.configViewer__metric {
- text-align: right;
-
- &--cputTime {
- width: 40px;
- }
-
- &--events, &--eventsEmitted {
- width: 160px;
- }
-
- &--eventMillis {
- width: 80px;
- }
-}
-
-.configViewer__queueMessage {
- margin-left: 24px;
- color: @globalColorDarkGray;
-}
-
-.configViewer__list {
- .configViewer__listItem {
- display: flex;
- min-height: 32px;
- align-items: center;
- padding-right: 12px;
-
- &:nth-child(2n+1) {
- background: #fafafa;
- }
- }
-}
-
-.configViewer__conditional {
- font-weight: bold;
-}
-
-@media (max-width: 768px) {
- .configViewer {
- .configViewer__spacer {
- border: none;
- }
-
- .configViewer__metricFlexItem {
- margin-bottom: 4px !important;
- }
-
- .configViewer__metric {
- text-align: left;
- padding-left: 32px;
- }
- }
-}
diff --git a/x-pack/plugins/monitoring/public/less/components/logstash/pipeline_viewer.less b/x-pack/plugins/monitoring/public/less/components/logstash/pipeline_viewer.less
index fb8229739d5d9..590c0874b2ef6 100644
--- a/x-pack/plugins/monitoring/public/less/components/logstash/pipeline_viewer.less
+++ b/x-pack/plugins/monitoring/public/less/components/logstash/pipeline_viewer.less
@@ -1,3 +1,103 @@
+@import (reference) '~ui/styles/variables/colors';
+
+monitoring-main[page="pipeline"] {
+ background: @globalColorLightestGray;
+ min-height: 100vh;
+}
+
+.pipelineViewer {
+ max-width: 1000px;
+}
+
+.pipelineViewer__statement {
+ padding-left: 12px;
+}
+
+.pipelineViewer__plugin {
+ margin-left: 4px;
+}
+
+.pipelineViewer__spaceContainer {
+ background-color: white;
+ align-self: stretch;
+ display: flex;
+ // Separates the left border spaces properly
+ border-bottom: solid 2px white;
+}
+
+.pipelineViewer__spacer {
+ width: 12px;
+ align-self: stretch;
+ margin-left: 12px;
+ border-left: 1px @globalColorMediumGray dashed;
+
+ // This allows the border to be flush
+ &:last-child {
+ width: 0px;
+ }
+
+ &:first-child {
+ // Odd number is because of the single pixel border.
+ margin-left: 23px;
+ }
+}
+
+.pipelineViewer__metric {
+ text-align: right;
+
+ &--cpuTime {
+ width: 40px;
+ }
+
+ &--events, &--eventsEmitted {
+ width: 160px;
+ }
+
+ &--eventMillis {
+ width: 80px;
+ }
+}
+
+.pipelineViewer__queueMessage {
+ margin-left: 24px;
+ color: @globalColorDarkGray;
+}
+
+.pipelineViewer__list {
+ .pipelineViewer__listItem {
+ display: flex;
+ min-height: 32px;
+ align-items: center;
+ padding-right: 12px;
+
+ &:nth-child(2n+1) {
+ background: #fafafa;
+ }
+ }
+}
+
+.pipelineViewer__conditional {
+ font-weight: bold;
+}
+
+@media (max-width: 768px) {
+ .pipelineViewer {
+ .pipelineViewer__spacer {
+ border: none;
+ }
+
+ .pipelineViewer__metricFlexItem {
+ margin-bottom: 4px !important;
+ }
+
+ .pipelineViewer__metric {
+ text-align: left;
+ padding-left: 32px;
+ }
+ }
+}
+
+
.monitoring-summary-status {
border-bottom: 1px solid #d4d4d4;
}
diff --git a/x-pack/plugins/monitoring/public/less/main.less b/x-pack/plugins/monitoring/public/less/main.less
index 08be28be7d69e..c140aabfc0a06 100644
--- a/x-pack/plugins/monitoring/public/less/main.less
+++ b/x-pack/plugins/monitoring/public/less/main.less
@@ -11,7 +11,6 @@
@import './components/chart';
@import './components/sparkline';
@import './components/status_icon';
-@import './components/logstash/config_viewer';
@import './components/logstash/pipeline_viewer';
@import './components/logstash/pipeline_card_group';
@import './components/logstash/beta_icon';