Skip to content

Commit 0ae3faf

Browse files
authored
make GlobalView render from the provided SystemState (#1329)
* make `GlobalView` render from the provided `SystemState` closes #1286 * fix lints
1 parent eeb22bf commit 0ae3faf

File tree

6 files changed

+299
-185
lines changed

6 files changed

+299
-185
lines changed

packages/ott-vis-datasource/tsconfig.json

+3-1
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,8 @@
22
"extends": "./.config/tsconfig.json",
33
"compilerOptions": {
44
"strict": true,
5-
"typeRoots": ["../../node_modules/@types"]
5+
"typeRoots": ["../../node_modules/@types"],
6+
"esModuleInterop": true,
7+
"jsx": "react"
68
}
79
}
+96
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,96 @@
1+
import { SystemState } from "types";
2+
import { aggMonolithRooms, countRoomClients } from "./aggregate";
3+
4+
const sampleSystemState: SystemState = [
5+
{
6+
id: "154d9d41-128c-45ab-83d8-28661882c9e3",
7+
region: "ewr",
8+
monoliths: [
9+
{
10+
id: "2bd5e4a7-14f6-4da4-bedd-72946864a7bf",
11+
region: "ewr",
12+
rooms: [
13+
{ name: "foo", clients: 2 },
14+
{ name: "bar", clients: 0 },
15+
],
16+
},
17+
{
18+
id: "419580cb-f576-4314-8162-45340c94bae1",
19+
region: "ewr",
20+
rooms: [{ name: "baz", clients: 3 }],
21+
},
22+
{
23+
id: "0c85b46e-d343-46a3-ae4f-5f2aa1a8bdac",
24+
region: "cdg",
25+
rooms: [{ name: "qux", clients: 0 }],
26+
},
27+
],
28+
},
29+
{
30+
id: "c91d183c-980e-4160-b196-43658148f469",
31+
region: "ewr",
32+
monoliths: [
33+
{
34+
id: "2bd5e4a7-14f6-4da4-bedd-72946864a7bf",
35+
region: "ewr",
36+
rooms: [
37+
{ name: "foo", clients: 1 },
38+
{ name: "bar", clients: 2 },
39+
],
40+
},
41+
{
42+
id: "419580cb-f576-4314-8162-45340c94bae1",
43+
region: "ewr",
44+
rooms: [{ name: "baz", clients: 0 }],
45+
},
46+
{
47+
id: "0c85b46e-d343-46a3-ae4f-5f2aa1a8bdac",
48+
region: "cdg",
49+
rooms: [{ name: "qux", clients: 0 }],
50+
},
51+
],
52+
},
53+
{
54+
id: "5a2e3b2d-f27b-4e3d-9b59-c921442f7ff0",
55+
region: "cdg",
56+
monoliths: [
57+
{
58+
id: "2bd5e4a7-14f6-4da4-bedd-72946864a7bf",
59+
region: "ewr",
60+
rooms: [
61+
{ name: "foo", clients: 0 },
62+
{ name: "bar", clients: 0 },
63+
],
64+
},
65+
{
66+
id: "419580cb-f576-4314-8162-45340c94bae1",
67+
region: "ewr",
68+
rooms: [{ name: "baz", clients: 0 }],
69+
},
70+
{
71+
id: "0c85b46e-d343-46a3-ae4f-5f2aa1a8bdac",
72+
region: "cdg",
73+
rooms: [{ name: "qux", clients: 4 }],
74+
},
75+
],
76+
},
77+
];
78+
79+
describe("aggregation helpers", () => {
80+
it("counts room clients", () => {
81+
expect(countRoomClients(sampleSystemState)).toEqual({
82+
foo: 3,
83+
bar: 2,
84+
baz: 3,
85+
qux: 4,
86+
});
87+
});
88+
89+
it("aggregates monolith rooms", () => {
90+
expect(aggMonolithRooms(sampleSystemState)).toEqual({
91+
"2bd5e4a7-14f6-4da4-bedd-72946864a7bf": ["foo", "bar"],
92+
"419580cb-f576-4314-8162-45340c94bae1": ["baz"],
93+
"0c85b46e-d343-46a3-ae4f-5f2aa1a8bdac": ["qux"],
94+
});
95+
});
96+
});

packages/ott-vis/src/aggregate.ts

