Generate and add complex services data for topology

This commit is contained in:
JUDIT GRESKOVITS 2017-03-30 15:16:36 +01:00 committed by Judit Greskovits
parent 1d8f4c7e9a
commit 0127f76a7d
6 changed files with 1428 additions and 151 deletions

View File

@ -2,10 +2,9 @@ import React from 'react';
import { connect } from 'react-redux'; import { connect } from 'react-redux';
import styled from 'styled-components'; import styled from 'styled-components';
import PropTypes from '@root/prop-types'; import PropTypes from '@root/prop-types';
import { colors, breakpoints } from '@ui/shared/constants'; import { colors } from '@ui/shared/constants';
import { unitcalc } from '@ui/shared/functions'; import { unitcalc } from '@ui/shared/functions';
import { TopologyGraph } from '@ui/components/topology'; import { TopologyGraph } from '@ui/components/topology';
import { LayoutContainer } from '@components/layout';
import ServicesTooltip from '@components/services/tooltip'; import ServicesTooltip from '@components/services/tooltip';
import { toggleTooltip } from '@state/actions'; import { toggleTooltip } from '@state/actions';
@ -21,13 +20,9 @@ const StyledBackground = styled.div`
background-color: ${colors.base.whiteActive}; background-color: ${colors.base.whiteActive};
`; `;
const StyledContainer = styled(LayoutContainer)` const StyledContainer = styled.div`
position: relative; position: relative;
padding: ${unitcalc(4)} 2rem; padding: ${unitcalc(4)};
${breakpoints.large`
padding: ${unitcalc(4)} 0;
`}
`; `;
const Services = (props) => { const Services = (props) => {

File diff suppressed because it is too large Load Diff

View File

@ -0,0 +1,140 @@
/*eslint-disable */
export const wpServices = [{
"uuid": "081a792c-47e0-4439-924b-2efa9788ae9e",
"id": "nginx",
"name": "Nginx",
"project": "e0ea0c02-55cc-45fe-8064-3e5176a59401",
"instances": 1,
"metrics": [{
"type": "2aaa237d-42b3-442f-9094-a17aa470014b",
"dataset": "3e6ee79a-7453-4fc6-b9da-7ae1e41138ec"
}, {
"type": "dca08514-72e5-46ce-ad91-e68b3b0914d9",
"dataset": "4e6ee79a-7453-4fc6-b9da-7ae1e41138ed"
}, {
"type": "dca08514-72e5-46ce-ad92-e68b3b0914d4",
"dataset": "6e6ee79a-7453-4fc6-b9da-7ae1e41138ed"
}],
"connections": [
"be227788-74f1-4e5b-a85f-b5c71cbae8d8"
]
}, {
"uuid": "be227788-74f1-4e5b-a85f-b5c71cbae8d8",
"id": "wordpress",
"name": "Wordpress",
"project": "e0ea0c02-55cc-45fe-8064-3e5176a59401",
"instances": 1,
"metrics": [{
"type": "2aaa237d-42b3-442f-9094-a17aa470014b",
"dataset": "crazy-cpu"
}, {
"type": "dca08514-72e5-46ce-ad91-e68b3b0914d9",
"dataset": "crazy-disk"
}, {
"type": "dca08514-72e5-46ce-ad92-e68b3b0914d4",
"dataset": "crazy-memory"
}],
"connections": [
"6a0eee76-c019-413b-9d5f-44712b55b993",
"6d31aff4-de1e-4042-a983-fbd23d5c530c",
"4ee4103e-1a52-4099-a48e-01588f597c70"
]
}, {
"uuid": "6a0eee76-c019-413b-9d5f-44712b55b993",
"id": "nfs",
"name": "NFS",
"project": "e0ea0c02-55cc-45fe-8064-3e5176a59401",
"instances": 1,
"metrics": [{
"type": "2aaa237d-42b3-442f-9094-a17aa470014b",
"dataset": "3e6ee79a-7453-4fc6-b9da-7ae1e41138ec"
}, {
"type": "dca08514-72e5-46ce-ad91-e68b3b0914d9",
"dataset": "4e6ee79a-7453-4fc6-b9da-7ae1e41138ed"
}, {
"type": "dca08514-72e5-46ce-ad92-e68b3b0914d4",
"dataset": "6e6ee79a-7453-4fc6-b9da-7ae1e41138ed"
}]
}, {
"uuid": "6d31aff4-de1e-4042-a983-fbd23d5c530c",
"id": "memcached",
"name": "Memcached",
"project": "e0ea0c02-55cc-45fe-8064-3e5176a59401",
"instances": 5,
"metrics": [{
"type": "2aaa237d-42b3-442f-9094-a17aa470014b",
"dataset": "3e6ee79a-7453-4fc6-b9da-7ae1e41138ec"
}, {
"type": "dca08514-72e5-46ce-ad91-e68b3b0914d9",
"dataset": "4e6ee79a-7453-4fc6-b9da-7ae1e41138ed"
}, {
"type": "dca08514-72e5-46ce-ad92-e68b3b0914d4",
"dataset": "6e6ee79a-7453-4fc6-b9da-7ae1e41138ed"
}]
}, {
"uuid": "4ee4103e-1a52-4099-a48e-01588f597c70",
"id": "percona",
"name": "Percona",
"project": "e0ea0c02-55cc-45fe-8064-3e5176a59401",
"instances": 5,
"metrics": [{
"type": "2aaa237d-42b3-442f-9094-a17aa470014b",
"dataset": "3e6ee79a-7453-4fc6-b9da-7ae1e41138ec"
}, {
"type": "dca08514-72e5-46ce-ad91-e68b3b0914d9",
"dataset": "4e6ee79a-7453-4fc6-b9da-7ae1e41138ed"
}, {
"type": "dca08514-72e5-46ce-ad92-e68b3b0914d4",
"dataset": "6e6ee79a-7453-4fc6-b9da-7ae1e41138ed"
}]
}, {
"uuid": "9572d367-c4ae-4fb1-8ad5-f5e3830e7034",
"id": "primary",
"name": "Primary",
"parent": "4ee4103e-1a52-4099-a48e-01588f597c70",
"project": "e0ea0c02-55cc-45fe-8064-3e5176a59401",
"instances": 1,
"metrics": [{
"type": "2aaa237d-42b3-442f-9094-a17aa470014b",
"dataset": "3e6ee79a-7453-4fc6-b9da-7ae1e41138ec"
}, {
"type": "dca08514-72e5-46ce-ad91-e68b3b0914d9",
"dataset": "4e6ee79a-7453-4fc6-b9da-7ae1e41138ed"
}, {
"type": "dca08514-72e5-46ce-ad92-e68b3b0914d4",
"dataset": "6e6ee79a-7453-4fc6-b9da-7ae1e41138ed"
}]
}, {
"uuid": "c8411ef0-ab39-42cb-a704-d20b170eff31",
"id": "secondaries",
"name": "Secondaries",
"parent": "4ee4103e-1a52-4099-a48e-01588f597c70",
"project": "e0ea0c02-55cc-45fe-8064-3e5176a59401",
"instances": 4,
"metrics": [{
"type": "2aaa237d-42b3-442f-9094-a17aa470014b",
"dataset": "3e6ee79a-7453-4fc6-b9da-7ae1e41138ec"
}, {
"type": "dca08514-72e5-46ce-ad91-e68b3b0914d9",
"dataset": "4e6ee79a-7453-4fc6-b9da-7ae1e41138ed"
}, {
"type": "dca08514-72e5-46ce-ad92-e68b3b0914d4",
"dataset": "6e6ee79a-7453-4fc6-b9da-7ae1e41138ed"
}]
}, {
"uuid": "97c68055-db88-45c9-ad49-f26da4264777",
"id": "consul",
"name": "Consul",
"project": "e0ea0c02-55cc-45fe-8064-3e5176a59401",
"instances": 1,
"metrics": [{
"type": "2aaa237d-42b3-442f-9094-a17aa470014b",
"dataset": "3e6ee79a-7453-4fc6-b9da-7ae1e41138ec"
}, {
"type": "dca08514-72e5-46ce-ad91-e68b3b0914d9",
"dataset": "4e6ee79a-7453-4fc6-b9da-7ae1e41138ed"
}, {
"type": "dca08514-72e5-46ce-ad92-e68b3b0914d4",
"dataset": "6e6ee79a-7453-4fc6-b9da-7ae1e41138ed"
}]
}];

View File

@ -1,4 +1,8 @@
/*eslint-disable */ /*eslint-disable */
import { complexServices } from './services-complex';
import { wpServices } from './services-wp';
export const services = { export const services = {
"ui": { "ui": {
"collapsed": [], "collapsed": [],
@ -16,143 +20,5 @@ export const services = {
"show": false "show": false
} }
}, },
"data": [{ "data": wpServices.concat(complexServices)
"uuid": "081a792c-47e0-4439-924b-2efa9788ae9e", }
"id": "nginx",
"name": "Nginx",
"project": "e0ea0c02-55cc-45fe-8064-3e5176a59401",
"instances": 1,
"metrics": [{
"type": "2aaa237d-42b3-442f-9094-a17aa470014b",
"dataset": "3e6ee79a-7453-4fc6-b9da-7ae1e41138ec"
}, {
"type": "dca08514-72e5-46ce-ad91-e68b3b0914d9",
"dataset": "4e6ee79a-7453-4fc6-b9da-7ae1e41138ed"
}, {
"type": "dca08514-72e5-46ce-ad92-e68b3b0914d4",
"dataset": "6e6ee79a-7453-4fc6-b9da-7ae1e41138ed"
}],
"connections": [
"be227788-74f1-4e5b-a85f-b5c71cbae8d8"
]
}, {
"uuid": "be227788-74f1-4e5b-a85f-b5c71cbae8d8",
"id": "wordpress",
"name": "Wordpress",
"project": "e0ea0c02-55cc-45fe-8064-3e5176a59401",
"instances": 1,
"metrics": [{
"type": "2aaa237d-42b3-442f-9094-a17aa470014b",
"dataset": "crazy-cpu"
}, {
"type": "dca08514-72e5-46ce-ad91-e68b3b0914d9",
"dataset": "crazy-disk"
}, {
"type": "dca08514-72e5-46ce-ad92-e68b3b0914d4",
"dataset": "crazy-memory"
}],
"connections": [
"6a0eee76-c019-413b-9d5f-44712b55b993",
"6d31aff4-de1e-4042-a983-fbd23d5c530c",
"4ee4103e-1a52-4099-a48e-01588f597c70"
]
}, {
"uuid": "6a0eee76-c019-413b-9d5f-44712b55b993",
"id": "nfs",
"name": "NFS",
"project": "e0ea0c02-55cc-45fe-8064-3e5176a59401",
"instances": 1,
"metrics": [{
"type": "2aaa237d-42b3-442f-9094-a17aa470014b",
"dataset": "3e6ee79a-7453-4fc6-b9da-7ae1e41138ec"
}, {
"type": "dca08514-72e5-46ce-ad91-e68b3b0914d9",
"dataset": "4e6ee79a-7453-4fc6-b9da-7ae1e41138ed"
}, {
"type": "dca08514-72e5-46ce-ad92-e68b3b0914d4",
"dataset": "6e6ee79a-7453-4fc6-b9da-7ae1e41138ed"
}]
}, {
"uuid": "6d31aff4-de1e-4042-a983-fbd23d5c530c",
"id": "memcached",
"name": "Memcached",
"project": "e0ea0c02-55cc-45fe-8064-3e5176a59401",
"instances": 5,
"metrics": [{
"type": "2aaa237d-42b3-442f-9094-a17aa470014b",
"dataset": "3e6ee79a-7453-4fc6-b9da-7ae1e41138ec"
}, {
"type": "dca08514-72e5-46ce-ad91-e68b3b0914d9",
"dataset": "4e6ee79a-7453-4fc6-b9da-7ae1e41138ed"
}, {
"type": "dca08514-72e5-46ce-ad92-e68b3b0914d4",
"dataset": "6e6ee79a-7453-4fc6-b9da-7ae1e41138ed"
}]
}, {
"uuid": "4ee4103e-1a52-4099-a48e-01588f597c70",
"id": "percona",
"name": "Percona",
"project": "e0ea0c02-55cc-45fe-8064-3e5176a59401",
"instances": 5,
"metrics": [{
"type": "2aaa237d-42b3-442f-9094-a17aa470014b",
"dataset": "3e6ee79a-7453-4fc6-b9da-7ae1e41138ec"
}, {
"type": "dca08514-72e5-46ce-ad91-e68b3b0914d9",
"dataset": "4e6ee79a-7453-4fc6-b9da-7ae1e41138ed"
}, {
"type": "dca08514-72e5-46ce-ad92-e68b3b0914d4",
"dataset": "6e6ee79a-7453-4fc6-b9da-7ae1e41138ed"
}]
}, {
"uuid": "9572d367-c4ae-4fb1-8ad5-f5e3830e7034",
"id": "primary",
"name": "Primary",
"parent": "4ee4103e-1a52-4099-a48e-01588f597c70",
"project": "e0ea0c02-55cc-45fe-8064-3e5176a59401",
"instances": 1,
"metrics": [{
"type": "2aaa237d-42b3-442f-9094-a17aa470014b",
"dataset": "3e6ee79a-7453-4fc6-b9da-7ae1e41138ec"
}, {
"type": "dca08514-72e5-46ce-ad91-e68b3b0914d9",
"dataset": "4e6ee79a-7453-4fc6-b9da-7ae1e41138ed"
}, {
"type": "dca08514-72e5-46ce-ad92-e68b3b0914d4",
"dataset": "6e6ee79a-7453-4fc6-b9da-7ae1e41138ed"
}]
}, {
"uuid": "c8411ef0-ab39-42cb-a704-d20b170eff31",
"id": "secondaries",
"name": "Secondaries",
"parent": "4ee4103e-1a52-4099-a48e-01588f597c70",
"project": "e0ea0c02-55cc-45fe-8064-3e5176a59401",
"instances": 4,
"metrics": [{
"type": "2aaa237d-42b3-442f-9094-a17aa470014b",
"dataset": "3e6ee79a-7453-4fc6-b9da-7ae1e41138ec"
}, {
"type": "dca08514-72e5-46ce-ad91-e68b3b0914d9",
"dataset": "4e6ee79a-7453-4fc6-b9da-7ae1e41138ed"
}, {
"type": "dca08514-72e5-46ce-ad92-e68b3b0914d4",
"dataset": "6e6ee79a-7453-4fc6-b9da-7ae1e41138ed"
}]
}, {
"uuid": "97c68055-db88-45c9-ad49-f26da4264777",
"id": "consul",
"name": "Consul",
"project": "e0ea0c02-55cc-45fe-8064-3e5176a59401",
"instances": 1,
"metrics": [{
"type": "2aaa237d-42b3-442f-9094-a17aa470014b",
"dataset": "3e6ee79a-7453-4fc6-b9da-7ae1e41138ec"
}, {
"type": "dca08514-72e5-46ce-ad91-e68b3b0914d9",
"dataset": "4e6ee79a-7453-4fc6-b9da-7ae1e41138ed"
}, {
"type": "dca08514-72e5-46ce-ad92-e68b3b0914d4",
"dataset": "6e6ee79a-7453-4fc6-b9da-7ae1e41138ed"
}]
}]
}

View File

@ -0,0 +1,144 @@
// Please feel free to either duplicate this
// ...or make it more dynamic to suit your purposes :)
const primaryList = `Consul
Nginx
MongoDB`;
const list = `AccountService
AddressService
BloomreachService
CartService
Extra service reported by ContainerPilot: CartService-HTTPS
CCTokenizationClientService
CheckoutService
ColorSwatchService
EmailMarketingService
FavoriteService
FindInStoreService
FitpredictorService
HidefromcatalogService
InternationalCheckoutService
InternationalPOService
InternationalShippingService
InventoryService
LocalizationService
MoreAccountService
NavigationService
OrderCreationJob
OrderService
OrderService
PaymentMethodService
PaymentService
PaymentService
PriceService
PrivatesaleService
ProductArrayService
ProductDetailService
ProductService
ProfileService
PromoService
PromotionService
QuestionanswerService
RedBaloonService
Extra service reported by ContainerPilot: RedBaloonService-HTTPS
ReviewsService
SearchFacetsService
SearchIndexService
ShopRunnerService
TaxService
ToggleService
UserAccountService
UserAuthenticationService
WaitlistOverlayService
WaitlistService`;
const primaryServices = primaryList.split('\n');
const servicesList = list.split('\n');
/*
{
"uuid": "be227788-74f1-4e5b-a85f-b5c71cbae8d8",
"id": "wordpress",
"name": "Wordpress",
"project": "e0ea0c02-55cc-45fe-8064-3e5176a59401",
"instances": 1,
"metrics": [{
"type": "2aaa237d-42b3-442f-9094-a17aa470014b",
"dataset": "crazy-cpu"
}, {
"type": "dca08514-72e5-46ce-ad91-e68b3b0914d9",
"dataset": "crazy-disk"
}, {
"type": "dca08514-72e5-46ce-ad92-e68b3b0914d4",
"dataset": "crazy-memory"
}],
"connections": [
"6a0eee76-c019-413b-9d5f-44712b55b993",
"6d31aff4-de1e-4042-a983-fbd23d5c530c",
"4ee4103e-1a52-4099-a48e-01588f597c70"
]
}
*/
const mappedServicesList = servicesList.map((service, index) => {
const uuid = Math.round(Math.random()*1000000);
const connections = index%5 ? null : ['primary-mongodb'];
const instances = 3 + Math.round(Math.random()*2);
const s = {
uuid: uuid,
id: service.toLowerCase(),
name: service,
instances: instances,
project: '9fcb374d-a267-4c2a-9d9c-ba469b804639',
'metrics': [{
"type": "2aaa237d-42b3-442f-9094-a17aa470014b",
"dataset": "crazy-cpu"
}, {
"type": "dca08514-72e5-46ce-ad91-e68b3b0914d9",
"dataset": "crazy-disk"
}, {
"type": "dca08514-72e5-46ce-ad92-e68b3b0914d4",
"dataset": "crazy-memory"
}]
};
if(connections) {
s.connections = connections;
}
return s;
});
const mappedPrimaryServicesList = primaryServices.map((service, index) => {
const uuid = `primary-${service.toLowerCase()}`;
const connections = uuid === 'primary-nginx' ?
mappedServicesList.map(s => s.uuid) : null;
const instances = uuid === 'primary-nginx' ? 1 : 3;
const s = {
uuid: uuid,
id: service.toLowerCase(),
name: service,
instances: instances,
project: '9fcb374d-a267-4c2a-9d9c-ba469b804639',
'metrics': [{
"type": "2aaa237d-42b3-442f-9094-a17aa470014b",
"dataset": "crazy-cpu"
}, {
"type": "dca08514-72e5-46ce-ad91-e68b3b0914d9",
"dataset": "crazy-disk"
}, {
"type": "dca08514-72e5-46ce-ad92-e68b3b0914d4",
"dataset": "crazy-memory"
}]
};
if(connections) {
s.connections = connections;
}
return s;
});
const meow = mappedPrimaryServicesList.concat(mappedServicesList);
console.log('meow = ', JSON.stringify(meow));

View File

@ -11,12 +11,12 @@ import React from 'react';
const StyledSvg = styled.svg` const StyledSvg = styled.svg`
width: 100%; width: 100%;
height: 860px; height: 1400px;
`; `;
const svgSize = { const svgSize = {
width: 1024, width: 2400,
height: 860 height: 1400
}; };
let dragInfo = { let dragInfo = {