From 173b6c9307b44318d7665f46c9833fc1d897b53e Mon Sep 17 00:00:00 2001 From: JUDIT GRESKOVITS Date: Wed, 19 Jul 2017 17:20:22 +0100 Subject: [PATCH] feat(ui-toolkit, cp-frontend, cp-gql-mock-server): Mock deleting a deployment group and filter out deleted dgs and services on frontend --- .../src/components/services/list-item.js | 7 ++-- .../src/containers/deployment-group/delete.js | 17 +++++----- .../src/containers/deployment-groups/list.js | 34 ++++++++++++------- .../graphql/DeploymentGroupDeleteMutation.gql | 7 ++++ .../DeploymentGroupsDeleteMutation.gql | 7 ---- packages/cp-frontend/src/state/selectors.js | 15 ++++---- packages/cp-gql-mock-server/src/resolvers.js | 29 ++++++++++++++++ packages/cp-gql-schema/schema.gql | 1 + packages/ui-toolkit/src/basealign/index.js | 4 +-- packages/ui-toolkit/src/icon-button/index.js | 7 ---- yarn.lock | 31 +++-------------- 11 files changed, 84 insertions(+), 75 deletions(-) create mode 100644 packages/cp-frontend/src/graphql/DeploymentGroupDeleteMutation.gql delete mode 100644 packages/cp-frontend/src/graphql/DeploymentGroupsDeleteMutation.gql diff --git a/packages/cp-frontend/src/components/services/list-item.js b/packages/cp-frontend/src/components/services/list-item.js index e122741b..7a27c6d7 100644 --- a/packages/cp-frontend/src/components/services/list-item.js +++ b/packages/cp-frontend/src/components/services/list-item.js @@ -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 ? {service.name} diff --git a/packages/cp-frontend/src/containers/deployment-group/delete.js b/packages/cp-frontend/src/containers/deployment-group/delete.js index 2d3aec8e..8cca8a1e 100644 --- a/packages/cp-frontend/src/containers/deployment-group/delete.js +++ b/packages/cp-frontend/src/containers/deployment-group/delete.js @@ -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 ); diff --git a/packages/cp-frontend/src/containers/deployment-groups/list.js b/packages/cp-frontend/src/containers/deployment-groups/list.js index 7ca135c4..08434e90 100644 --- a/packages/cp-frontend/src/containers/deployment-groups/list.js +++ b/packages/cp-frontend/src/containers/deployment-groups/list.js @@ -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 = [ - - + - Create new deployment group + + + + + Create new deployment group + ].concat( forceArray(importable).map(({ slug, name }) => - - ⤵ - {name} + + + ⤵ + {name} + ) @@ -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 }) diff --git a/packages/cp-frontend/src/graphql/DeploymentGroupDeleteMutation.gql b/packages/cp-frontend/src/graphql/DeploymentGroupDeleteMutation.gql new file mode 100644 index 00000000..83d228c9 --- /dev/null +++ b/packages/cp-frontend/src/graphql/DeploymentGroupDeleteMutation.gql @@ -0,0 +1,7 @@ +#import "./DeploymentGroupInfo.gql" + +mutation DeleteDeploymentGroup($id: ID!) { + deleteDeploymentGroup(id: $id) { + ...DeploymentGroupInfo + } +} diff --git a/packages/cp-frontend/src/graphql/DeploymentGroupsDeleteMutation.gql b/packages/cp-frontend/src/graphql/DeploymentGroupsDeleteMutation.gql deleted file mode 100644 index 68f366d6..00000000 --- a/packages/cp-frontend/src/graphql/DeploymentGroupsDeleteMutation.gql +++ /dev/null @@ -1,7 +0,0 @@ -#import "./DeploymentGroupInfo.gql" - -mutation DeleteDeploymentGroups($ids: [ID]!) { - deleteDeploymentGroups(ids: $ids) { - ...DeploymentGroupInfo - } -} diff --git a/packages/cp-frontend/src/state/selectors.js b/packages/cp-frontend/src/state/selectors.js index f6e69ee2..7c8951bd 100644 --- a/packages/cp-frontend/src/state/selectors.js +++ b/packages/cp-frontend/src/state/selectors.js @@ -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; diff --git a/packages/cp-gql-mock-server/src/resolvers.js b/packages/cp-gql-mock-server/src/resolvers.js index 473b1b86..c2be7af1 100644 --- a/packages/cp-gql-mock-server/src/resolvers.js +++ b/packages/cp-gql-mock-server/src/resolvers.js @@ -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)), diff --git a/packages/cp-gql-schema/schema.gql b/packages/cp-gql-schema/schema.gql index 27e326ec..e48742be 100644 --- a/packages/cp-gql-schema/schema.gql +++ b/packages/cp-gql-schema/schema.gql @@ -230,4 +230,5 @@ type Mutation { restartInstances(ids: [ID]!): [Instance] importDeploymentGroup(deploymentGroupSlug: String!): DeploymentGroup + deleteDeploymentGroup(id: ID!): DeploymentGroup } diff --git a/packages/ui-toolkit/src/basealign/index.js b/packages/ui-toolkit/src/basealign/index.js index 92612f72..8faab83d 100644 --- a/packages/ui-toolkit/src/basealign/index.js +++ b/packages/ui-toolkit/src/basealign/index.js @@ -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}`; diff --git a/packages/ui-toolkit/src/icon-button/index.js b/packages/ui-toolkit/src/icon-button/index.js index c660bcef..102a3961 100644 --- a/packages/ui-toolkit/src/icon-button/index.js +++ b/packages/ui-toolkit/src/icon-button/index.js @@ -110,13 +110,6 @@ const IconButton = props => { ); }; -/* ({ children, ...rest }) => - - - {children} - - ; */ - IconButton.propTypes = { children: PropTypes.node, onClick: PropTypes.func diff --git a/yarn.lock b/yarn.lock index 1d5f3d29..12aafab3 100644 --- a/yarn.lock +++ b/yarn.lock @@ -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"