1
0
mirror of https://github.com/yldio/copilot.git synced 2024-11-14 15:20:06 +02:00

feat(ui-toolkit, cp-frontend): Disable quick actions menu remove services filter add service

This commit is contained in:
JUDIT GRESKOVITS 2017-07-19 17:51:21 +01:00 committed by Sérgio Ramos
parent 173b6c9307
commit 7f9eada428
3 changed files with 18 additions and 29 deletions

View File

@ -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
: <TooltipButton onClick={handleStartClick}>Start</TooltipButton>;
: <TooltipButton onClick={handleStartClick} disabled={disabled}>Start</TooltipButton>;
const stopService = status === 'STOPPED'
? null
: <TooltipButton onClick={handleStopClick}>Stop</TooltipButton>;
: <TooltipButton onClick={handleStopClick} disabled={disabled}>Stop</TooltipButton>;
return (
<Tooltip {...p} onBlur={onBlur}>
<TooltipButton onClick={handleScaleClick}>Scale</TooltipButton>
<TooltipButton onClick={handleRestartClick}>Restart</TooltipButton>
<TooltipButton onClick={handleScaleClick} disabled={disabled}>Scale</TooltipButton>
<TooltipButton onClick={handleRestartClick} disabled={disabled}>Restart</TooltipButton>
{startService}
{stopService}
<TooltipDivider />
<TooltipButton onClick={handleDeleteClick}>Delete</TooltipButton>
<TooltipButton onClick={handleDeleteClick} disabled={disabled}>Delete</TooltipButton>
</Tooltip>
);
};

View File

@ -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 (
<EmptyServices />
);
} */
const toggleValue = location.pathname.split('-').pop();
@ -77,16 +64,6 @@ const ServicesMenu = ({ location, history: { push } }) => {
</ToggleList>
</FormGroup>
</Col>
<Col xs={5}>
<StyledForm name="topology-filter">
<StyledFilter placeholder="Filter" />
</StyledForm>
</Col>
<Col xs={2}>
<Button secondary onClick={handleAddService}>
Add a service
</Button>
</Col>
</PaddedRow>
</LayoutContainer>
);

View File

@ -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 =>