github/weave-scope
1
0
Fork 0
mirror of https://github.com/weaveworks/scope.git synced 2026-07-28 17:51:21 +00:00
Code Issues Packages Projects Releases Wiki Activity

Docker Labels Component

Browse Source 
* moved to bottom of details panel in its own section
* show all labels (no expand/collapse)
* label vs value width 1:1
This commit is contained in:
David Kaltschmidt
2016-02-15 17:09:40 +00:00
parent 53f3f78d34
commit 7dfb126e31
3 changed files with 59 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
client/app/scripts/components/node-details.js
View File

@@ -4,6 +4,7 @@ import React from 'react';
import NodeDetailsControls from './node-details/node-details-controls';
import NodeDetailsHealth from './node-details/node-details-health';
import NodeDetailsInfo from './node-details/node-details-info';
import NodeDetailsLabels from './node-details/node-details-labels';
import NodeDetailsRelatives from './node-details/node-details-relatives';
import NodeDetailsTable from './node-details/node-details-table';
import { clickCloseDetails, clickShowTopologyForNode } from '../actions/app-actions';
@@ -169,8 +170,6 @@ export default class NodeDetails extends React.Component {
<div className="node-details-content-section-header">Status</div>
{details.metrics && <NodeDetailsHealth metrics={details.metrics} />}
{details.metadata && <NodeDetailsInfo rows={details.metadata} />}
{details.docker_labels && <div className="node-details-content-section-header">Docker Labels</div>}
{details.docker_labels && <NodeDetailsInfo rows={details.docker_labels} />}
</div>}
{details.children && details.children.map(children => {
@@ -180,6 +179,11 @@ export default class NodeDetails extends React.Component {
</div>
);
})}
{details.docker_labels && details.docker_labels.length > 0 && <div className="node-details-content-section">
<div className="node-details-content-section-header">Docker Labels</div>
<NodeDetailsLabels rows={details.docker_labels} />
</div>}
</div>
</div>
);

24
client/app/scripts/components/node-details/node-details-labels.js Normal file
View File

@@ -0,0 +1,24 @@
import React from 'react';
export default class NodeDetailsLabels extends React.Component {
render() {
return (
<div className="node-details-labels">
{this.props.rows.map(field => {
return (
<div className="node-details-labels-field" key={field.id}>
<div className="node-details-labels-field-label truncate" title={field.label}>
{field.label}
</div>
<div className="node-details-labels-field-value" title={field.value}>
<div className="truncate">
{field.value}
</div>
</div>
</div>
);
})}
</div>
);
}
}