Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

SSVC Priorityに基づく脆弱性情報UIのモック作成 #431

Draft
wants to merge 1 commit into
base: main
Choose a base branch
from
Draft

SSVC Priorityに基づく脆弱性情報UIのモック作成 #431

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
10 changes: 10 additions & 0 deletions web/src/components/Drawer.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ import {
Home as HomeIcon,
Topic as TopicIcon,
} from "@mui/icons-material";
import StarIcon from "@mui/icons-material/Star";
import {
Drawer as MuiDrawer,
List,
Expand Down Expand Up @@ -111,6 +112,15 @@ export function Drawer() {
)}
{system.teamMode === "ateam" && (
<>
<StyledListItemButton
onClick={() => navigate("/SSVCPriority")}
selected={location.pathname === "/SSVCPriority"}
>
<StyledListItemIcon>
<StarIcon />
</StyledListItemIcon>
<ListItemText>SSVC Priority</ListItemText>
</StyledListItemButton>
<StyledListItemButton
onClick={() => navigate("/analysis?" + queryParams)}
selected={location.pathname === "/analysis"}
Expand Down
4 changes: 4 additions & 0 deletions web/src/index.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,7 @@ import {
ATeam,
Login,
ResetPassword,
SSVCPriority,
Status,
Tag,
TopicDetail,
Expand Down Expand Up @@ -63,6 +64,9 @@ root.render(
<Route path=":tagId" element={<Tag />} />
</Route>
<Route path="*" element={<Navigate to="/" />} />
<Route path="SSVCPriority">
<Route index element={<SSVCPriority />} />
</Route>
<Route path="analysis">
<Route index element={<Analysis />} />
</Route>
Expand Down
2 changes: 1 addition & 1 deletion web/src/pages/App.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -66,7 +66,7 @@ export function App() {
useEffect(() => {
if (!userMe || userMeIsFetching) return;
const params = new URLSearchParams(location.search);
if (["/analysis", "/ateam"].includes(location.pathname)) {
if (["/SSVCPriority", "/analysis", "/ateam"].includes(location.pathname)) {
dispatch(setTeamMode("ateam"));
if (!userMe.ateams.length > 0) {
dispatch(setATeamId(undefined));
Expand Down
146 changes: 146 additions & 0 deletions web/src/pages/SSVCPriority.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,146 @@
import SortIcon from "@mui/icons-material/Sort";
import {
Box,
Card,
CardHeader,
Divider,
Grid,
IconButton,
List,
ListItemButton,
ListItemText,
Typography,
} from "@mui/material";
import { amber, grey, orange, red } from "@mui/material/colors";
import React, { useEffect } from "react";
import { useDispatch, useSelector } from "react-redux";

import { ATeamLabel } from "../components/ATeamLabel";
import { getATeam } from "../slices/ateam";

export function SSVCPriority() {
const SSVCPriorityList = [
{ title: "Immediate", color: red[600] },
{ title: "Out-of-Cycle", color: orange[600] },
{ title: "Scheduled", color: amber[600] },
{ title: "Defer", color: grey[600] },
];
const ateam = useSelector((state) => state.ateam.ateam);
const ateamId = useSelector((state) => state.ateam.ateamId);
const dispatch = useDispatch();

useEffect(() => {
if (!ateam) dispatch(getATeam(ateamId));
}, [dispatch, ateamId, ateam]);

if (!ateam) return <></>;

return (
<Box
sx={{
height: "calc(100vh - 96px)",
display: "flex",
flexDirection: "column",
}}
>
<Box sx={{ flex: 0 }}>
<ATeamLabel ateam={ateam} />
</Box>
<Grid container spacing={1} sx={{ flex: 1 }}>
{SSVCPriorityList.map((item) => (
<Grid key={item.title} item xs={3} sx={{ height: "100%" }}>
<Card sx={{ display: "flex", flexDirection: "column", height: "100%" }}>
<Box sx={{ flex: 0 }}>
<CardHeader
title={item.title}
sx={{
backgroundColor: item.color,
color: "white",
textWrap: "nowrap",
}}
/>
<Box
sx={{
display: "flex",
justifyContent: "space-between",
alignItems: "center",
px: 2,
}}
>
<Typography
variant="subtitle1"
sx={{ color: "text.secondary", textWrap: "nowrap", overflow: "hidden" }}
>
999999 tickets
</Typography>
<IconButton>
<SortIcon />
</IconButton>
</Box>
<Divider />
</Box>
<Box
sx={{
flexGrow: 1,
flexBasis: 0,
overflowY: "auto",
}}
>
<List
sx={{
p: 0,
}}
>
{[...Array(20)].map((_, i) => (
<React.Fragment key={i}>
<ListItemButton
sx={{
height: 152,
}}
>
<ListItemText
primary={
<Typography
variant="subtitle2"
sx={{
fontWeight: "bold",
display: "-webkit-box",
"-webkit-box-orient": "vertical",
"-webkit-line-clamp": "2",
overflow: "hidden",
maxHeight: 44,
}}
>
sqlparse: parsing heavily nested list leads to denial of service
</Typography>
}
secondary={
<>
<Typography component="div" variant="caption" noWrap>
Team: team_name
</Typography>
<Typography component="div" variant="caption" noWrap>
Status: Alerted
</Typography>
<Typography component="div" variant="caption" noWrap>
Service: service_name
</Typography>
<Typography component="div" variant="caption" noWrap>
Assignees: [email protected]
</Typography>
</>
}
/>
</ListItemButton>
<Divider />
</React.Fragment>
))}
</List>
</Box>
</Card>
</Grid>
))}
</Grid>
</Box>
);
}
2 changes: 2 additions & 0 deletions web/src/pages/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@ import { App } from "./App";
import { Login } from "./Login";
import { PTeam } from "./PTeam";
import { ResetPassword } from "./ResetPassword";
import { SSVCPriority } from "./SSVCPriority";
import { Status } from "./Status";
import { Tag } from "./Tag";
import { TopicDetail } from "./TopicDetail";
Expand All @@ -24,6 +25,7 @@ export {
Login,
PTeam,
ResetPassword,
SSVCPriority,
Status,
Tag,
TopicDetail,
Expand Down