diff --git a/packages/cp-frontend/src/components/services/quick-actions.js b/packages/cp-frontend/src/components/services/quick-actions.js index 23f1efd9..2ff85182 100644 --- a/packages/cp-frontend/src/components/services/quick-actions.js +++ b/packages/cp-frontend/src/components/services/quick-actions.js @@ -47,6 +47,8 @@ const ServicesQuickActions = ({ onDeleteClick(evt, service); }; + const disabled = service.transitionalStatus; + const status = service.instances.reduce((status, instance) => { return status ? instance.status === status ? status : 'MIXED' @@ -55,20 +57,20 @@ const ServicesQuickActions = ({ const startService = status === 'RUNNING' ? null - : Start; + : Start; const stopService = status === 'STOPPED' ? null - : Stop; + : Stop; return ( - Scale - Restart + Scale + Restart {startService} {stopService} - Delete + Delete ); }; diff --git a/packages/cp-frontend/src/containers/services/menu.js b/packages/cp-frontend/src/containers/services/menu.js index 98fe876a..c66990cd 100644 --- a/packages/cp-frontend/src/containers/services/menu.js +++ b/packages/cp-frontend/src/containers/services/menu.js @@ -1,13 +1,11 @@ import React from 'react'; import PropTypes from 'prop-types'; -// Import { connect } from 'react-redux'; import { Col, Row } from 'react-styled-flexboxgrid'; import styled from 'styled-components'; import remcalc from 'remcalc'; import unitcalc from 'unitcalc'; - import { LayoutContainer } from '@components/layout'; -// Import { EmptyServices } from '@components/services'; + import { Button, H2, @@ -18,8 +16,6 @@ import { Legend } from 'joyent-ui-toolkit'; -// Import { servicesForTopologySelector } from '@state/selectors'; - const StyledLegend = Legend.extend` float: left; padding-top: ${unitcalc(2)}; @@ -36,10 +32,6 @@ const StyledForm = FormGroup.extend` margin: 0; `; -// Const StyledButton = styled(Button)` -// margin-left: ${remcalc(48)}; -// `; - const StyledFilter = styled(Input)` margin: 0; `; @@ -47,11 +39,6 @@ const StyledFilter = styled(Input)` const handleAddService = () => console.log('Adding a service...'); const ServicesMenu = ({ location, history: { push } }) => { - /* If(!services || !services.length) { - return ( - - ); - } */ const toggleValue = location.pathname.split('-').pop(); @@ -77,16 +64,6 @@ const ServicesMenu = ({ location, history: { push } }) => { - - - - - - - - ); diff --git a/packages/ui-toolkit/src/tooltip/button.js b/packages/ui-toolkit/src/tooltip/button.js index cdc08519..a01aa0f3 100644 --- a/packages/ui-toolkit/src/tooltip/button.js +++ b/packages/ui-toolkit/src/tooltip/button.js @@ -1,6 +1,7 @@ import React from 'react'; import styled from 'styled-components'; import unitcalc from 'unitcalc'; +import is from 'styled-is'; import theme from '../theme'; import Button from '../button'; @@ -32,6 +33,15 @@ const StyledButton = styled(Button)` color: ${theme.primary}; border: none; } + + &[disabled] { + cursor: not-allowed; + pointer-events: none; + } + + ${is('disabled')` + color: ${props => props.theme.grey}; + `} `; const TooltipButton = props =>