diff --git a/frontend/src/components/breadcrumb/index.js b/frontend/src/components/breadcrumb/index.js index ed4ec978..e31055e9 100644 --- a/frontend/src/components/breadcrumb/index.js +++ b/frontend/src/components/breadcrumb/index.js @@ -20,6 +20,7 @@ const StyledDiv = styled.div` const BreadcrumbA = styled(NavLink)` text-decoration: none; + color: ${colors.base.primary}; `; const BreadcrumbSpan = styled.span` diff --git a/frontend/src/components/navigation/org.js b/frontend/src/components/navigation/org.js index e46821b3..fc4c4cf5 100644 --- a/frontend/src/components/navigation/org.js +++ b/frontend/src/components/navigation/org.js @@ -7,7 +7,7 @@ import Container from '@ui/components/container'; import NavLink from '@ui/components/nav-link'; import { colors } from '@ui/shared/constants'; import PropTypes from '@root/prop-types'; -import { orgsSelector } from '@state/selectors'; +import { orgsSelector, orgsUISelector } from '@state/selectors'; import { remcalc } from '@ui/shared/functions'; import { breakpoints } from '@ui/shared/constants'; import Tabs, { Tab } from '@ui/components/tabs'; @@ -58,7 +58,7 @@ const NavLi = styled(NavLink)` const StyledTabs = styled(Tabs)` padding-top: ${remcalc(12)}; - + ${breakpoints.smallOnly` display: inline-block; white-space: nowrap; @@ -70,7 +70,7 @@ const StyledContainer = styled(Container)` ${breakpoints.smallOnly` overflow: scroll; display: flex; - + `} `; @@ -96,7 +96,8 @@ const DumbTab = ({ ); const OrgNavigation = ({ - orgs = [] + orgs = [], + orgsUI }) => { const navLinks = orgs.map(({ id, @@ -129,11 +130,13 @@ const OrgNavigation = ({ ); }); - const manageTabs = () => ( + const manageTabs = () => orgsUI.hide_add_and_manage ? null : + ( Manage Tabs ({orgs.length}) ); - const addOrgTab = () => ( + const addOrgTab = () => orgsUI.hide_add_and_manage ? null : + ( +   Add organisation ); @@ -142,7 +145,6 @@ const OrgNavigation = ({ {navLinks} - @@ -152,7 +154,8 @@ const OrgNavigation = ({ }; OrgNavigation.propTypes = { - orgs: React.PropTypes.arrayOf(PropTypes.org) + orgs: React.PropTypes.arrayOf(PropTypes.org), + orgsUI: React.PropTypes.object }; DumbTab.propTypes = { @@ -160,7 +163,8 @@ DumbTab.propTypes = { }; const mapStateToProps = (state) => ({ - orgs: orgsSelector(state) + orgs: orgsSelector(state), + orgsUI: orgsUISelector(state) }); export default connect( diff --git a/frontend/src/components/service/item.js b/frontend/src/components/service/item.js index 26feeb56..ddb3769d 100644 --- a/frontend/src/components/service/item.js +++ b/frontend/src/components/service/item.js @@ -42,7 +42,7 @@ const ServiceItem = ({ service = {} }) => { const isChild = !!service.parent; - console.log('service = ', service); + const childs = forceArray(service.services).map((service) => ( { +const datasets = mockState.metrics.data.datasets.map((dataset, index) => { const keyIndex = index%2 ? 0 : 1; const key = Object.keys(twoHourLongDatasets)[keyIndex]; return { @@ -31,11 +36,11 @@ const datasets = MockState.metrics.data.datasets.map((dataset, index) => { }; }); -MockState.metrics.data.datasets = datasets; +mockState.metrics.data.datasets = datasets; // TMP - plug fake metric data - END ReactDOM.render( - + diff --git a/frontend/src/mock-state-testing.json b/frontend/src/mock-state-testing.json new file mode 100644 index 00000000..1c1646ec --- /dev/null +++ b/frontend/src/mock-state-testing.json @@ -0,0 +1,629 @@ +{ + "account": { + "data": { + "uuid": "b94033c1-3665-4c36-afab-d9c3d0b51c01", + "id": "nicola", + "name": "Nicola", + "email": "nicola@biztech.com", + "avatar": "/static/images/avatar.png" + }, + "ui": { + "profile_tooltip": false + } + }, + "datacenters": { + "data": [{ + "uuid": "f018da03-41c8-4619-a36a-ab8b706160cb", + "id": "us-east-1", + "location": "Virginia, United States" + }, { + "uuid": "c4bf6263-be98-4798-bff4-9043bbc6b4e0", + "id": "us-east-2", + "location": "Virginia, United States" + }, { + "uuid": "443750e4-a58f-4360-b956-ef84b1a9a8ad", + "id": "us-east-3", + "location": "Virginia, United States" + }, { + "uuid": "9f743fdb-9401-48ea-b19e-45fcd1fc6d21", + "id": "us-east-3b", + "location": "Virginia, United States" + }, { + "uuid": "79a3ef11-be0a-44f0-b1fd-8c335dea61f4", + "id": "us-sw-1", + "location": "Nevada, United States" + }, { + "uuid": "e69017d6-a4ce-4a0e-a7a3-993b426200fd", + "id": "us-west-1", + "location": "California, United States" + }, { + "uuid": "8d2eb6f8-27b3-4275-afab-1044cc75def1", + "id": "eu-ams-1", + "location": "Amsterdam, Netherlands" + }, { + "uuid": "4395136a-d623-4101-ab19-79f064d7a224", + "id": "eu-ams-1", + "location": "Amsterdam, Netherlands" + }] + }, + "monitors": { + "ui": { + "page": "create" + } + }, + "metrics": { + "ui": { + "pos": 0, + "durations": [ + "360", + "720", + "1440", + "2880" + ] + }, + "data": { + "types": [{ + "uuid": "2aaa237d-42b3-442f-9094-a17aa470014b", + "name": "Aggregated CPU usage", + "id": "cpu-agg-usage", + "min": 0, + "max": 100, + "measurement": "%" + }, { + "uuid": "dca08514-72e5-46ce-ad91-e68b3b0914d6", + "name": "Aggregated CPU usage", + "id": "cpu-wait-time", + "min": 0, + "max": 100, + "measurement": "%" + }, { + "uuid": "dca08514-72e5-46ce-ad91-e68b3b0914d7", + "name": "Aggregated CPU usage", + "id": "zfs-used", + "min": 1, + "max": 2, + "measurement": "kb" + }, { + "uuid": "dca08514-72e5-46ce-ad91-e68b3b0914d8", + "name": "Aggregated CPU usage", + "id": "zfs-available", + "min": 0, + "max": 100, + "measurement": "%" + }, { + "uuid": "dca08514-72e5-46ce-ad91-e68b3b0914d9", + "name": "Aggregated CPU usage", + "id": "load-average", + "min": 0, + "max": 20, + "measurement": "kb" + }, { + "uuid": "dca08514-72e5-46ce-ad92-e68b3b0914d4", + "name": "Aggregated CPU usage", + "id": "mem-agg-usage", + "min": 0, + "max": 100, + "measurement": "%" + }, { + "uuid": "dca08514-72e5-46ce-ad93-e68b3b0914d4", + "name": "Aggregated CPU usage", + "id": "mem-limit", + "min": 0, + "max": 100, + "measurement": "%" + }, { + "uuid": "dca08514-72e5-46ce-ad94-e68b3b0914d4", + "name": "Aggregated CPU usage", + "id": "mem-swap", + "min": 0, + "max": 100, + "measurement": "%" + }, { + "uuid": "dca08514-72e5-46ce-ad95-e68b3b0914d4", + "name": "Aggregated CPU usage", + "id": "mem-swap-limit", + "min": 0, + "max": 100, + "measurement": "%" + }, { + "uuid": "dca08514-72e5-46ce-ad96-e68b3b0914d4", + "name": "Aggregated CPU usage", + "id": "net-agg-packets-in", + "min": 0, + "max": 100, + "measurement": "%" + }, { + "uuid": "dca08514-72e5-46ce-ad97-e68b3b0914d4", + "name": "Aggregated CPU usage", + "id": "net-agg-packets-out", + "min": 0, + "max": 100, + "measurement": "%" + }, { + "uuid": "dca08514-72e5-47ce-ad91-e68b3b0914d4", + "name": "Aggregated CPU usage", + "id": "net-agg-bytes-in", + "min": 0, + "max": 100, + "measurement": "%" + }, { + "uuid": "dca08514-72e5-48ce-ad91-e68b3b0914d4", + "name": "Aggregated CPU usage", + "id": "net-agg-bytes-out", + "min": 0, + "max": 100, + "measurement": "%" + }, { + "uuid": "dca08514-72e5-49ce-ad91-e68b3b0914d4", + "name": "Aggregated CPU usage", + "id": "time-of-day", + "min": 0, + "max": 100, + "measurement": "%" + }], + "datasets": [{ + "type": "2aaa237d-42b3-442f-9094-a17aa470014b", + "uuid": "3e6ee79a-7453-4fc6-b9da-7ae1e41138ec", + "data": [] + },{ + "type": "dca08514-72e5-46ce-ad92-e68b3b0914d4", + "uuid": "4e6ee79a-7453-4fc6-b9da-7ae1e41138ed", + "data": [] + }] + } + }, + "orgs": { + "ui": { + "invite_toggled": false, + "member_status_tooltip": false, + "member_role_tooltip": false, + "hide_add_and_manage": true, + "sections": [ + "projects", + "people", + "settings" + ], + "members_status": [ + "Active", + "Inactive", + "Invitation Sent" + ], + "members_roles": [ + "Owner", + "Unassigned", + "Read Only" + ] + }, + "data": [{ + "hide": [ + "people" + ], + "owner": "b94033c1-3665-4c36-afab-d9c3d0b51c01", + "uuid": "e12ad7db-91b2-4154-83dd-40dcfc700dcc", + "id": "nicola", + "name": "Personal", + "image": "https://pbs.twimg.com/profile_images/641289584580493312/VBfsPlff_400x400.jpg", + "members": [] + }] + }, + "projects": { + "ui": { + "invite_toggled": false, + "member_status_tooltip": false, + "member_role_tooltip": false, + "sections": [ + "project-feed", + "services", + "instances", + "rollback", + "manifest", + "settings" + ], + "members_status": [ + "Active", + "Inactive", + "Invitation Sent" + ], + "members_roles": [ + "Owner", + "Unassigned", + "Read Only" + ] + }, + "data": [{ + "uuid": "e0ea0c02-55cc-45fe-8064-3e5176a59401", + "org": "e12ad7db-91b2-4154-83dd-40dcfc700dcc", + "id": "forest-foundation-dev", + "name": "Forest Foundation Dev", + "plan": "20.05$ per day", + "members": [{ + "uuid": "fd853d8f-e1dd-49b5-b7b3-ae9adfea1e2f", + "role": "Owner", + "status": "Active" + }, + { + "uuid": "6deddbaa-3b94-4373-8cf7-97129507a872", + "role": "Unassigned", + "status": "Sent invitation" + }] + }, { + "uuid": "9fcb374d-a267-4c2a-9d9c-ba469b804639", + "org": "e12ad7db-91b2-4154-83dd-40dcfc700dcc", + "id": "forest-foundation-testing", + "name": "Forest Foundation Testing", + "plan": "20.05$ per day", + "members": [] + }, { + "uuid": "ac2c2498-e865-4ee3-9e26-8c75a81cbe25", + "org": "e12ad7db-91b2-4154-83dd-40dcfc700dcc", + "id": "forest-foundation-production", + "name": "Forest Foundation Production", + "plan": "100.17$ per day", + "members": [] + }] + }, + "members": { + "data": [{ + "uuid": "b94033c1-3665-4c36-afab-d9c3d0b51c01" + }, { + "uuid": "fd853d8f-e1dd-49b5-b7b3-ae9adfea1e2f", + "id": "alex-windnett", + "name": "Alex Windnett", + "email": "alex.windnett@biztech.com" + }, { + "uuid": "4a248182-f4b5-499d-af5b-d436b70bb309", + "id": "alex-fraser", + "name": "Alex Fraser", + "email": "alex.fraser@biztech.com" + }, { + "uuid": "a9dfe7de-3938-4e30-93db-6e3b88b003ee", + "id": "alex-mcleod", + "name": "Alex McLeod", + "email": "alex.mcleod@biztech.com" + }, { + "uuid": "6deddbaa-3b94-4373-8cf7-97129507a872", + "id": "casey-jones", + "name": "Casey Jones", + "email": "caseyjones@biztech.com" + }] + }, + "services": { + "ui": { + "collapsed": [], + "sections": [ + "summary", + "instances", + "metrics", + "networks", + "tags-metadata", + "activity-feed", + "service-manifest", + "firewall" + ], + "tooltip": { + "show": false + } + }, + "data": [{ + "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-e68b3b0914d7", + "dataset": "4e6ee79a-7453-4fc6-b9da-7ae1e41138ed" + }, { + "type": "dca08514-72e5-46ce-ad92-e68b3b0914d4", + "dataset": "3e6ee79a-7453-4fc6-b9da-7ae1e41138ec" + }], + "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": "3e6ee79a-7453-4fc6-b9da-7ae1e41138ec" + }, { + "type": "dca08514-72e5-46ce-ad91-e68b3b0914d7", + "dataset": "4e6ee79a-7453-4fc6-b9da-7ae1e41138ed" + }, { + "type": "dca08514-72e5-46ce-ad92-e68b3b0914d4", + "dataset": "3e6ee79a-7453-4fc6-b9da-7ae1e41138ec" + }], + "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-e68b3b0914d7", + "dataset": "4e6ee79a-7453-4fc6-b9da-7ae1e41138ed" + }, { + "type": "dca08514-72e5-46ce-ad92-e68b3b0914d4", + "dataset": "3e6ee79a-7453-4fc6-b9da-7ae1e41138ec" + }] + }, { + "uuid": "6d31aff4-de1e-4042-a983-fbd23d5c530c", + "id": "memcached", + "name": "Memcached", + "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-e68b3b0914d7", + "dataset": "4e6ee79a-7453-4fc6-b9da-7ae1e41138ed" + }, { + "type": "dca08514-72e5-46ce-ad92-e68b3b0914d4", + "dataset": "3e6ee79a-7453-4fc6-b9da-7ae1e41138ec" + }] + }, { + "uuid": "4ee4103e-1a52-4099-a48e-01588f597c70", + "id": "percona", + "name": "Percona", + "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-e68b3b0914d7", + "dataset": "4e6ee79a-7453-4fc6-b9da-7ae1e41138ed" + }, { + "type": "dca08514-72e5-46ce-ad92-e68b3b0914d4", + "dataset": "3e6ee79a-7453-4fc6-b9da-7ae1e41138ec" + }] + }, { + "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-e68b3b0914d7", + "dataset": "4e6ee79a-7453-4fc6-b9da-7ae1e41138ed" + }, { + "type": "dca08514-72e5-46ce-ad92-e68b3b0914d4", + "dataset": "3e6ee79a-7453-4fc6-b9da-7ae1e41138ec" + }] + }, { + "uuid": "c8411ef0-ab39-42cb-a704-d20b170eff31", + "id": "secondaries", + "name": "Secondaries", + "parent": "4ee4103e-1a52-4099-a48e-01588f597c70", + "project": "e0ea0c02-55cc-45fe-8064-3e5176a59401", + "instances": 3, + "metrics": [{ + "type": "2aaa237d-42b3-442f-9094-a17aa470014b", + "dataset": "3e6ee79a-7453-4fc6-b9da-7ae1e41138ec" + }, { + "type": "dca08514-72e5-46ce-ad91-e68b3b0914d7", + "dataset": "4e6ee79a-7453-4fc6-b9da-7ae1e41138ed" + }, { + "type": "dca08514-72e5-46ce-ad92-e68b3b0914d4", + "dataset": "3e6ee79a-7453-4fc6-b9da-7ae1e41138ec" + }] + }, { + "uuid": "97c68055-db88-45c9-ad49-f26da4264777", + "id": "consul", + "name": "Consul", + "project": "e0ea0c02-55cc-45fe-8064-3e5176a59401", + "instances": 3, + "metrics": [{ + "type": "2aaa237d-42b3-442f-9094-a17aa470014b", + "dataset": "3e6ee79a-7453-4fc6-b9da-7ae1e41138ec" + }, { + "type": "dca08514-72e5-46ce-ad91-e68b3b0914d7", + "dataset": "4e6ee79a-7453-4fc6-b9da-7ae1e41138ed" + }, { + "type": "dca08514-72e5-46ce-ad92-e68b3b0914d4", + "dataset": "3e6ee79a-7453-4fc6-b9da-7ae1e41138ec" + }] + }] + }, + "instances": { + "ui": { + "collapsed": [] + }, + "data": [{ + "uuid": "309ecd9f-ac03-474b-aff7-4bd2e743296c", + "name": "wordpress_01", + "datacenter": "f018da03-41c8-4619-a36a-ab8b706160cb", + "service": "be227788-74f1-4e5b-a85f-b5c71cbae8d8", + "project": "e0ea0c02-55cc-45fe-8064-3e5176a59401", + "metrics": [{ + "type": "2aaa237d-42b3-442f-9094-a17aa470014b", + "dataset": "3e6ee79a-7453-4fc6-b9da-7ae1e41138ec" + }, { + "type": "dca08514-72e5-46ce-ad91-e68b3b0914d7", + "dataset": "4e6ee79a-7453-4fc6-b9da-7ae1e41138ed" + }, { + "type": "dca08514-72e5-46ce-ad92-e68b3b0914d4", + "dataset": "3e6ee79a-7453-4fc6-b9da-7ae1e41138ec" + }] + }, { + "uuid": "0db6db53-de6f-4378-839e-5d5b452fbaf2", + "name": "nfs_01", + "datacenter": "f018da03-41c8-4619-a36a-ab8b706160cb", + "service": "6a0eee76-c019-413b-9d5f-44712b55b993", + "project": "e0ea0c02-55cc-45fe-8064-3e5176a59401", + "metrics": [{ + "type": "2aaa237d-42b3-442f-9094-a17aa470014b", + "dataset": "3e6ee79a-7453-4fc6-b9da-7ae1e41138ec" + }, { + "type": "dca08514-72e5-46ce-ad91-e68b3b0914d7", + "dataset": "4e6ee79a-7453-4fc6-b9da-7ae1e41138ed" + }, { + "type": "dca08514-72e5-46ce-ad92-e68b3b0914d4", + "dataset": "3e6ee79a-7453-4fc6-b9da-7ae1e41138ec" + }] + }, { + "uuid": "250c8a6c-7d02-49a9-8abd-e1c22773041d", + "name": "consul", + "datacenter": "f018da03-41c8-4619-a36a-ab8b706160cb", + "service": "97c68055-db88-45c9-ad49-f26da4264777", + "project": "e0ea0c02-55cc-45fe-8064-3e5176a59401", + "metrics": [{ + "type": "2aaa237d-42b3-442f-9094-a17aa470014b", + "dataset": "3e6ee79a-7453-4fc6-b9da-7ae1e41138ec" + }, { + "type": "dca08514-72e5-46ce-ad91-e68b3b0914d7", + "dataset": "4e6ee79a-7453-4fc6-b9da-7ae1e41138ed" + }, { + "type": "dca08514-72e5-46ce-ad92-e68b3b0914d4", + "dataset": "3e6ee79a-7453-4fc6-b9da-7ae1e41138ec" + }] + }, { + "uuid": "2c921f3a-8bc3-4f57-9cd7-789ebae72061", + "name": "memcache_01", + "datacenter": "f018da03-41c8-4619-a36a-ab8b706160cb", + "service": "6d31aff4-de1e-4042-a983-fbd23d5c530c", + "project": "e0ea0c02-55cc-45fe-8064-3e5176a59401", + "metrics": [{ + "type": "2aaa237d-42b3-442f-9094-a17aa470014b", + "dataset": "3e6ee79a-7453-4fc6-b9da-7ae1e41138ec" + }, { + "type": "dca08514-72e5-46ce-ad91-e68b3b0914d7", + "dataset": "4e6ee79a-7453-4fc6-b9da-7ae1e41138ed" + }, { + "type": "dca08514-72e5-46ce-ad92-e68b3b0914d4", + "dataset": "3e6ee79a-7453-4fc6-b9da-7ae1e41138ec" + }] + }, { + "uuid": "68d3046e-8e34-4f5d-a0e5-db3795a250fd", + "name": "memcache_02", + "datacenter": "f018da03-41c8-4619-a36a-ab8b706160cb", + "service": "6d31aff4-de1e-4042-a983-fbd23d5c530c", + "project": "e0ea0c02-55cc-45fe-8064-3e5176a59401", + "metrics": [{ + "type": "2aaa237d-42b3-442f-9094-a17aa470014b", + "dataset": "3e6ee79a-7453-4fc6-b9da-7ae1e41138ec" + }, { + "type": "dca08514-72e5-46ce-ad91-e68b3b0914d7", + "dataset": "4e6ee79a-7453-4fc6-b9da-7ae1e41138ed" + }, { + "type": "dca08514-72e5-46ce-ad92-e68b3b0914d4", + "dataset": "3e6ee79a-7453-4fc6-b9da-7ae1e41138ec" + }] + }, { + "uuid": "2ea99763-3b44-4179-8393-d66d94961051", + "name": "memcache_03", + "datacenter": "f018da03-41c8-4619-a36a-ab8b706160cb", + "service": "6d31aff4-de1e-4042-a983-fbd23d5c530c", + "project": "e0ea0c02-55cc-45fe-8064-3e5176a59401", + "metrics": [{ + "type": "2aaa237d-42b3-442f-9094-a17aa470014b", + "dataset": "3e6ee79a-7453-4fc6-b9da-7ae1e41138ec" + }, { + "type": "dca08514-72e5-46ce-ad91-e68b3b0914d7", + "dataset": "4e6ee79a-7453-4fc6-b9da-7ae1e41138ed" + }, { + "type": "dca08514-72e5-46ce-ad92-e68b3b0914d4", + "dataset": "3e6ee79a-7453-4fc6-b9da-7ae1e41138ec" + }] + }, { + "uuid": "25f6bc62-63b8-4959-908e-1f6d7ff6341d", + "name": "memcache_04", + "datacenter": "f018da03-41c8-4619-a36a-ab8b706160cb", + "service": "6d31aff4-de1e-4042-a983-fbd23d5c530c", + "project": "e0ea0c02-55cc-45fe-8064-3e5176a59401", + "metrics": [{ + "type": "2aaa237d-42b3-442f-9094-a17aa470014b", + "dataset": "3e6ee79a-7453-4fc6-b9da-7ae1e41138ec" + }, { + "type": "dca08514-72e5-46ce-ad91-e68b3b0914d7", + "dataset": "4e6ee79a-7453-4fc6-b9da-7ae1e41138ed" + }, { + "type": "dca08514-72e5-46ce-ad92-e68b3b0914d4", + "dataset": "3e6ee79a-7453-4fc6-b9da-7ae1e41138ec" + }] + }, { + "uuid": "8be01042-0281-4a77-a357-25979e87bf3d", + "name": "memcache_05", + "datacenter": "f018da03-41c8-4619-a36a-ab8b706160cb", + "service": "6d31aff4-de1e-4042-a983-fbd23d5c530c", + "project": "e0ea0c02-55cc-45fe-8064-3e5176a59401", + "metrics": [{ + "type": "2aaa237d-42b3-442f-9094-a17aa470014b", + "dataset": "3e6ee79a-7453-4fc6-b9da-7ae1e41138ec" + }, { + "type": "dca08514-72e5-46ce-ad91-e68b3b0914d7", + "dataset": "4e6ee79a-7453-4fc6-b9da-7ae1e41138ed" + }, { + "type": "dca08514-72e5-46ce-ad92-e68b3b0914d4", + "dataset": "3e6ee79a-7453-4fc6-b9da-7ae1e41138ec" + }] + }, { + "uuid": "3d652e9d-73e8-4a6f-8171-84fa83740662", + "name": "nginx", + "datacenter": "f018da03-41c8-4619-a36a-ab8b706160cb", + "service": "081a792c-47e0-4439-924b-2efa9788ae9e", + "project": "e0ea0c02-55cc-45fe-8064-3e5176a59401", + "metrics": [{ + "type": "2aaa237d-42b3-442f-9094-a17aa470014b", + "dataset": "3e6ee79a-7453-4fc6-b9da-7ae1e41138ec" + }, { + "type": "dca08514-72e5-46ce-ad91-e68b3b0914d7", + "dataset": "4e6ee79a-7453-4fc6-b9da-7ae1e41138ed" + }, { + "type": "dca08514-72e5-46ce-ad92-e68b3b0914d4", + "dataset": "3e6ee79a-7453-4fc6-b9da-7ae1e41138ec" + }] + }, { + "uuid": "c3ec7633-a02b-4615-86a0-9e6faeaae94b", + "name": "percona-primary", + "datacenter": "f018da03-41c8-4619-a36a-ab8b706160cb", + "service": "4ee4103e-1a52-4099-a48e-01588f597c70", + "project": "e0ea0c02-55cc-45fe-8064-3e5176a59401", + "metrics": [{ + "type": "2aaa237d-42b3-442f-9094-a17aa470014b", + "dataset": "3e6ee79a-7453-4fc6-b9da-7ae1e41138ec" + }, { + "type": "dca08514-72e5-46ce-ad91-e68b3b0914d7", + "dataset": "4e6ee79a-7453-4fc6-b9da-7ae1e41138ed" + }, { + "type": "dca08514-72e5-46ce-ad92-e68b3b0914d4", + "dataset": "3e6ee79a-7453-4fc6-b9da-7ae1e41138ec" + }] + }, { + "uuid": "c2b5fec2-31e2-41a7-b7fc-cd0bb1822e76", + "name": "percona-secondary", + "datacenter": "f018da03-41c8-4619-a36a-ab8b706160cb", + "service": "4ee4103e-1a52-4099-a48e-01588f597c70", + "project": "e0ea0c02-55cc-45fe-8064-3e5176a59401", + "metrics": [{ + "type": "2aaa237d-42b3-442f-9094-a17aa470014b", + "dataset": "3e6ee79a-7453-4fc6-b9da-7ae1e41138ec" + }, { + "type": "dca08514-72e5-46ce-ad91-e68b3b0914d7", + "dataset": "4e6ee79a-7453-4fc6-b9da-7ae1e41138ed" + }, { + "type": "dca08514-72e5-46ce-ad92-e68b3b0914d4", + "dataset": "3e6ee79a-7453-4fc6-b9da-7ae1e41138ec" + }] + }] + } +} diff --git a/frontend/src/state/selectors.js b/frontend/src/state/selectors.js index b1c1cb1f..ff29c4ac 100644 --- a/frontend/src/state/selectors.js +++ b/frontend/src/state/selectors.js @@ -15,7 +15,7 @@ const projectUiSections = (state) => get(state, 'projects.ui.sections', []); const serviceUiTooltip = (state) => get(state, 'services.ui.tooltip', []); const serviceUiSections = (state) => get(state, 'services.ui.sections', []); const orgs = (state) => get(state, 'orgs.data', []); -const orgUI = (state) => get(state, 'orgs.ui', []); +const orgsUI = (state) => get(state, 'orgs.ui', []); const projects = (state) => get(state, 'projects.data', []); const projectsUI = (state) => get(state, 'projects.ui', []); const services = (state) => get(state, 'services.data', []); @@ -315,8 +315,8 @@ const instancesByServiceId = (serviceId) => createSelector( ); const servicesForTopology = (projectId) => createSelector( - [services, projectById(projectId)], - (services, project) => + [services, projectById(projectId), instances], + (services, project, instances) => services.filter((s) => s.project === project.uuid) .reduce((acc, service, index, services) => { const getService = (s) => ({ @@ -324,10 +324,9 @@ const servicesForTopology = (projectId) => createSelector( uuid: s.uuid, id: s.id, name: s.name, - instances: instancesByServiceId(s.uuid).length, connections: s.connections, // tmp below - datacentres: 2, + datacentres: 1, metrics: [ { name: 'CPU', @@ -437,7 +436,7 @@ export { accountUi as accountUISelector, orgById as orgByIdSelector, orgs as orgsSelector, - orgUI as orgUISelector, + orgsUI as orgsUISelector, orgIndexById as orgIndexSelector, services as servicesSelector, serviceById as serviceByIdSelector,