Skip to content

Commit

Permalink
Merge pull request #244 from zilliztech/overview
Browse files Browse the repository at this point in the history
new overview
  • Loading branch information
shanghaikid authored Aug 9, 2023
2 parents f31a519 + 7f11907 commit 1d89955
Show file tree
Hide file tree
Showing 19 changed files with 344 additions and 119 deletions.
25 changes: 17 additions & 8 deletions client/src/components/cards/EmptyCard.tsx
Original file line number Diff line number Diff line change
@@ -1,5 +1,11 @@
import React, { FC } from 'react';
import { makeStyles, Theme, Typography } from '@material-ui/core';
import { FC } from 'react';
import {
makeStyles,
Theme,
Typography,
Card,
CardContent,
} from '@material-ui/core';
import StatusIcon from '../status/StatusIcon';
import { ChildrenStatusType } from '../status/Types';
import { EmptyCardProps } from './Types';
Expand All @@ -8,6 +14,7 @@ const useStyles = makeStyles((theme: Theme) => ({
wrapper: {
backgroundColor: '#fff',
flexDirection: 'column',
textAlign: 'center',
},
text: {
marginTop: theme.spacing(2),
Expand All @@ -34,14 +41,16 @@ const EmptyCard: FC<EmptyCardProps> = ({
const classes = useStyles();

return (
<section
<Card
className={`flex-center card-wrapper ${classes.wrapper} ${wrapperClass}`}
>
{loading && <StatusIcon type={ChildrenStatusType.CREATING} size={40} />}
{icon}
<Typography className={classes.text}>{text}</Typography>
<Typography className={classes.subText}>{subText}</Typography>
</section>
<CardContent>
{loading && <StatusIcon type={ChildrenStatusType.CREATING} size={40} />}
{icon}
<Typography className={classes.text}>{text}</Typography>
<Typography className={classes.subText}>{subText}</Typography>
</CardContent>
</Card>
);
};

Expand Down
2 changes: 0 additions & 2 deletions client/src/components/menu/CommunityBtn.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -40,7 +40,6 @@ const getStyles = makeStyles((theme: Theme) => ({
position: 'absolute',
width: '360px',
overflow: 'hidden',
fontFamily: 'Roboto',
},
head: {
backgroundColor: theme.palette.primary.main,
Expand All @@ -54,7 +53,6 @@ const getStyles = makeStyles((theme: Theme) => ({
fontSize: theme.spacing(2),
lineHeight: theme.spacing(3),
letterSpacing: '-0.01em',
fontFamily: 'Roboto'
},
titleDesc: {
color: '#f0f4f9',
Expand Down
74 changes: 69 additions & 5 deletions client/src/context/Data.tsx
Original file line number Diff line number Diff line change
@@ -1,10 +1,13 @@
import { createContext, useEffect, useState } from 'react';
import { DatabaseHttp } from '@/http';
import { DatabaseHttp, UserHttp, MilvusHttp } from '@/http';
import { parseJson, getNode, getSystemConfigs } from '@/utils';
import { MILVUS_NODE_TYPE } from '@/consts';
import { DataContextType } from './Types';

export const dataContext = createContext<DataContextType>({
database: 'default',
databases: ['default'],
data: {},
setDatabase: () => {},
setDatabaseList: () => {},
});
Expand All @@ -13,23 +16,84 @@ const { Provider } = dataContext;
export const DataProvider = (props: { children: React.ReactNode }) => {
const [database, setDatabase] = useState<string>('default');
const [databases, setDatabases] = useState<string[]>(['default']);
const [data, setData] = useState<any>({});

const fetchDatabases = async () => {
const fetchData = async () => {
try {
const res = await DatabaseHttp.getDatabases();
setDatabases(res.db_names);
// fetch all data
const [databases, metrics, users, roles] = await Promise.all([
DatabaseHttp.getDatabases(),
MilvusHttp.getMetrics(),
UserHttp.getUsers(),
UserHttp.getRoles(),
]);

// parse data
const parsedJson = parseJson(metrics);

// get query nodes
const queryNodes = getNode(
parsedJson.allNodes,
MILVUS_NODE_TYPE.QUERYNODE
);

// get data nodes
const dataNodes = getNode(
parsedJson.allNodes,
MILVUS_NODE_TYPE.DATANODE
);

// get data nodes
const indexNodes = getNode(
parsedJson.allNodes,
MILVUS_NODE_TYPE.INDEXNODE
);

// get root coord
const rootCoord = getNode(
parsedJson.allNodes,
MILVUS_NODE_TYPE.ROOTCOORD
)[0];


// get system config
const systemConfig = getSystemConfigs(parsedJson.workingNodes);
const deployMode = rootCoord.infos.system_info.deploy_mode;
const systemInfo = rootCoord.infos.system_info;

const data = {
users: users.usernames,
roles: roles.results,
queryNodes,
dataNodes,
indexNodes,
rootCoord,
deployMode,
parsedJson,
systemConfig,
systemInfo,
};

console.log(data);

// store databases
setDatabases(databases.db_names);
// store other datas
setData(data);
} catch (error) {
// do nothing
console.log('fetch data error', error);
}
};

useEffect(() => {
fetchDatabases();
fetchData();
}, []);

return (
<Provider
value={{
data,
database,
databases,
setDatabase,
Expand Down
1 change: 1 addition & 0 deletions client/src/context/Types.ts
Original file line number Diff line number Diff line change
Expand Up @@ -67,6 +67,7 @@ export type DataContextType = {
databases: string[];
setDatabase: Dispatch<SetStateAction<string>>;
setDatabaseList: Dispatch<SetStateAction<string[]>>;
data?: any;
};

export type PrometheusContextType = {
Expand Down
11 changes: 10 additions & 1 deletion client/src/i18n/en/overview.ts
Original file line number Diff line number Diff line change
@@ -1,9 +1,18 @@
const overviewTrans = {
load: 'Loaded Collections',
all: 'All Collections',
data: 'Entites',
data: 'Entities',
rows: '{{number}}',
loading: 'Loading Collections',
sysInfo: 'System Info',
database: 'Database',
milvusVersion: 'Milvus Version',
upTime: 'Up Time',
deployMode: 'Deploy Mode',
databases: 'Databases',
users: 'Users',
roles: 'Roles',
days: 'days',
};

export default overviewTrans;
4 changes: 2 additions & 2 deletions client/src/index.css
Original file line number Diff line number Diff line change
Expand Up @@ -2,8 +2,8 @@

body {
margin: 0;
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto',
'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
Expand Down
Loading

0 comments on commit 1d89955

Please sign in to comment.