feat: update

canyon-project · Nov 8, 2023 · e2269f5 · e2269f5
1 parent 4c19a11
commit e2269f5
Show file tree

Hide file tree

Showing 14 changed files with 180 additions and 243 deletions.
diff --git a/packages/canyon-platform/src/layout/MainBox.tsx b/packages/canyon-platform/src/layout/MainBox.tsx
@@ -1,23 +1,16 @@
-import Icon, {
-  DashboardOutlined,
-  DesktopOutlined,
-  FileOutlined,
-  PieChartOutlined,
-  ProjectOutlined,
-  TeamOutlined,
-  UserOutlined,
-} from '@ant-design/icons';
+import Icon, { DashboardOutlined } from '@ant-design/icons';
 import { useQuery } from '@apollo/client';
 import type { MenuProps } from 'antd';
-import { Avatar, Breadcrumb, ConfigProvider, Dropdown, Layout, Menu, Space, theme } from 'antd';
+import { Avatar, Dropdown, Layout, Menu, Space } from 'antd';
 import React, { useEffect, useMemo, useState } from 'react';
 import { useLocation, useNavigate, useRoutes } from 'react-router-dom';
 
 import routes from '~react-pages';
 
 import { MeDocument } from '../helpers/backend/gen/graphql.ts';
 import Sv from './Sv';
-const { Header, Content, Footer, Sider } = Layout;
+
+const { Content, Sider } = Layout;
 
 type MenuItem = Required<MenuProps>['items'][number];
 
@@ -69,7 +62,7 @@ const App: React.FC = () => {
   }, [loc.pathname]);
 
   const dropdownItems = [getItem('登出', 'logout')];
