95 lines
2.4 KiB
JavaScript
95 lines
2.4 KiB
JavaScript
import React, { useState, useContext } from "react";
|
|
import moment from "moment";
|
|
import StoreContext from "@qltr/store";
|
|
|
|
import Accordion from "@mui/material/Accordion";
|
|
import AccordionSummary from "@mui/material/AccordionSummary";
|
|
import Typography from "@mui/material/Typography";
|
|
|
|
import IconButton from "@mui/material/IconButton";
|
|
import DeleteIcon from "@mui/icons-material/Delete";
|
|
import EditIcon from "@mui/icons-material/Edit";
|
|
import Stack from "@mui/material/Stack";
|
|
|
|
export default function SilencingBox(props) {
|
|
const { silenceEntry, editSilence, removeSilence } = props;
|
|
|
|
const {
|
|
name: testName,
|
|
method: testMethod,
|
|
class: testClass,
|
|
id: silenceId,
|
|
expires,
|
|
} = silenceEntry;
|
|
|
|
const { state: store, updateStore } = useContext(StoreContext);
|
|
|
|
function Actions() {
|
|
return (
|
|
<React.Fragment>
|
|
<IconButton
|
|
aria-label="modify"
|
|
component="span"
|
|
color="primary"
|
|
onClick={editSilence}
|
|
>
|
|
<EditIcon />
|
|
</IconButton>
|
|
<IconButton
|
|
color="error"
|
|
aria-label="delete"
|
|
component="span"
|
|
onClick={removeSilence}
|
|
>
|
|
<DeleteIcon />
|
|
</IconButton>
|
|
</React.Fragment>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<Accordion expanded={false} disableGutters={true} square>
|
|
<AccordionSummary
|
|
style={{
|
|
backgroundColor: "rgba(0, 0, 0, .03)",
|
|
flexWrap: "wrap",
|
|
}}
|
|
>
|
|
<Typography component={"span"} style={{ wordBreak: "break-word" }}>
|
|
{`Test Name: ${testName}`}
|
|
<br />
|
|
{`Method: ${testMethod}`}
|
|
<br />
|
|
{`Test Class: ${testClass}`}
|
|
<br />
|
|
{`Silenced Until: ${expires} Remaining Time: ${moment(
|
|
moment(expires).diff(moment())
|
|
).format("HH:mm")}`}
|
|
</Typography>
|
|
|
|
<Stack
|
|
sx={{
|
|
ml: "auto",
|
|
mb: "auto",
|
|
mt: "auto",
|
|
whiteSpace: "nowrap",
|
|
display: { md: "none", lg: "none", xl: "none" },
|
|
}}
|
|
>
|
|
<Actions />
|
|
</Stack>
|
|
<Stack
|
|
direction="row"
|
|
sx={{
|
|
ml: "auto",
|
|
mb: "auto",
|
|
mt: "auto",
|
|
display: { xs: "none", sm: "none", md: "block", lg: "block" },
|
|
}}
|
|
>
|
|
<Actions />
|
|
</Stack>
|
|
</AccordionSummary>
|
|
</Accordion>
|
|
);
|
|
}
|