Skip to content

Commit dcb38d5

Browse files
tiithansentiithansen
committed
feat: Better workloads overview page
1 parent 59816d9 commit dcb38d5

File tree

1 file changed

+178
-38
lines changed

1 file changed

+178
-38
lines changed

‎src/pages/Workloads/tabs/Overview/Overview.tsx

+178-38
Original file line numberDiff line numberDiff line change
@@ -1,49 +1,189 @@
11
import { EmbeddedScene, PanelBuilders, SceneFlexItem, SceneFlexLayout, SceneQueryRunner } from "@grafana/scenes"
2+
import { LegendDisplayMode } from "@grafana/schema"
3+
4+
function createPodsPanel() {
5+
return PanelBuilders.timeseries()
6+
.setTitle('Pods By Status')
7+
.setData(new SceneQueryRunner({
8+
datasource: {
9+
uid: '$datasource',
10+
type: 'prometheus',
11+
},
12+
queries: [
13+
{
14+
refId: 'pods',
15+
expr: `sum(
16+
kube_pod_status_phase{
17+
cluster="$cluster"
18+
}
19+
) by (phase)
20+
`,
21+
legendFormat: 'Pods - {{phase}}',
22+
},
23+
],
24+
}))
25+
.setOption('legend', { displayMode: LegendDisplayMode.Table, calcs: ['mean', 'last', 'max'] })
26+
.build()
27+
}
28+
29+
function createPodsByOwnerKindPanel() {
30+
return PanelBuilders.timeseries()
31+
.setTitle('Pods By Owner Kind')
32+
.setData(new SceneQueryRunner({
33+
datasource: {
34+
uid: '$datasource',
35+
type: 'prometheus',
36+
},
37+
queries: [
38+
{
39+
refId: 'pods',
40+
expr: `count(
41+
kube_pod_info{
42+
cluster="$cluster"
43+
}
44+
) by (created_by_kind)
45+
`,
46+
legendFormat: 'Pods - {{created_by_kind}}',
47+
},
48+
],
49+
}))
50+
.setOption('legend', { displayMode: LegendDisplayMode.Table, calcs: ['mean', 'last', 'max'] })
51+
.build()
52+
}
53+
54+
55+
function createDeploymentsPanel() {
56+
return PanelBuilders.stat()
57+
.setTitle('Deployments')
58+
.setData(new SceneQueryRunner({
59+
datasource: {
60+
uid: '$datasource',
61+
type: 'prometheus',
62+
},
63+
queries: [
64+
{
65+
refId: 'deployments',
66+
expr: `count(
67+
kube_deployment_created{
68+
cluster="$cluster"
69+
}
70+
)
71+
`,
72+
legendFormat: 'Deployments',
73+
},
74+
],
75+
}))
76+
.build()
77+
}
78+
79+
function createStatefulsetsPanel() {
80+
return PanelBuilders.stat()
81+
.setTitle('Statefulsets')
82+
.setData(new SceneQueryRunner({
83+
datasource: {
84+
uid: '$datasource',
85+
type: 'prometheus',
86+
},
87+
queries: [
88+
{
89+
refId: 'statefulsets',
90+
expr: `count(
91+
kube_statefulset_created{
92+
cluster="$cluster"
93+
}
94+
)
95+
`,
96+
legendFormat: 'Statefulset',
97+
},
98+
],
99+
}))
100+
.build()
101+
}
102+
103+
function createDaemonsetsPanel() {
104+
return PanelBuilders.stat()
105+
.setTitle('Daemonsets')
106+
.setData(new SceneQueryRunner({
107+
datasource: {
108+
uid: '$datasource',
109+
type: 'prometheus',
110+
},
111+
queries: [
112+
{
113+
refId: 'statefulsets',
114+
expr: `count(
115+
kube_daemonset_created{
116+
cluster="$cluster"
117+
}
118+
)
119+
`,
120+
legendFormat: 'Statefulset',
121+
},
122+
],
123+
}))
124+
.build()
125+
}
126+
127+
function createCronjobsPanel() {
128+
return PanelBuilders.stat()
129+
.setTitle('Cronjobs')
130+
.setData(new SceneQueryRunner({
131+
datasource: {
132+
uid: '$datasource',
133+
type: 'prometheus',
134+
},
135+
queries: [
136+
{
137+
refId: 'cronjobs',
138+
expr: `count(
139+
kube_cronjob_created{
140+
cluster="$cluster"
141+
}
142+
)
143+
`,
144+
legendFormat: 'Cronjobs',
145+
},
146+
],
147+
}))
148+
.build()
149+
150+
}
2151

3152
export const getOverviewScene = () => {
4153
return new EmbeddedScene({
5154
body: new SceneFlexLayout({
155+
direction: 'column',
6156
children: [
7-
new SceneFlexItem({
8-
width: '25%',
157+
new SceneFlexLayout({
158+
direction: 'row',
9159
height: 300,
10-
body: PanelBuilders.timeseries()
11-
.setTitle('Nodes')
12-
.setData(new SceneQueryRunner({
13-
datasource: {
14-
uid: '$datasource',
15-
type: 'prometheus',
16-
},
17-
queries: [
18-
{
19-
refId: 'nodes',
20-
expr: 'sum (kube_node_info{cluster="$cluster"})',
21-
legendFormat: 'Nodes',
22-
},
23-
],
24-
}))
25-
.build(),
160+
children: [
161+
new SceneFlexItem({
162+
body: createDeploymentsPanel(),
163+
}),
164+
new SceneFlexItem({
165+
body: createStatefulsetsPanel(),
166+
}),
167+
new SceneFlexItem({
168+
body: createDaemonsetsPanel(),
169+
}),
170+
new SceneFlexItem({
171+
body: createCronjobsPanel(),
172+
}),
173+
]
174+
}),
175+
new SceneFlexLayout({
176+
direction: 'row',
177+
height: 400,
178+
children: [
179+
new SceneFlexItem({
180+
body: createPodsPanel(),
181+
}),
182+
new SceneFlexItem({
183+
body: createPodsByOwnerKindPanel(),
184+
}),
185+
]
26186
}),
27-
new SceneFlexItem({
28-
width: '25%',
29-
height: 300,
30-
body: PanelBuilders.timeseries()
31-
.setTitle('Pods')
32-
.setData(new SceneQueryRunner({
33-
datasource: {
34-
uid: '$datasource',
35-
type: 'prometheus',
36-
},
37-
queries: [
38-
{
39-
refId: 'pods',
40-
expr: 'sum (kube_pod_status_phase{cluster="$cluster"}) by (phase)',
41-
legendFormat: 'Pods - {{phase}}',
42-
},
43-
],
44-
}))
45-
.build(),
46-
})
47187
],
48188
}),
49189
})

0 commit comments

Comments
 (0)