390 lines
12 KiB
TypeScript
390 lines
12 KiB
TypeScript
// Copyright (C) 2019 Intel Corporation. All rights reserved.
|
|
// SPDX-License-Identifier: Apache-2.0 WITH LLVM-exception
|
|
|
|
import {
|
|
Descriptions,
|
|
DatePicker,
|
|
Card,
|
|
Space,
|
|
Button,
|
|
Badge,
|
|
Divider,
|
|
Row,
|
|
Statistic,
|
|
Col,
|
|
Modal,
|
|
Form,
|
|
Input,
|
|
message,
|
|
Upload,
|
|
UploadFile
|
|
} from "antd";
|
|
import { useEffect, useState } from "react";
|
|
import moment from "moment";
|
|
import "antd/dist/antd.css";
|
|
import { UploadOutlined } from "@ant-design/icons";
|
|
import type { DatePickerProps, RangePickerProps } from "antd/es/date-picker";
|
|
const { TextArea } = Input;
|
|
interface DataType {
|
|
id: number;
|
|
branch: string;
|
|
build_args: string;
|
|
start_time: string;
|
|
end_time: string;
|
|
status: string;
|
|
repo: string;
|
|
data: any;
|
|
wamr_commit: string;
|
|
fuzz_time: number;
|
|
end_error: number;
|
|
error: number;
|
|
}
|
|
|
|
interface select_uuid {
|
|
res: Array<DataType>;
|
|
setId: any;
|
|
setResult: any;
|
|
}
|
|
const normFile = (e: any) => {
|
|
console.log("Upload event:", e);
|
|
if (Array.isArray(e)) {
|
|
return e;
|
|
}
|
|
return e?.fileList;
|
|
};
|
|
const Description = ({ res, setId, setResult }: select_uuid) => {
|
|
// const formRef = react
|
|
const range = (start: number, end: number) => {
|
|
const result = [];
|
|
for (let i = start; i < end; i++) {
|
|
result.push(i);
|
|
}
|
|
return result;
|
|
};
|
|
const [modalVisible, setModalVisible] = useState<boolean>(false);
|
|
const [modal2Visible, setModal2Visible] = useState<boolean>(false);
|
|
const [form] = Form.useForm();
|
|
// const [fileList, setFileList] = useState<UploadFile[]>([]);
|
|
const disabledDate: RangePickerProps["disabledDate"] = (current) => {
|
|
return current && current < moment().subtract(1, "day").endOf("day");
|
|
};
|
|
// let fileList: UploadFile[] = [];
|
|
var fileList: Array<string> = [];
|
|
const new_fuzzing = (repo: string, branch: string, fuzz_time: number, build_args: string) => {
|
|
fetch(import.meta.env.VITE_SERVER_URL + "/new_fuzzing", {
|
|
method: "POST",
|
|
headers: {
|
|
Accept: "application/json",
|
|
"Content-Type": "application/json"
|
|
},
|
|
|
|
body: JSON.stringify({
|
|
repo: repo,
|
|
branch: branch,
|
|
fuzz_time: fuzz_time,
|
|
build_args: build_args
|
|
})
|
|
})
|
|
.then((res) => {
|
|
return res.json();
|
|
})
|
|
.then((body) => {
|
|
if (body.status === 0) {
|
|
message.error(body.msg);
|
|
} else {
|
|
message.success("new fuzzing success");
|
|
}
|
|
});
|
|
};
|
|
return (
|
|
<>
|
|
<Row gutter={16}>
|
|
<Col span={5}>
|
|
<Button
|
|
type="primary"
|
|
style={{}}
|
|
onClick={() => {
|
|
setModalVisible(true);
|
|
}}
|
|
>
|
|
New fuzzing test
|
|
</Button>
|
|
</Col>
|
|
<> </>
|
|
<Col span={8}>
|
|
<Button
|
|
type="primary"
|
|
style={{}}
|
|
onClick={() => {
|
|
setModal2Visible(true);
|
|
}}
|
|
>
|
|
Upload Case
|
|
</Button>
|
|
</Col>
|
|
</Row>
|
|
<Modal
|
|
title="Write Comment and Assign"
|
|
centered
|
|
visible={modalVisible}
|
|
onOk={() => {
|
|
const fields_value = form.getFieldsValue(["repo", "branch", "end_time", "build_args"]);
|
|
let repo = fields_value.repo;
|
|
let branch = fields_value.branch;
|
|
let fuzz_time = fields_value.end_time;
|
|
const build_args = fields_value.build_args;
|
|
|
|
if (repo !== "" || branch !== "") {
|
|
repo =
|
|
repo === undefined
|
|
? "https://github.com/bytecodealliance/wasm-micro-runtime.git"
|
|
: repo;
|
|
branch = branch === undefined ? "main" : branch;
|
|
|
|
if (fuzz_time) {
|
|
const this_time = Date.parse(new Date().toString());
|
|
fuzz_time = Date.parse(fuzz_time);
|
|
if (fuzz_time > this_time) {
|
|
fuzz_time = (fuzz_time - this_time) / 1000;
|
|
} else {
|
|
fuzz_time = 1;
|
|
}
|
|
}
|
|
new_fuzzing(repo, branch, fuzz_time, build_args);
|
|
setModalVisible(false);
|
|
} else {
|
|
message.error("please enter repo and branch");
|
|
}
|
|
}}
|
|
onCancel={() => {
|
|
setModalVisible(false);
|
|
}}
|
|
>
|
|
<Form
|
|
form={form}
|
|
name="domain"
|
|
// autoComplete="off"
|
|
labelCol={{ span: 4 }}
|
|
wrapperCol={{ span: 24 }}
|
|
initialValues={{ remember: true }}
|
|
>
|
|
<Form.Item
|
|
label="repo"
|
|
name="repo"
|
|
rules={[{ required: true, message: "Please input your repo!" }]}
|
|
>
|
|
<TextArea
|
|
defaultValue="https://github.com/bytecodealliance/wasm-micro-runtime.git"
|
|
placeholder="Please enter repo"
|
|
/>
|
|
</Form.Item>
|
|
<Form.Item
|
|
label="branch"
|
|
name="branch"
|
|
rules={[{ required: true, message: "Please input your branch!" }]}
|
|
>
|
|
<Input defaultValue="main" placeholder="Please enter branch" />
|
|
</Form.Item>
|
|
<Form.Item label="end_time" name="end_time">
|
|
<DatePicker
|
|
format="YYYY-MM-DD HH:mm:ss"
|
|
disabledDate={disabledDate}
|
|
// disabledTime={disabledDateTime}
|
|
showTime={{ defaultValue: moment("00:00:00", "HH:mm:ss") }}
|
|
/>
|
|
</Form.Item>
|
|
<Form.Item label="build_args" name="build_args">
|
|
<Input placeholder="Please enter build_args" />
|
|
</Form.Item>
|
|
</Form>
|
|
</Modal>
|
|
<Modal
|
|
title="Upload Cases"
|
|
footer={[]}
|
|
onCancel={() => {
|
|
form.resetFields();
|
|
setModal2Visible(false);
|
|
}}
|
|
onOk={() => {
|
|
// console.log(123123, fileList);
|
|
form.resetFields();
|
|
setModal2Visible(false);
|
|
}}
|
|
visible={modal2Visible}
|
|
>
|
|
<Form
|
|
form={form}
|
|
name="upload"
|
|
// action={import.meta.env.VITE_SERVER_URL + "/uplad_case"}
|
|
// method="post"
|
|
// encType="multipart/form-data"
|
|
autoComplete="off"
|
|
labelCol={{ span: 4 }}
|
|
wrapperCol={{ span: 24 }}
|
|
initialValues={{ remember: true }}
|
|
>
|
|
<Form.Item
|
|
name="upload"
|
|
label="upload"
|
|
valuePropName="fileList"
|
|
getValueFromEvent={normFile}
|
|
>
|
|
{/* <input type="file" /> */}
|
|
<Upload
|
|
name="file"
|
|
listType="picture"
|
|
action={import.meta.env.VITE_SERVER_URL + "/upload_case"}
|
|
// action=""
|
|
// fileList={fileList}
|
|
beforeUpload={(file) => {
|
|
return new Promise((resolve, reject) => {
|
|
let fileName = file.name;
|
|
const file_config = fileName.split(".");
|
|
if (file_config[file_config.length - 1] !== "wasm") {
|
|
message.error("Wrong file type");
|
|
return reject(false);
|
|
}
|
|
return resolve(true);
|
|
});
|
|
}}
|
|
onRemove={(file) => {
|
|
// import.meta.env.VITE_SERVER_URL + "/remove_case"
|
|
// console.log(file.name);
|
|
fetch(import.meta.env.VITE_SERVER_URL + "/remove_case", {
|
|
method: "POST",
|
|
headers: {
|
|
"Content-Type": "application/json"
|
|
},
|
|
|
|
body: JSON.stringify({
|
|
filename: file.name
|
|
})
|
|
});
|
|
}}
|
|
>
|
|
<Button icon={<UploadOutlined />}>Click to upload</Button>
|
|
</Upload>
|
|
</Form.Item>
|
|
</Form>
|
|
</Modal>
|
|
<br />
|
|
<Space
|
|
direction="vertical"
|
|
size="middle"
|
|
style={{
|
|
display: "flex",
|
|
height: document.body.clientHeight - 210,
|
|
overflow: "auto"
|
|
}}
|
|
>
|
|
{Object.keys(res).map((r: any) => (
|
|
<Card
|
|
type="inner"
|
|
title={res[r].repo + ": " + res[r].branch}
|
|
style={{
|
|
width: "99.9%",
|
|
textAlign: "left",
|
|
borderRadius: "10px",
|
|
overflow: "hidden"
|
|
}}
|
|
headStyle={{ backgroundColor: "#87CEFAB7" }}
|
|
>
|
|
<Descriptions
|
|
size="default"
|
|
column={2}
|
|
// title={"pid: " + (res[r].data?.pid ? res[r].data?.pid : "")}
|
|
extra={
|
|
Number(res[r].status) === 2 ? (
|
|
res[r].data?.error ? (
|
|
<Badge status="error" text={res[r].data?.error} />
|
|
) : (
|
|
<Badge status="processing" text="to be operated" />
|
|
)
|
|
) : Number(res[r].status) === 1 ? (
|
|
<Badge status="processing" text="Running" />
|
|
) : (
|
|
<Badge status="default" text="End" />
|
|
)
|
|
}
|
|
>
|
|
<Descriptions.Item label="Start time">{res[r].start_time}</Descriptions.Item>
|
|
<Descriptions.Item label="End time">{res[r].end_time}</Descriptions.Item>
|
|
<Descriptions.Item label="Build args">{res[r].build_args}</Descriptions.Item>
|
|
<Descriptions.Item label="WAMR commit">
|
|
<a
|
|
href={`https://github.com/bytecodealliance/wasm-micro-runtime/commit/${res[r]?.wamr_commit}`}
|
|
>
|
|
{res[r]?.wamr_commit}
|
|
</a>
|
|
</Descriptions.Item>
|
|
|
|
<Descriptions.Item label="">
|
|
<Row gutter={24}>
|
|
<Col span={10}>
|
|
<Button
|
|
type="primary"
|
|
onClick={() => {
|
|
setId(res[r].id);
|
|
setResult(res[r]);
|
|
}}
|
|
>
|
|
Detail
|
|
</Button>
|
|
</Col>
|
|
<Col span={10}>
|
|
<Button
|
|
disabled={Number(res[r].status) !== 1}
|
|
type="primary"
|
|
danger
|
|
onClick={() => {
|
|
fetch(import.meta.env.VITE_SERVER_URL + "/end_fuzzing", {
|
|
method: "POST",
|
|
headers: {
|
|
Accept: "application/json",
|
|
"Content-Type": "application/json"
|
|
},
|
|
|
|
body: JSON.stringify({
|
|
id: res[r].id
|
|
})
|
|
})
|
|
.then((res) => {
|
|
return res.json();
|
|
})
|
|
.then((body) => {
|
|
if (body.status === 0) {
|
|
message.error(body.msg);
|
|
} else {
|
|
message.success("Stop fuzzing success");
|
|
}
|
|
});
|
|
}}
|
|
>
|
|
Stop
|
|
</Button>
|
|
</Col>
|
|
</Row>
|
|
</Descriptions.Item>
|
|
</Descriptions>
|
|
<Divider />
|
|
|
|
<Row gutter={24}>
|
|
<Col span={6}>
|
|
<Statistic title="Total Error" value={res[r].error + res[r].end_error} />
|
|
</Col>
|
|
<Col span={6}>
|
|
<Statistic title="Fixed" value={res[r].end_error} />
|
|
</Col>
|
|
<Col span={8}>
|
|
<Statistic title="Remaining Errors" value={res[r].error} />
|
|
</Col>
|
|
</Row>
|
|
</Card>
|
|
))}
|
|
</Space>
|
|
</>
|
|
);
|
|
};
|
|
|
|
export default Description;
|