-
Notifications
You must be signed in to change notification settings - Fork 1.3k
Expand file tree
/
Copy pathObjectsCountStats.tsx
More file actions
98 lines (90 loc) · 2.86 KB
/
ObjectsCountStats.tsx
File metadata and controls
98 lines (90 loc) · 2.86 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
import React, { useContext } from "react";
import {
EuiFlexGroup,
EuiFlexItem,
EuiStat,
EuiHorizontalRule,
EuiTitle,
EuiSpacer,
} from "@elastic/eui";
import useLoadRegistry from "../queries/useLoadRegistry";
import { useNavigate, useParams } from "react-router-dom";
import RegistryPathContext from "../contexts/RegistryPathContext";
const useLoadObjectStats = () => {
const registryUrl = useContext(RegistryPathContext);
const query = useLoadRegistry(registryUrl);
const data =
query.isSuccess && query.data
? {
featureServices: query.data.objects.featureServices?.length || 0,
featureViews: query.data.mergedFVList.length,
entities: query.data.objects.entities?.length || 0,
dataSources: query.data.objects.dataSources?.length || 0,
}
: undefined;
return {
...query,
data,
};
};
const statStyle = { cursor: "pointer" };
const ObjectsCountStats = () => {
const { isLoading, isSuccess, isError, data } = useLoadObjectStats();
const { projectName } = useParams();
const navigate = useNavigate();
return (
<React.Fragment>
<EuiSpacer size="l" />
<EuiHorizontalRule margin="xs" />
{isLoading && <p>Loading</p>}
{isError && <p>There was an error in loading registry information.</p>}
{isSuccess && data && (
<React.Fragment>
<EuiTitle size="xs">
<h3>Registered in this Feast project are …</h3>
</EuiTitle>
<EuiSpacer size="s" />
<EuiFlexGroup>
<EuiFlexItem>
<EuiStat
style={statStyle}
onClick={() => navigate(`/p/${projectName}/feature-service`)}
description="Feature Services→"
title={data.featureServices}
reverse
/>
</EuiFlexItem>
<EuiFlexItem>
<EuiStat
style={statStyle}
description="Feature Views→"
onClick={() => navigate(`/p/${projectName}/feature-view`)}
title={data.featureViews}
reverse
/>
</EuiFlexItem>
<EuiFlexItem>
<EuiStat
style={statStyle}
description="Entities→"
onClick={() => navigate(`/p/${projectName}/entity`)}
title={data.entities}
reverse
/>
</EuiFlexItem>
<EuiFlexItem>
<EuiStat
style={statStyle}
description="Data Sources→"
onClick={() => navigate(`/p/${projectName}/data-source`)}
title={data.dataSources}
reverse
/>
</EuiFlexItem>
</EuiFlexGroup>
</React.Fragment>
)}
</React.Fragment>
);
};
export default ObjectsCountStats;