prometheus

1
import React, { FC, useCallback, useEffect, useMemo, useState } from 'react';
2
import { useFetch } from '../../hooks/useFetch';
3
import { LabelsTable } from './LabelsTable';
4
import { DroppedTarget, Labels, Target } from '../targets/target';
5

6
import { withStatusIndicator } from '../../components/withStatusIndicator';
7
import { setQuerySearchFilter, mapObjEntries, getQuerySearchFilter } from '../../utils';
8
import { usePathPrefix } from '../../contexts/PathPrefixContext';
9
import { API_PATH } from '../../constants/constants';
10
import { KVSearch } from '@nexucis/kvsearch';
11
import { Container } from 'reactstrap';
12
import SearchBar from '../../components/SearchBar';
13

14
interface ServiceMap {
15
  activeTargets: Target[];
16
  droppedTargets: DroppedTarget[];
17
  droppedTargetCounts: Record<string, number>;
18
}
19

20
export interface TargetLabels {
21
  discoveredLabels: Labels;
22
  labels: Labels;
23
  isDropped: boolean;
24
}
25

26
const activeTargetKVSearch = new KVSearch<Target>({
27
  shouldSort: true,
28
  indexedKeys: ['labels', 'discoveredLabels', ['discoveredLabels', /.*/], ['labels', /.*/]],
29
});
30

31
const droppedTargetKVSearch = new KVSearch<DroppedTarget>({
32
  shouldSort: true,
33
  indexedKeys: ['discoveredLabels', ['discoveredLabels', /.*/]],
34
});
35

36
export const processSummary = (
37
  activeTargets: Target[],
38
  droppedTargetCounts: Record<string, number>
39
): Record<string, { active: number; total: number }> => {
40
  const targets: Record<string, { active: number; total: number }> = {};
41

42
  // Get targets of each type along with the total and active end points
43
  for (const target of activeTargets) {
44
    const { scrapePool: name } = target;
45
    if (!targets[name]) {
46
      targets[name] = {
47
        total: 0,
48
        active: 0,
49
      };
50
    }
51
    targets[name].total++;
52
    targets[name].active++;
53
  }
54
  for (const name in targets) {
55
    if (!targets[name]) {
56
      targets[name] = {
57
        total: droppedTargetCounts[name],
58
        active: 0,
59
      };
60
    } else {
61
      targets[name].total += droppedTargetCounts[name];
62
    }
63
  }
64

65
  return targets;
66
};
67

68
export const processTargets = (activeTargets: Target[], droppedTargets: DroppedTarget[]): Record<string, TargetLabels[]> => {
69
  const labels: Record<string, TargetLabels[]> = {};
70

71
  for (const target of activeTargets) {
72
    const name = target.scrapePool;
73
    if (!labels[name]) {
74
      labels[name] = [];
75
    }
76
    labels[name].push({
77
      discoveredLabels: target.discoveredLabels,
78
      labels: target.labels,
79
      isDropped: false,
80
    });
81
  }
82

83
  for (const target of droppedTargets) {
84
    const { job: name } = target.discoveredLabels;
85
    if (!labels[name]) {
86
      labels[name] = [];
87
    }
88
    labels[name].push({
89
      discoveredLabels: target.discoveredLabels,
90
      isDropped: true,
91
      labels: {},
92
    });
93
  }
94

95
  return labels;
96
};
97

98
export const ServiceDiscoveryContent: FC<ServiceMap> = ({ activeTargets, droppedTargets, droppedTargetCounts }) => {
99
  const [activeTargetList, setActiveTargetList] = useState(activeTargets);
100
  const [droppedTargetList, setDroppedTargetList] = useState(droppedTargets);
101
  const [targetList, setTargetList] = useState(processSummary(activeTargets, droppedTargetCounts));
102
  const [labelList, setLabelList] = useState(processTargets(activeTargets, droppedTargets));
103

104
  const handleSearchChange = useCallback(
105
    (value: string) => {
106
      setQuerySearchFilter(value);
107
      if (value !== '') {
108
        const activeTargetResult = activeTargetKVSearch.filter(value.trim(), activeTargets);
109
        const droppedTargetResult = droppedTargetKVSearch.filter(value.trim(), droppedTargets);
110
        setActiveTargetList(activeTargetResult.map((value) => value.original));
111
        setDroppedTargetList(droppedTargetResult.map((value) => value.original));
112
      } else {
113
        setActiveTargetList(activeTargets);
114
      }
115
    },
116
    [activeTargets, droppedTargets]
117
  );
118

119
  const defaultValue = useMemo(getQuerySearchFilter, []);
120

121
  useEffect(() => {
122
    setTargetList(processSummary(activeTargetList, droppedTargetCounts));
123
    setLabelList(processTargets(activeTargetList, droppedTargetList));
124
  }, [activeTargetList, droppedTargetList, droppedTargetCounts]);
125

126
  return (
127
    <>
128
      <h2>Service Discovery</h2>
129
      <Container>
130
        <SearchBar defaultValue={defaultValue} handleChange={handleSearchChange} placeholder="Filter by labels" />
131
      </Container>
132
      <ul>
133
        {mapObjEntries(targetList, ([k, v]) => (
134
          <li key={k}>
135
            <a href={'#' + k}>
136
              {k} ({v.active} / {v.total} active targets)
137
            </a>
138
          </li>
139
        ))}
140
      </ul>
141
      <hr />
142
      {mapObjEntries(labelList, ([k, v]) => {
143
        return <LabelsTable value={v} name={k} key={k} />;
144
      })}
145
    </>
146
  );
147
};
148
ServiceDiscoveryContent.displayName = 'ServiceDiscoveryContent';
149

150
const ServicesWithStatusIndicator = withStatusIndicator(ServiceDiscoveryContent);
151

152
const ServiceDiscovery: FC = () => {
153
  const pathPrefix = usePathPrefix();
154
  const { response, error, isLoading } = useFetch<ServiceMap>(`${pathPrefix}/${API_PATH}/targets`);
155
  return (
156
    <ServicesWithStatusIndicator
157
      {...response.data}
158
      error={error}
159
      isLoading={isLoading}
160
      componentTitle="Service Discovery information"
161
    />
162
  );
163
};
164

165
export default ServiceDiscovery;
166