Add metrics link to topology
Add metrics link to topology Add metrics link to topology Add metrics link to topology Add tooltip data to list view too Add metrics link to quick actions
This commit is contained in:
parent
70b640fddf
commit
b0a266a020
@ -1,43 +1,53 @@
|
||||
import React from 'react';
|
||||
import Tooltip, { TooltipButton, TooltipDivider } from '@ui/components/tooltip';
|
||||
|
||||
// eslint-disable-next-line max-len
|
||||
const scaleLink = 'https://projects.invisionapp.com/share/YDAKI8CW4#/screens/221841542_Deployed_Services_1-8';
|
||||
|
||||
const ServicesTooltip = ({
|
||||
show,
|
||||
position,
|
||||
data,
|
||||
...rest
|
||||
}) => show ? (
|
||||
<Tooltip {...position} {...rest}>
|
||||
<li>
|
||||
<TooltipButton href={scaleLink}>
|
||||
Scale
|
||||
</TooltipButton>
|
||||
</li>
|
||||
<li>
|
||||
<TooltipButton>Rollback</TooltipButton>
|
||||
</li>
|
||||
<li>
|
||||
<TooltipButton>Reprovision</TooltipButton>
|
||||
</li>
|
||||
<li>
|
||||
<TooltipButton>Transfer</TooltipButton>
|
||||
</li>
|
||||
<li>
|
||||
<TooltipButton>Setup metrics</TooltipButton>
|
||||
</li>
|
||||
<TooltipDivider />
|
||||
<li>
|
||||
<TooltipButton>Stop</TooltipButton>
|
||||
</li>
|
||||
<li>
|
||||
<TooltipButton>Delete</TooltipButton>
|
||||
</li>
|
||||
</Tooltip>
|
||||
) : null;
|
||||
}) => {
|
||||
if(!show) {
|
||||
return null;
|
||||
}
|
||||
// eslint-disable-next-line max-len
|
||||
const scaleLink = 'https://projects.invisionapp.com/share/YDAKI8CW4#/screens/221841542_Deployed_Services_1-8';
|
||||
// eslint-disable-next-line max-len
|
||||
const metricsLink = `/${data.orgId}/projects/${data.projectId}/services/${data.serviceId}/metrics`;
|
||||
return (
|
||||
<Tooltip {...position} {...rest}>
|
||||
<li>
|
||||
<TooltipButton href={scaleLink}>
|
||||
Scale
|
||||
</TooltipButton>
|
||||
</li>
|
||||
<li>
|
||||
<TooltipButton>Rollback</TooltipButton>
|
||||
</li>
|
||||
<li>
|
||||
<TooltipButton>Reprovision</TooltipButton>
|
||||
</li>
|
||||
<li>
|
||||
<TooltipButton>Transfer</TooltipButton>
|
||||
</li>
|
||||
<li>
|
||||
<TooltipButton to={metricsLink}>
|
||||
Setup metrics
|
||||
</TooltipButton>
|
||||
</li>
|
||||
<TooltipDivider />
|
||||
<li>
|
||||
<TooltipButton>Stop</TooltipButton>
|
||||
</li>
|
||||
<li>
|
||||
<TooltipButton>Delete</TooltipButton>
|
||||
</li>
|
||||
</Tooltip>
|
||||
);
|
||||
};
|
||||
|
||||
ServicesTooltip.propTypes = {
|
||||
data: React.PropTypes.object,
|
||||
position: React.PropTypes.object,
|
||||
show: React.PropTypes.bool
|
||||
};
|
||||
|
@ -61,7 +61,12 @@ class Services extends React.Component {
|
||||
|
||||
toggleTooltip({
|
||||
service: service,
|
||||
position: position
|
||||
position: position,
|
||||
data: {
|
||||
serviceId: service.id,
|
||||
orgId: org.id,
|
||||
projectId: project.id
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
|
@ -27,12 +27,25 @@ const StyledContainer = styled(LayoutContainer)`
|
||||
const Services = (props) => {
|
||||
const {
|
||||
services = [],
|
||||
org = {},
|
||||
project = {},
|
||||
toggleTooltip,
|
||||
uiTooltip
|
||||
} = props;
|
||||
|
||||
const onQuickActions = (evt, tooltipData) => {
|
||||
toggleTooltip(tooltipData);
|
||||
const service = services.reduce((acc, service) =>
|
||||
service.uuid === tooltipData.service ? service : acc
|
||||
, {});
|
||||
const ttData = {
|
||||
...tooltipData,
|
||||
data: {
|
||||
serviceId: service.id,
|
||||
orgId: org.id,
|
||||
projectId: project.id
|
||||
}
|
||||
};
|
||||
toggleTooltip(ttData);
|
||||
};
|
||||
|
||||
return (
|
||||
@ -49,7 +62,9 @@ const Services = (props) => {
|
||||
};
|
||||
|
||||
Services.propTypes = {
|
||||
org: PropTypes.org,
|
||||
services: React.PropTypes.arrayOf(PropTypes.service),
|
||||
project: PropTypes.project,
|
||||
toggleTooltip: React.PropTypes.func,
|
||||
uiTooltip: React.PropTypes.object
|
||||
};
|
||||
|
@ -50,7 +50,8 @@ export default handleActions({
|
||||
[toggleTooltip.toString()]: (state, action) => {
|
||||
const {
|
||||
position,
|
||||
service
|
||||
service,
|
||||
data
|
||||
} = action.payload;
|
||||
|
||||
const show = state.ui.tooltip.service !== service;
|
||||
@ -60,7 +61,8 @@ export default handleActions({
|
||||
position: {
|
||||
...position
|
||||
},
|
||||
service: service
|
||||
service: service,
|
||||
data: data
|
||||
} : {
|
||||
show: false
|
||||
};
|
||||
|
Loading…
Reference in New Issue
Block a user