-  const dropdownClick = ({ key }) => {
+  const dropdownClick = ({ key }:any) => {
     console.log(key);
     localStorage.clear();
     window.location.href = '/welcome';

diff --git a/packages/canyon-platform/src/main.tsx b/packages/canyon-platform/src/main.tsx
@@ -1,13 +1,9 @@
-// import './test.js'
 import 'antd/dist/reset.css';
 import './index.css';
 
-// import '@canyon/report/dist/index.css';
-
 import { ApolloClient, ApolloProvider, createHttpLink, InMemoryCache } from '@apollo/client';
 import { onError } from '@apollo/client/link/error';
 import { message } from 'antd';
-// import React from 'react'
 import ReactDOM from 'react-dom/client';
 import { BrowserRouter } from 'react-router-dom';
 
@@ -19,7 +15,11 @@ const errorLink = onError(({ graphQLErrors, networkError }) => {
     graphQLErrors.forEach(({ message: msg, locations, path }) => {
       console.error(`[GraphQL error]: msg: ${msg}, Location: ${locations}, Path: ${path}`);
       message.error(`[GraphQL error]: msg: ${msg}, Path: ${path}`);
-      if (msg === 'Unauthorized' && window.location.pathname !== '/welcome'&& window.location.pathname !== '/login') {
+      if (
+        msg === 'Unauthorized' &&
+        window.location.pathname !== '/welcome' &&
+        window.location.pathname !== '/login'
+      ) {
         localStorage.clear();
         window.location.href = '/welcome';
       }
@@ -46,18 +46,6 @@ const client = new ApolloClient({
   cache: new InMemoryCache(),
 });
 
-console.log(`Bearer ` + (localStorage.getItem('token') || ''))
-
-// import App from './App.tsx';
-// const client = new ApolloClient({
-//   uri: '/graphql',
-//   cache: new InMemoryCache(),
-//   headers: {
-//     Authorization: `Bearer ` + (localStorage.getItem('token') || ''),
-//   },
-//   // credentials: 'include',
-// });
-
 ReactDOM.createRoot(document.getElementById('root')!).render(
   <BrowserRouter>
     <ApolloProvider client={client}>

diff --git a/packages/canyon-platform/src/pages/index/index.tsx b/packages/canyon-platform/src/pages/index/index.tsx
@@ -1,21 +1,21 @@
-import {Avatar, Button, Card, DatePicker, List, Space} from "antd";
-import dayjs from "dayjs";
-import EChartsReact from "echarts-for-react";
-// import {th} from 'echarts'
+import { Avatar, Button, Card, DatePicker, List, Space } from 'antd';
+import dayjs from 'dayjs';
+import EChartsReact from 'echarts-for-react';
+
 const option = {
   xAxis: {
     type: 'category',
-    data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun','1','2','3']
+    data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun', '1', '2', '3'],
   },
   yAxis: {
-    type: 'value'
+    type: 'value',
   },
   series: [
     {
-      data: [120, 200, 150, 80, 70, 110, 130,112,333,222],
-      type: 'bar'
-    }
-  ]
+      data: [120, 200, 150, 80, 70, 110, 130, 112, 333, 222],
+      type: 'bar',
+    },
+  ],
 };
 const { RangePicker } = DatePicker;
 const data = [
@@ -33,77 +33,85 @@ const data = [
   },
 ];
 const dateFormat = 'YYYY/MM/DD';
-const weekFormat = 'MM/DD';
-const monthFormat = 'YYYY/MM';
 const Dashboard = () => {
-  return <div>
-    <div className={'flex justify-between mb-3'}>
-      <h1>Dashboard</h1>
-      <Space>
-        <RangePicker
-          defaultValue={[dayjs('2015/01/01', dateFormat), dayjs('2015/01/01', dateFormat)]}
-          format={dateFormat}
-        />
-
-        <Button type={'primary'}>Download</Button>
-      </Space>
-    </div>
-    <div className={'flex gap-5'}>
-      {
-        [{
-          name:"function",
-          desc:"This is function"
-        },{
-          name:"function",
-          desc:"This is function"
-        },{
-          name:"function",
-          desc:"This is function"
-        },{
-          name:"function",
-          desc:"This is function"
-        }].map(({name,desc},index)=>{
-          return       <Card key={index} className={'flex-1'}>
-            <div className={'text-xl'}>{name}</div>
-            <h2>100%</h2>
-            <div className={'opacity-50'}>{desc}</div>
-          </Card>
-        })
-      }
-    </div>
-
+  return (
+    <div>
+      <div className={'flex justify-between mb-3'}>
+        <h1>Dashboard</h1>
+        <Space>
+          <RangePicker
+            defaultValue={[dayjs('2015/01/01', dateFormat), dayjs('2015/01/01', dateFormat)]}
+            format={dateFormat}
+          />
 
-    <div className={'flex pt-5 gap-5'}>
+          <Button type={'primary'}>Download</Button>
+        </Space>
+      </div>
+      <div className={'flex gap-5'}>
+        {[
+          {
+            name: 'function',
+            desc: 'This is function',
+          },
+          {
+            name: 'function',
+            desc: 'This is function',
+          },
+          {
+            name: 'function',
+            desc: 'This is function',
+          },
+          {
+            name: 'function',
+            desc: 'This is function',
+          },
+        ].map(({ name, desc }, index) => {
+          return (
+            <Card key={index} className={'flex-1'}>
+              <div className={'text-xl'}>{name}</div>
+              <h2>100%</h2>
+              <div className={'opacity-50'}>{desc}</div>
+            </Card>
+          );
+        })}
+      </div>
 
+      <div className={'flex pt-5 gap-5'}>
+        <Card className={'flex-[6]'}>
+          <p>Overview</p>
+          <EChartsReact
+            theme={{
+              color: ['#8b5cf6', '#10b981'],
+            }}
+            option={option}
+            style={{ height: '400px' }}
+          />
+        </Card>
 
-      <Card className={'flex-[6]'}>
-        <p>Overview</p>
-        <EChartsReact theme={{
-          color: ['#8b5cf6', '#10b981'],
-        }} option={option} style={{height:'400px'}}/>
-      </Card>
-
-
-      <Card className={'flex-[4]'}>
-        <p>Recent Sales</p>
-        <p className={'text-black opacity-50'}>You made 265 sales this month.</p>
-        <List
-          itemLayout="horizontal"
-          dataSource={data}
-          renderItem={(item, index) => (
-            <List.Item>
-              <List.Item.Meta
-                avatar={<Avatar src={`https://xsgames.co/randomusers/avatar.php?g=pixel&key=${index}`} />}
-                title={<a href="https://ant.design">{item.title}</a>}
-                description="Ant Design, a design language for background applications, is refined by Ant UED Team"
-              />
-            </List.Item>
-          )}
-        />
-      </Card>
+        <Card className={'flex-[4]'}>
+          <p>Recent Sales</p>
+          <p className={'text-black opacity-50'}>You made 265 sales this month.</p>
+          <List
+            itemLayout='horizontal'
+            dataSource={data}
+            renderItem={(item, index) => (
+              <List.Item>
+                <List.Item.Meta
+                  avatar={
+                    <Avatar
+                      src={`https://xsgames.co/randomusers/avatar.php?g=pixel&key=${index}`}
+                    />
+                  }
+                  title={<a href='https://ant.design'>{item.title}</a>}
+                  description='Ant Design, a design language for background applications, is refined by Ant UED Team'
+                />
+              </List.Item>
+            )}
+          />
+        </Card>
+      </div>
     </div>
+  );
+};
 
-  </div>
-}
-
-export default Dashboard
+export default Dashboard;
diff --git a/packages/canyon-platform/src/pages/project/[id]/commits/[sha].tsx b/packages/canyon-platform/src/pages/project/[id]/commits/[sha].tsx
@@ -18,21 +18,17 @@ const Sha = () => {
   const reportRef = useRef(null);
   useEffect(() => {
     if (reportRef.current && data) {
-      const report = init(
-        reportRef.current,
-        {
-          onSelectFile(path: string) {
-            return handleSelectFile({
-              filepath: path,
-              reportID: sprm.get('report_id') || '',
-              commitSha: prm.sha || '',
-              projectID: prm.id || '',
-            });
-          },
+      const report = init(reportRef.current, {
+        onSelectFile(path: string) {
+          return handleSelectFile({
+            filepath: path,
+            reportID: sprm.get('report_id') || '',
+            commitSha: prm.sha || '',
+            projectID: prm.id || '',
+          });
         },
-        [],
-      );
-      const summary = data.getCoverageSummaryMap.reduce((acc, cur) => {
+      });
+      const summary = data.getCoverageSummaryMap.reduce((acc: any, cur) => {
         acc[cur.path] = cur;
         return acc;
       }, {});

diff --git a/packages/canyon-platform/src/pages/project/[id]/commits/helper/index.ts b/packages/canyon-platform/src/pages/project/[id]/commits/helper/index.ts
@@ -9,7 +9,14 @@ function getDecode(str: string) {
       .join(''),
   );
 }
-export function handleSelectFile({ projectID, commitSha, filepath, reportID }) {
+
+interface HandleSelectFile {
+  projectID: string;
+  commitSha: string;
+  filepath: string;
+  reportID: string;
+}
+export function handleSelectFile({ projectID, commitSha, filepath, reportID }: HandleSelectFile) {
   const fileContentRequest = axios.post(
     `/graphql`,
     {

diff --git a/packages/canyon-platform/src/pages/project/[id]/overview.tsx b/packages/canyon-platform/src/pages/project/[id]/overview.tsx
@@ -1,22 +1,16 @@
 import { InfoCircleOutlined } from '@ant-design/icons';
 import { useQuery } from '@apollo/client';
-import {Divider, Space, Table, Tooltip} from 'antd';
-import { ColumnsType } from 'antd/es/table';
+import { Divider, Space, Table, Tooltip } from 'antd';
+// import { ColumnsType } from 'antd/es/table';
 import dayjs from 'dayjs';
 import ReactECharts from 'echarts-for-react';
 import { useParams } from 'react-router';
-// const { Text, Link } = Typography;
+import { useNavigate } from 'react-router-dom';
+
 import { GetProjectOverviewDocument } from '../../../helpers/backend/gen/graphql.ts';
-import {useNavigate} from "react-router-dom";
-function calculateSct(sct: { covered: number; total: number }) {
-  if (sct.total === 0) {
-    return '0%';
-  }
-  return `${Math.floor((sct.covered / sct.total) * 100)}%`;
-}
 const Xx = () => {
   const pam = useParams();
-  const nav =useNavigate()
+  const nav = useNavigate();
   const { data } = useQuery(GetProjectOverviewDocument, {
     variables: {
       projectID: pam['id'] as string,
@@ -59,11 +53,11 @@ const Xx = () => {
     ],
   };
 
-  const columns: ColumnsType<any>[] = [
+  const columns = [
     {
       title: 'Commit Sha',
       dataIndex: 'commitSha',
-      render(_: any, tableListItem) {
+      render(_: any) {
         return (
           <a
             onClick={() => {
@@ -96,14 +90,14 @@ const Xx = () => {
         </Space>
       ),
       dataIndex: 'commitSha',
-      render(_: any, tableListItem) {
+      render(_: any) {
         return <span>{_.slice(0, 7)}</span>;
       },
     },
     {
       title: 'Message',
       dataIndex: 'message',
-      render(_: any, tableListItem) {
+      render(_: any) {
         return (
           <div
             className={`max-w-[360px]
@@ -137,13 +131,13 @@ whitespace-nowrap`}
     {
       title: 'last_time_report',
       dataIndex: 'lastReportTime',
-      render(_) {
+      render(_: any) {
         return <span>{dayjs(_).format('YYYY-MM-DD HH:mm')}</span>;
       },
     },
     {
       title: 'operation',
-      render(_, tableListItem) {
+      render(_: any) {
         return (
           <div>
             <a