Add a statistics page.

studio/config/routes.ts

@@ -55,6 +55,13 @@ export const routes = [
       '@/wrappers/param',
     ],
   },
+  {
+    path: '/statistics',
+    name: 'Statistics',
+    icon: 'table',
+    component: './Statistics',
+    category: 'knowledge-graph'
+  },
   {
     path: '/knowledge-graph-editor',
     name: 'knowledge-graph-editor',

studio/custom/route/rapex.ts

@@ -14,6 +14,7 @@ export const routes = [
     name: 'Analyze Omics Data',
     icon: 'LineChartOutlined',
     disabled: true,
+    hideInMenu: true,
     component: './Home',
   },
   {
@@ -45,6 +46,13 @@ export const routes = [
       },
     ]
   },
+  {
+    path: '/statistics',
+    name: 'Statistics',
+    icon: 'table',
+    component: './Statistics',
+    category: 'knowledge-graph'
+  },
   {
     path: '/knowledge-graph-editor',
     name: 'knowledge-graph-editor',

studio/src/pages/Statistics/index.less

@@ -0,0 +1,11 @@
+.statistics-container {
+    display: flex;
+    width: calc(100vw - 40px);
+    margin: 20px 20px;
+    overflow: auto;
+
+    .ant-collapse {
+        width: 100%;
+        height: 100%;
+    }
+}

studio/src/pages/Statistics/index.tsx

@@ -0,0 +1,39 @@
+import React, { useEffect, useState } from 'react';
+import type { RelationStat, EntityStat } from 'biominer-components/dist/typings';
+import StatisticsChart from 'biominer-components/dist/StatisticsChart';
+import { fetchStatistics } from '@/services/swagger/KnowledgeGraph';
+import { logoutWithRedirect, isAuthenticated } from '@/components/util';
+import { Empty, Row } from 'antd';
+
+import './index.less';
+
+const Statistics: React.FC = () => {
+    const [relationStat, setRelationStat] = useState<RelationStat[]>([]);
+    const [entityStat, setEntityStat] = useState<EntityStat[]>([]);
+
+    useEffect(() => {
+        console.log("isAuthenticated in ModelConfig: ", isAuthenticated());
+        if (!isAuthenticated()) {
+            logoutWithRedirect();
+        } else {
+            fetchStatistics().then((data) => {
+                console.log("fetchStatistics data: ", data);
+                const relationStats = data.relation_stat;
+                setRelationStat(relationStats);
+
+                const entityStats = data.entity_stat;
+                setEntityStat(entityStats);
+            });
+        }
+    }, []);
+
+    return (
+        <Row className="statistics-container">{
+            (relationStat && entityStat) ?
+                <StatisticsChart nodeStat={entityStat} edgeStat={relationStat} />
+                : <Empty />
+        }</Row>
+    );
+};
+
+export default Statistics;