+36
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
import { SystemState } from "types";
2+
3+
/**
4+
* Builds a map of room names to the number of clients in each room from the room state.
5+
* @param state
6+
*/
7+
export function countRoomClients(state: SystemState): Record<string, number> {
8+
const roomClients: Record<string, number> = {};
9+
for (const balancer of state) {
10+
for (const monolith of balancer.monoliths) {
11+
for (const room of monolith.rooms) {
12+
roomClients[room.name] = (roomClients[room.name] ?? 0) + room.clients;
13+
}
14+
}
15+
}
16+
return roomClients;
17+
}
18+
19+
/**
20+
* Collect a map of monolith ids to room names.
21+
* @param state
22+
* @returns
23+
*/
24+
export function aggMonolithRooms(state: SystemState): Record<string, string[]> {
25+
const roomClients: Record<string, Set<string>> = {};
26+
for (const balancer of state) {
27+
for (const monolith of balancer.monoliths) {
28+
for (const room of monolith.rooms) {
29+
const s = roomClients[monolith.id] ?? new Set();
30+
s.add(room.name);
31+
roomClients[monolith.id] = s;
32+
}
33+
}
34+
}
35+
return Object.fromEntries(Object.entries(roomClients).map(([k, v]) => [k, Array.from(v)]));
36+
}

packages/ott-vis/src/components/CorePanel.tsx

+78-3
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import React from "react";
22
import { PanelProps } from "@grafana/data";
3-
import type { CoreOptions } from "types";
3+
import type { CoreOptions, SystemState } from "types";
44
import { css, cx } from "@emotion/css";
55
import { useStyles2 } from "@grafana/ui";
66
import GlobalView from "./views/GlobalView";
@@ -28,14 +28,89 @@ const getStyles = () => {
2828
};
2929
};
3030

31+
const sampleSystemState: SystemState = [
32+
{
33+
id: "154d9d41-128c-45ab-83d8-28661882c9e3",
34+
region: "ewr",
35+
monoliths: [
36+
{
37+
id: "2bd5e4a7-14f6-4da4-bedd-72946864a7bf",
38+
region: "ewr",
39+
rooms: [
40+
{ name: "foo", clients: 2 },
41+
{ name: "bar", clients: 0 },
42+
],
43+
},
44+
{
45+
id: "419580cb-f576-4314-8162-45340c94bae1",
46+
region: "ewr",
47+
rooms: [{ name: "baz", clients: 3 }],
48+
},
49+
{
50+
id: "0c85b46e-d343-46a3-ae4f-5f2aa1a8bdac",
51+
region: "cdg",
52+
rooms: [{ name: "qux", clients: 0 }],
53+
},
54+
],
55+
},
56+
{
57+
id: "c91d183c-980e-4160-b196-43658148f469",
58+
region: "ewr",
59+
monoliths: [
60+
{
61+
id: "2bd5e4a7-14f6-4da4-bedd-72946864a7bf",
62+
region: "ewr",
63+
rooms: [
64+
{ name: "foo", clients: 1 },
65+
{ name: "bar", clients: 2 },
66+
],
67+
},
68+
{
69+
id: "419580cb-f576-4314-8162-45340c94bae1",
70+
region: "ewr",
71+
rooms: [{ name: "baz", clients: 0 }],
72+
},
73+
{
74+
id: "0c85b46e-d343-46a3-ae4f-5f2aa1a8bdac",
75+
region: "cdg",
76+
rooms: [{ name: "qux", clients: 0 }],
77+
},
78+
],
79+
},
80+
{
81+
id: "5a2e3b2d-f27b-4e3d-9b59-c921442f7ff0",
82+
region: "cdg",
83+
monoliths: [
84+
{
85+
id: "2bd5e4a7-14f6-4da4-bedd-72946864a7bf",
86+
region: "ewr",
87+
rooms: [
88+
{ name: "foo", clients: 0 },
89+
{ name: "bar", clients: 0 },
90+
],
91+
},
92+
{
93+
id: "419580cb-f576-4314-8162-45340c94bae1",
94+
region: "ewr",
95+
rooms: [{ name: "baz", clients: 0 }],
96+
},
97+
{
98+
id: "0c85b46e-d343-46a3-ae4f-5f2aa1a8bdac",
99+
region: "cdg",
100+
rooms: [{ name: "qux", clients: 4 }],
101+
},
102+
],
103+
},
104+
];
105+
31106
export const CorePanel: React.FC<Props> = ({ options, data, width, height }) => {
32107
const styles = useStyles2(getStyles);
33108

34109
let view;
35110
if (options.view === "global") {
36-
view = <GlobalView height={height} width={width} systemState={[]} />;
111+
view = <GlobalView height={height} width={width} systemState={sampleSystemState} />;
37112
} else if (options.view === "region") {
38-
view = <RegionView height={height} width={width} systemState={[]} />;
113+
view = <RegionView height={height} width={width} systemState={sampleSystemState} />;
39114
} else {
40115
view = <div>Invalid view</div>;
41116
}

0 commit comments

Comments
 (0)