diff --git a/spikes/graphql/apollo-redux/package.json b/spikes/graphql/apollo-redux/package.json index 1bf4271f..d9df1e23 100644 --- a/spikes/graphql/apollo-redux/package.json +++ b/spikes/graphql/apollo-redux/package.json @@ -4,6 +4,7 @@ "private": true, "dependencies": { "apollo": "^0.2.2", + "immutability-helper": "^2.2.0", "react": "^15.5.4", "react-apollo": "^1.2.0", "react-dom": "^15.5.4", diff --git a/spikes/graphql/apollo-redux/src/containers/deployment-groups/index.js b/spikes/graphql/apollo-redux/src/containers/deployment-groups/index.js new file mode 100644 index 00000000..b56566c6 --- /dev/null +++ b/spikes/graphql/apollo-redux/src/containers/deployment-groups/index.js @@ -0,0 +1 @@ +export { default as DeploymentGroupList } from './list'; diff --git a/spikes/graphql/apollo-redux/src/containers/deployment-groups/list.js b/spikes/graphql/apollo-redux/src/containers/deployment-groups/list.js new file mode 100644 index 00000000..e3f7750a --- /dev/null +++ b/spikes/graphql/apollo-redux/src/containers/deployment-groups/list.js @@ -0,0 +1,59 @@ +import React, { Component } from 'react'; +import { gql, graphql } from 'react-apollo'; +import { Link } from 'react-router-dom'; +import update from 'immutability-helper'; + +class DeploymentGroupList extends Component { + + render() { + + const { + location, + deploymentGroups, + loading, + error + } = this.props; + + const deploymentGroupList = + loading ?

Loading...

: + error ?

Error!!!

: + deploymentGroups.map((deploymentGroup, index) => { + return ( +

+ + {deploymentGroup.name} + +

)}); + + return ( +
+
+

Deployment Group List

+
+ { deploymentGroupList } +
+ ); + } +} + +const deploymentGroups = gql` + query { + deploymentGroups { + uuid + name + id + } + } +`; + +const DeploymentGroupListWithData = graphql(deploymentGroups, { + props: ({ data: { deploymentGroups, loading, error }}) => ({ + deploymentGroups, + loading, + error + }) +})(DeploymentGroupList); + +export default DeploymentGroupListWithData; diff --git a/spikes/graphql/apollo-redux/src/containers/instances/list.js b/spikes/graphql/apollo-redux/src/containers/instances/list.js index a6a3313c..f6c27441 100644 --- a/spikes/graphql/apollo-redux/src/containers/instances/list.js +++ b/spikes/graphql/apollo-redux/src/containers/instances/list.js @@ -5,8 +5,6 @@ class InstanceList extends Component { render() { - console.log('this.props = ', this.props); - const { instances, loading, @@ -31,8 +29,8 @@ class InstanceList extends Component { } const instances = gql` - query Instances($deploymentGroupUuid: String!){ - deploymentGroup(uuid: $deploymentGroupUuid) { + query Instances($deploymentGroupId: String!){ + deploymentGroup(id: $deploymentGroupId) { services { instances { uuid @@ -47,7 +45,7 @@ const InstanceListWithData = graphql(instances, { options(props) { return { variables: { - deploymentGroupUuid: props.match.params.project + deploymentGroupId: props.match.params.deploymentGroup } }; }, diff --git a/spikes/graphql/apollo-redux/src/containers/projects/index.js b/spikes/graphql/apollo-redux/src/containers/projects/index.js deleted file mode 100644 index 41103596..00000000 --- a/spikes/graphql/apollo-redux/src/containers/projects/index.js +++ /dev/null @@ -1 +0,0 @@ -export { default as ProjectList } from './list'; diff --git a/spikes/graphql/apollo-redux/src/containers/projects/list.js b/spikes/graphql/apollo-redux/src/containers/projects/list.js deleted file mode 100644 index bfcffe01..00000000 --- a/spikes/graphql/apollo-redux/src/containers/projects/list.js +++ /dev/null @@ -1,56 +0,0 @@ -import React, { Component } from 'react'; -import { gql, graphql } from 'react-apollo'; -import { Link } from 'react-router-dom'; - -class ProjectList extends Component { - - render() { - - const { - location, - deploymentGroups, - loading, - error - } = this.props; - - const projectList = - loading ?

Loading...

: - error ?

Error!!!

: - deploymentGroups.map((deploymentGroup, index) => -

- - {deploymentGroup.name} - -

); - - return ( -
-
-

Project List

-
- { projectList } -
- ); - } -} - -const projects = gql` - query { - deploymentGroups { - uuid - name - } - } -`; - -const ProjectListWithData = graphql(projects, { - props: ({ data: deploymentGroups, loading, error }) => ({ - deploymentGroups, - loading, - error - }) -})(ProjectList) - -export default ProjectListWithData; diff --git a/spikes/graphql/apollo-redux/src/containers/services/list.js b/spikes/graphql/apollo-redux/src/containers/services/list.js index d8282e66..baba6291 100644 --- a/spikes/graphql/apollo-redux/src/containers/services/list.js +++ b/spikes/graphql/apollo-redux/src/containers/services/list.js @@ -19,7 +19,7 @@ class ServiceList extends Component { services.map((service, index) =>

{service.name} @@ -37,11 +37,12 @@ class ServiceList extends Component { } const services = gql` - query Services($deploymentGroupUuid: String!){ - deploymentGroup(uuid: $deploymentGroupUuid) { + query Services($deploymentGroupId: String!){ + deploymentGroup(id: $deploymentGroupId) { services { uuid name + id } } } @@ -51,15 +52,15 @@ const ServiceListWithData = graphql(services, { options(props) { return { variables: { - deploymentGroupUuid: props.match.params.project + deploymentGroupId: props.match.params.deploymentGroup } - }; + } }, - props: ({ data: { deploymentGroup, loading, error } }) => ({ + props: ({ data: { deploymentGroup, loading, error }}) => ({ services: deploymentGroup ? deploymentGroup.services : null, loading, error }) -})(ServiceList) +})(ServiceList); export default ServiceListWithData; diff --git a/spikes/graphql/apollo-redux/src/containers/services/list.js-bak b/spikes/graphql/apollo-redux/src/containers/services/list.js-bak deleted file mode 100644 index 58e6df0c..00000000 --- a/spikes/graphql/apollo-redux/src/containers/services/list.js-bak +++ /dev/null @@ -1,58 +0,0 @@ -import React, { Component } from 'react'; -import { gql, graphql } from 'react-apollo'; - -class ServiceList extends Component { - - render() { - - const { - data, - location - } = this.props; - - const { - services, - loading, - error - } = data; - - const serviceList = - loading ?

Loading...

: - error ?

Error!!!

: - services.map((service, index) => -

{service.name}

); - - return ( -
-
-

Service List

-
- { serviceList } -
- ); - } -} - -const services = gql` - query Services($deploymentGroupUuid: String!){ - services(deploymentGroupUuid: $deploymentGroupUuid) { - uuid - name - } - } -`; - -const ServiceListWithData = graphql(services, { - options(props) { - return { - variables: { - deploymentGroupUuid: props.match.params.project - } - }; - }, - props: ({ data }) => ({ - data - }) -})(ServiceList) - -export default ServiceListWithData; diff --git a/spikes/graphql/apollo-redux/src/routing/routes.js b/spikes/graphql/apollo-redux/src/routing/routes.js index 4ab17471..9b478441 100644 --- a/spikes/graphql/apollo-redux/src/routing/routes.js +++ b/spikes/graphql/apollo-redux/src/routing/routes.js @@ -7,15 +7,15 @@ import { } from 'react-router-dom'; import { Container } from '../components/layout'; -import { ProjectList } from '../containers/projects'; +import { DeploymentGroupList } from '../containers/deployment-groups'; import { ServiceList } from '../containers/services'; import { InstanceList } from '../containers/instances'; const rootRedirect = (p) => ( - + ); -const projectRedirect = (p) => ( +const deploymentGroupRedirect = (p) => ( ); @@ -24,13 +24,13 @@ const Router = ( - + - - + + + + - - ); diff --git a/spikes/graphql/apollo-redux/yarn.lock b/spikes/graphql/apollo-redux/yarn.lock index bd9ac833..7db99ba1 100644 --- a/spikes/graphql/apollo-redux/yarn.lock +++ b/spikes/graphql/apollo-redux/yarn.lock @@ -2585,6 +2585,12 @@ ignore@^3.2.0: version "3.3.0" resolved "https://registry.yarnpkg.com/ignore/-/ignore-3.3.0.tgz#3812d22cbe9125f2c2b4915755a1b8abd745a001" +immutability-helper@^2.2.0: + version "2.2.0" + resolved "https://registry.yarnpkg.com/immutability-helper/-/immutability-helper-2.2.0.tgz#c4385ad4f68315843efaf0cff3575ee82ffa405f" + dependencies: + invariant "^2.2.0" + imurmurhash@^0.1.4: version "0.1.4" resolved "https://registry.yarnpkg.com/imurmurhash/-/imurmurhash-0.1.4.tgz#9218b9b2b928a238b13dc4fb6b6d576f231453ea" diff --git a/spikes/graphql/graphql-server/package.json b/spikes/graphql/graphql-server/package.json index 75ad00e4..ac5a3484 100644 --- a/spikes/graphql/graphql-server/package.json +++ b/spikes/graphql/graphql-server/package.json @@ -17,6 +17,7 @@ "graphql-tools": "^0.11.0", "hapi": "^16.1.1", "lodash": "^4.17.4", - "nodemon": "^1.11.0" + "nodemon": "^1.11.0", + "param-case": "^2.1.1" } } diff --git a/spikes/graphql/graphql-server/src/resolvers.js b/spikes/graphql/graphql-server/src/resolvers.js index 78a3d3b1..4f7e98e0 100644 --- a/spikes/graphql/graphql-server/src/resolvers.js +++ b/spikes/graphql/graphql-server/src/resolvers.js @@ -1,4 +1,5 @@ import { find, filter } from 'lodash'; +import paramCase from 'param-case'; import data from './mock-data'; const portal = { username: 'juditgreskovits', host: 'dockerhost'}; @@ -16,19 +17,48 @@ const resolveFunctions = { deploymentGroups() { return deploymentGroups; }, - deploymentGroup(_, { uuid }) { - return find(deploymentGroups, { uuid: uuid }); + deploymentGroup(_, { uuid, id }) { + if(uuid) { + return find(deploymentGroups, { uuid: uuid }); + } + if(id) { + return find(deploymentGroups, { id: id }); + } + return null; }, - services(_, { deploymentGroupUuid=null }) { + services(_, { deploymentGroupUuid=null, deploymentGroupId=null }) { if(deploymentGroupUuid) { - return filter(services, { project: deploymentGroupUuid }) + return filter(services, { project: deploymentGroupUuid }); + } + if(deploymentGroupId) { + const deploymentGroup = find(deploymentGroups, { id: deploymentGroupId }); + if(deploymentGroup) { + return filter(services, { project: deploymentGroup.uuid }); + } + return null; } return services; }, - service(_, { uuid }) { - return find(services, { uuid: uuid }); + service(_, { uuid, id }) { + if(uuid) { + return find(services, { uuid: uuid }); + } + if(id) { + return find(services, { id: id }); + } + return null; }, - instances() { + instances(_, { serviceUuid=null, serviceId=null }) { + if(serviceUuid) { + return filter(instances, { service: serviceUuid }); + } + if(serviceId) { + const service = find(services, { id: serviceId }); + if(service) { + return filter(instances, { service: service.uuid }); + } + return null; + } return instances; }, metricTypes() { @@ -41,7 +71,7 @@ const resolveFunctions = { DeploymentGroup: { services(deploymentGroup) { return filter(services, { project: deploymentGroup.uuid }) - } + }, }, Service: { instances(service) { @@ -51,7 +81,7 @@ const resolveFunctions = { return service.metrics ? service.metrics.map((metric) => find(metricTypes, { uuid: metric.type })) : [] - } + }, }, }; diff --git a/spikes/graphql/graphql-server/src/schema.js b/spikes/graphql/graphql-server/src/schema.js index 6a13849b..7f2829dd 100644 --- a/spikes/graphql/graphql-server/src/schema.js +++ b/spikes/graphql/graphql-server/src/schema.js @@ -20,6 +20,7 @@ type Version { type DeploymentGroup { uuid: String! name: String! + id: String! datacenter: Datacenter! services: [Service]! state: DeploymentState @@ -47,6 +48,7 @@ type Service { deploymentGoup: String! version: Version! name: String! + id: String! instances: [Instance]! metrics: [MetricType]! package: Package! # we don't have this in current mock data @@ -100,11 +102,11 @@ type Datacenter { type Query { portal: Portal deploymentGroups: [DeploymentGroup] - deploymentGroup(uuid: String!): DeploymentGroup - services(deploymentGroupUuid: String): [Service] - service(uuid: String!): Service - instances: [Instance] - instance(uuid: String!): Instance + deploymentGroup(uuid: String, id: String): DeploymentGroup + services(deploymentGroupUuid: String, deploymentGroupId: String): [Service] + service(uuid: String, id: String): Service + instances(serviceUuid: String, serviceId: String): [Instance] + instance(uuid: String, id: String): Instance metricTypes: [MetricType] package: Package datacenters: [Datacenter] diff --git a/spikes/graphql/graphql-server/yarn.lock b/spikes/graphql/graphql-server/yarn.lock index 7a1c63a2..6c713a54 100644 --- a/spikes/graphql/graphql-server/yarn.lock +++ b/spikes/graphql/graphql-server/yarn.lock @@ -1381,6 +1381,10 @@ loose-envify@^1.0.0: dependencies: js-tokens "^3.0.0" +lower-case@^1.1.1: + version "1.1.4" + resolved "https://registry.yarnpkg.com/lower-case/-/lower-case-1.1.4.tgz#9a2cabd1b9e8e0ae993a4bf7d5875c39c42e8eac" + lowercase-keys@^1.0.0: version "1.0.0" resolved "https://registry.yarnpkg.com/lowercase-keys/-/lowercase-keys-1.0.0.tgz#4e3366b39e7f5457e35f1324bdf6f88d0bfc7306" @@ -1465,6 +1469,12 @@ nigel@2.x.x: hoek "4.x.x" vise "2.x.x" +no-case@^2.2.0: + version "2.3.1" + resolved "https://registry.yarnpkg.com/no-case/-/no-case-2.3.1.tgz#7aeba1c73a52184265554b7dc03baf720df80081" + dependencies: + lower-case "^1.1.1" + node-pre-gyp@^0.6.29: version "0.6.34" resolved "https://registry.yarnpkg.com/node-pre-gyp/-/node-pre-gyp-0.6.34.tgz#94ad1c798a11d7fc67381b50d47f8cc18d9799f7" @@ -1587,6 +1597,12 @@ package-json@^1.0.0: got "^3.2.0" registry-url "^3.0.0" +param-case@^2.1.1: + version "2.1.1" + resolved "https://registry.yarnpkg.com/param-case/-/param-case-2.1.1.tgz#df94fd8cf6531ecf75e6bef9a0858fbc72be2247" + dependencies: + no-case "^2.2.0" + parse-glob@^3.0.4: version "3.0.4" resolved "https://registry.yarnpkg.com/parse-glob/-/parse-glob-3.0.4.tgz#b2c376cfb11f35513badd173ef0bb6e3a388391c"