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

feat(ui-toolkit, cp-frontend, cp-gql-mock-server): Mock deleting a deployment group and filter out deleted dgs and services on frontend

This commit is contained in:
JUDIT GRESKOVITS 2017-07-19 17:20:22 +01:00 committed by Sérgio Ramos
parent 6882143a98
commit 173b6c9307
11 changed files with 84 additions and 75 deletions

View File

@ -34,9 +34,9 @@ const TitleInnerContainer = styled.div`
const ServiceListItem = ({
onQuickActionsClick = () => {},
deploymentGroup = '',
service = {}
service = {},
isChild = false
}) => {
const isChild = Boolean(service.parent);
const children = service.children
? service.children.map(service =>
@ -44,13 +44,14 @@ const ServiceListItem = ({
key={service.id}
deploymentGroup={deploymentGroup}
service={service}
isChild
/>
)
: null;
const to = `/deployment-groups/${deploymentGroup}/services/${service.slug}`;
const title = service.parent
const title = isChild
? <CardTitle>
{service.name}
</CardTitle>

View File

@ -1,7 +1,7 @@
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import { compose, graphql } from 'react-apollo';
import DeploymentGroupsDeleteMutation from '@graphql/DeploymentGroupsDeleteMutation.gql';
import DeploymentGroupDeleteMutation from '@graphql/DeploymentGroupDeleteMutation.gql';
import DeploymentGroupQuery from '@graphql/DeploymentGroup.gql';
import { Loader, ErrorMessage } from '@components/messaging';
import { DeploymentGroupDelete as DeploymentGroupDeleteComponent } from '@components/deployment-group';
@ -18,7 +18,7 @@ class DeploymentGroupDelete extends Component {
);
}
const { deploymentGroup, deleteDeploymentGroups, history, match } = this.props;
const { deploymentGroup, deleteDeploymentGroup, history, match } = this.props;
const handleCloseClick = evt => {
const closeUrl = match.url.split('/').slice(0, -2).join('/');
@ -26,7 +26,8 @@ class DeploymentGroupDelete extends Component {
};
const handleConfirmClick = evt => {
deleteDeploymentGroups(deploymentGroup.id).then(() => handleCloseClick());
console.log('deploymentGroup = ', deploymentGroup);
deleteDeploymentGroup(deploymentGroup.id).then(() => handleCloseClick());
};
return (
@ -44,14 +45,14 @@ class DeploymentGroupDelete extends Component {
DeploymentGroupDelete.propTypes = {
deploymentGroup: PropTypes.object,
history: PropTypes.object,
deleteDeploymentGroups: PropTypes.func.isRequired
deleteDeploymentGroup: PropTypes.func.isRequired
};
const DeleteDeploymentGroupsGql = graphql(DeploymentGroupsDeleteMutation, {
const DeleteDeploymentGroupGql = graphql(DeploymentGroupDeleteMutation, {
props: ({ mutate }) => ({
deleteDeploymentGroups: deploymentGroupId =>
deleteDeploymentGroup: deploymentGroupId =>
mutate({
variables: { ids: [deploymentGroupId] }
variables: { id: deploymentGroupId }
})
})
});
@ -73,7 +74,7 @@ const DeploymentGroupGql = graphql(DeploymentGroupQuery, {
})
});
const DeploymentGroupDeleteWithData = compose(DeleteDeploymentGroupsGql, DeploymentGroupGql)(
const DeploymentGroupDeleteWithData = compose(DeleteDeploymentGroupGql, DeploymentGroupGql)(
DeploymentGroupDelete
);

View File

@ -22,7 +22,6 @@ const DGsRows = Row.extend`
margin-top: ${remcalc(-7)};
`;
// const Box = Col.withComponent(Link).extend`
const Box = styled.div`
position: relative;
text-decoration: none;
@ -44,11 +43,6 @@ const Box = styled.div`
const BoxCreate = Box.extend`
background-color: ${props => props.theme.disabled};
flex-direction: column;
justify-content: center;
align-items: center;
align-content: center;
display: flex;
&:hover {
background-color: ${props => props.theme.white};
@ -85,6 +79,14 @@ const StyledLink = styled(Link)`
color: ${props => props.theme.secondary};
`;
const StyledCreateLink = styled(StyledLink)`
flex-direction: column;
justify-content: center;
align-items: center;
align-content: center;
display: flex;
`;
const DeleteButtonContainer = styled.div`
position: absolute;
right: 0;
@ -140,17 +142,21 @@ const DeploymentGroupList = ({
const create = [
<Col xs={12} sm={4} md={3} lg={3} key="~create">
<BoxCreate to={`${match.path}/~create`}>
<Oval>+</Oval>
<CreateTitle>Create new deployment group</CreateTitle>
<BoxCreate>
<StyledCreateLink to={`${match.path}/~create`}>
<Oval>+</Oval>
<CreateTitle>Create new deployment group</CreateTitle>
</StyledCreateLink>
</BoxCreate>
</Col>
].concat(
forceArray(importable).map(({ slug, name }) =>
<Col xs={12} sm={4} md={3} lg={3} key={slug}>
<BoxCreate to={`${match.path}/~import/${slug}`}>
<Oval>&#10549;</Oval>
<CreateTitle>{name}</CreateTitle>
<BoxCreate>
<StyledCreateLink to={`${match.path}/~import/${slug}`}>
<Oval>&#10549;</Oval>
<CreateTitle>{name}</CreateTitle>
</StyledCreateLink>
</BoxCreate>
</Col>
)
@ -184,7 +190,9 @@ export default compose(
pollInterval: 1000
},
props: ({ data: { deploymentGroups, loading, error } }) => ({
deploymentGroups,
deploymentGroups: deploymentGroups && deploymentGroups.length
? deploymentGroups.filter(dg => dg.status !== 'DELETED')
: null,
loading,
error
})

View File

@ -0,0 +1,7 @@
#import "./DeploymentGroupInfo.gql"
mutation DeleteDeploymentGroup($id: ID!) {
deleteDeploymentGroup(id: $id) {
...DeploymentGroupInfo
}
}

View File

@ -1,7 +0,0 @@
#import "./DeploymentGroupInfo.gql"
mutation DeleteDeploymentGroups($ids: [ID]!) {
deleteDeploymentGroups(ids: $ids) {
...DeploymentGroupInfo
}
}

View File

@ -132,14 +132,13 @@ const getService = (service, index) => {
const processServices = services => {
return forceArray(services).reduce((ss, s, i) => {
const serviceIndex = ss.findIndex(existingS => existingS.id === s.id);
if (serviceIndex === -1) {
ss.push(getService(s, i));
} else {
ss.splice(serviceIndex, 1, {
...ss[serviceIndex],
...getService(s, i)
});
if(s.status !== 'DELETED') {
const service = getService(s, i);
if(s.branches && s.branches.length) {
service.children = processServices(s.branches)
}
ss.push(service);
}
return ss;

View File

@ -119,6 +119,34 @@ const createDeploymentGroup = ({ name }) => {
return Promise.resolve(dg);
};
const deleteDeploymentGroup = options => {
const dgId = options.id;
const deleteDeploymentGroup = getServices({ deploymentGroupId: dgId})
.then(services => Promise.all(
services.map(service => handleStatusUpdateRequest(
service.id,
'DELETING',
'STOPPING',
'DELETED',
'DELETED'
))
))
.then(() => {
const deploymentGroup = deploymentGroups.filter(dg => dg.id === dgId).shift();
deploymentGroup.status = 'DELETING';
return deploymentGroup;
return ({ deploymentGroupId: dgId });
return getDeploymentGroups({id: dgId});
});
const timeout = setTimeout(() => {
const deploymentGroup = deploymentGroups.filter(dg => dg.id === dgId).shift();
deploymentGroup.status = 'DELETED';
}, 5000);
return Promise.resolve(deleteDeploymentGroup);
};
const createServicesFromManifest = ({ deploymentGroupId, raw }) => {
const manifest = yaml.safeLoad(raw);
@ -308,6 +336,7 @@ module.exports = {
type: options.type,
format: options.format
})),
deleteDeploymentGroup: (options, request, fn) => fn(null, deleteDeploymentGroup(options)),
deleteServices: (options, request, fn) => fn(null, deleteServices(options)),
scale: (options, reguest, fn) => fn(null, scale(options)),
restartServices: (options, request, fn) => fn(null, restartServices(options)),

View File

@ -230,4 +230,5 @@ type Mutation {
restartInstances(ids: [ID]!): [Instance]
importDeploymentGroup(deploymentGroupSlug: String!): DeploymentGroup
deleteDeploymentGroup(id: ID!): DeploymentGroup
}

View File

@ -15,6 +15,6 @@ const alignsFromProps = props =>
.join(';\n');
export default Component =>
/* Component.extend
Component.extend
? Component.extend`${alignsFromProps}`
: */ styled(Component)`${alignsFromProps}`;
: styled(Component)`${alignsFromProps}`;

View File

@ -110,13 +110,6 @@ const IconButton = props => {
);
};
/* ({ children, ...rest }) =>
<StyledIconButton {...rest}>
<StyledDiv>
{children}
</StyledDiv>
</StyledIconButton>; */
IconButton.propTypes = {
children: PropTypes.node,
onClick: PropTypes.func

View File

@ -3723,11 +3723,11 @@ extsprintf@1.0.2:
version "1.0.2"
resolved "https://registry.yarnpkg.com/extsprintf/-/extsprintf-1.0.2.tgz#e1080e0658e300b06294990cc70e1502235fd550"
extsprintf@1.2.0:
extsprintf@1.2.0, extsprintf@^1.2.0:
version "1.2.0"
resolved "https://registry.yarnpkg.com/extsprintf/-/extsprintf-1.2.0.tgz#5ad946c22f5b32ba7f8cd7426711c6e8a3fc2529"
extsprintf@1.3.0, extsprintf@^1.2.0:
extsprintf@1.3.0:
version "1.3.0"
resolved "https://registry.yarnpkg.com/extsprintf/-/extsprintf-1.3.0.tgz#96918440e3041a7a414f8c52e3c574eb3c3e1e05"
@ -8425,7 +8425,7 @@ squad@^1.1.3:
version "1.1.3"
resolved "https://registry.yarnpkg.com/squad/-/squad-1.1.3.tgz#da09f68d1e0b0a60dca172878fe1f3c9e5272401"
sshpk-agent@1.4.2:
sshpk-agent@1.4.2, sshpk-agent@^1.3.0:
version "1.4.2"
resolved "https://registry.yarnpkg.com/sshpk-agent/-/sshpk-agent-1.4.2.tgz#5739cc08f48f98c53950a1715d20872a53804541"
dependencies:
@ -8434,16 +8434,7 @@ sshpk-agent@1.4.2:
readable-stream "^2.1.4"
sshpk ">=1.9.1 < 1.11.0"
sshpk-agent@^1.3.0:
version "1.6.0"
resolved "https://registry.yarnpkg.com/sshpk-agent/-/sshpk-agent-1.6.0.tgz#56da869e02ad757991c247327e80b261682399af"
dependencies:
assert-plus "^1.0.0"
mooremachine "^2.0.1"
readable-stream "^2.1.4"
sshpk ">=1.13.0 < 1.14.0"
sshpk@1.10.2, "sshpk@>=1.9.1 < 1.11.0":
sshpk@1.10.2, "sshpk@>=1.9.1 < 1.11.0", sshpk@^1.7.0, sshpk@^1.8.3:
version "1.10.2"
resolved "https://registry.yarnpkg.com/sshpk/-/sshpk-1.10.2.tgz#d5a804ce22695515638e798dbe23273de070a5fa"
dependencies:
@ -8458,20 +8449,6 @@ sshpk@1.10.2, "sshpk@>=1.9.1 < 1.11.0":
jsbn "~0.1.0"
tweetnacl "~0.14.0"
"sshpk@>=1.13.0 < 1.14.0", sshpk@^1.7.0, sshpk@^1.8.3:
version "1.13.1"
resolved "https://registry.yarnpkg.com/sshpk/-/sshpk-1.13.1.tgz#512df6da6287144316dc4c18fe1cf1d940739be3"
dependencies:
asn1 "~0.2.3"
assert-plus "^1.0.0"
dashdash "^1.12.0"
getpass "^0.1.1"
optionalDependencies:
bcrypt-pbkdf "^1.0.0"
ecc-jsbn "~0.1.1"
jsbn "~0.1.0"
tweetnacl "~0.14.0"
stack-utils@^1.0.0:
version "1.0.1"
resolved "https://registry.yarnpkg.com/stack-utils/-/stack-utils-1.0.1.tgz#d4f33ab54e8e38778b0ca5cfd3b3afb12db68620"