diff --git a/frontend/src/components/services/tooltip.js b/frontend/src/components/services/tooltip.js index ac7bb974..a9311116 100644 --- a/frontend/src/components/services/tooltip.js +++ b/frontend/src/components/services/tooltip.js @@ -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 ? ( - -
  • - - Scale - -
  • -
  • - Rollback -
  • -
  • - Reprovision -
  • -
  • - Transfer -
  • -
  • - Setup metrics -
  • - -
  • - Stop -
  • -
  • - Delete -
  • -
    -) : 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 ( + +
  • + + Scale + +
  • +
  • + Rollback +
  • +
  • + Reprovision +
  • +
  • + Transfer +
  • +
  • + + Setup metrics + +
  • + +
  • + Stop +
  • +
  • + Delete +
  • +
    + ); +}; ServicesTooltip.propTypes = { + data: React.PropTypes.object, position: React.PropTypes.object, show: React.PropTypes.bool }; diff --git a/frontend/src/containers/services/list.js b/frontend/src/containers/services/list.js index 892b1ae3..22266ded 100644 --- a/frontend/src/containers/services/list.js +++ b/frontend/src/containers/services/list.js @@ -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 + } }); }; diff --git a/frontend/src/containers/services/topology.js b/frontend/src/containers/services/topology.js index 1a891c56..32ad3a64 100644 --- a/frontend/src/containers/services/topology.js +++ b/frontend/src/containers/services/topology.js @@ -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 }; diff --git a/frontend/src/state/reducers/services.js b/frontend/src/state/reducers/services.js index 2b824fc1..e54d29e4 100644 --- a/frontend/src/state/reducers/services.js +++ b/frontend/src/state/reducers/services.js @@ -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 };