CEC-1216 Remove unused components (#129)

* CEC-1216 Remove unused components

* Remove import
This commit is contained in:
John Wu
2022-03-21 17:21:59 -07:00
committed by GitHub
parent 2e113830a5
commit 4daf171b1e
7 changed files with 6 additions and 527 deletions

View File

@@ -5374,23 +5374,7 @@ exports[`App Route /packages authenticated 1`] = `
> >
<div <div
class="MuiGrid-root makeStyles-textJustifyAlign-1187 MuiGrid-item MuiGrid-grid-md-4" class="MuiGrid-root makeStyles-textJustifyAlign-1187 MuiGrid-item MuiGrid-grid-md-4"
>
<a
class="makeStyles-labelInline-1147"
href="/package-create"
>
<svg
aria-hidden="true"
class="MuiSvgIcon-root MuiSvgIcon-fontSizeLarge"
focusable="false"
viewBox="0 0 24 24"
>
<path
d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm5 11h-4v4h-2v-4H7v-2h4V7h2v4h4v2z"
/> />
</svg>
</a>
</div>
<div <div
class="MuiGrid-root makeStyles-textCenterAlign-1188 MuiGrid-item MuiGrid-grid-md-4" class="MuiGrid-root makeStyles-textCenterAlign-1188 MuiGrid-item MuiGrid-grid-md-4"
> >

View File

@@ -1,159 +0,0 @@
import React, { useEffect, useState } from "react";
import {
Table,
TableBody,
TableCell,
TableFooter,
TablePagination,
TableRow,
} from "@material-ui/core";
import clsx from "clsx";
import { LocalDateTimeString } from "../../../utils/dates";
import TableHeaderSortable from "../../Table/HeaderSortable";
import { useVehicleContext } from "../../Contexts/VehicleContext";
import { useStatusContext } from "../../Contexts/StatusContext";
import useStyles from "../../useStyles";
import { logger } from "../../../services/monitoring";
const tableColumns = [
{
id: "ecu",
label: "ECU",
},
{
id: "version",
label: "SW Version",
},
{
id: "hw_version",
label: "HW Version",
},
{
id: "mode",
label: "Flash Mode",
},
{
id: "self_download",
label: "Flash Mode",
},
{
id: "created_at",
label: "Created",
},
{
id: "updated_at",
label: "Updated",
},
];
const CarECUs = ({ vin, token }) => {
const [ecus, setECUs] = useState([]);
const [total, setTotal] = useState(0);
const classes = useStyles();
const [pageSize, setPageSize] = useState(10);
const [pageIndex, setPageIndex] = useState(0);
const [orderBy, setOrderBy] = useState("ecu");
const [order, setOrder] = useState("desc");
const { getECUs } = useVehicleContext();
const { setMessage } = useStatusContext();
useEffect(() => {
(async () => {
try {
if (!vin || !token) return;
const result = await getECUs(
{
vin,
limit: pageSize,
offset: pageSize * pageIndex,
order: `${orderBy} ${order}`,
},
token
);
setECUs(result.data);
if (result.total > -1) setTotal(result.total);
} catch (e) {
setMessage(e.message);
logger.warn(e.stack);
}
})();
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [vin, token, pageIndex, pageSize, orderBy, order]);
const handleChangePageIndex = (event, newIndex) => {
setPageIndex(newIndex);
};
const handleChangePageSize = (event) => {
setPageSize(parseInt(event.target.value, 10));
setPageIndex(0);
};
const handleSort = (event, property) => {
try {
if (property === orderBy) {
if (order === "asc") {
setOrder("desc");
} else {
setOrder("asc");
}
} else {
setOrderBy(property);
setOrder("asc");
}
} catch (e) {
logger.warn(e.stack);
}
};
return (
<div className={clsx(classes.paper, classes.tableSize)}>
<Table>
<TableHeaderSortable
classes={classes}
orderBy={orderBy}
order={order}
columnData={tableColumns}
onSortRequest={handleSort}
/>
<TableBody>
{ecus.map((row) => (
<TableRow key={row.ecu}>
<TableCell align="center">{row.ecu}</TableCell>
<TableCell align="center">{row.version}</TableCell>
<TableCell align="center">{row.hw_version}</TableCell>
<TableCell align="center">{row.mode}</TableCell>
<TableCell align="center">{row.self_download}</TableCell>
<TableCell align="center">
{LocalDateTimeString(row.created)}
</TableCell>
<TableCell align="center">
{LocalDateTimeString(row.updated)}
</TableCell>
</TableRow>
))}
</TableBody>
<TableFooter>
<TableRow>
<TablePagination
rowsPerPageOptions={[5, 10, 25, 100]}
colSpan={10}
count={total}
rowsPerPage={pageSize}
page={pageIndex}
SelectProps={{
inputProps: { "aria-label": "rows per page" },
native: true,
}}
onPageChange={handleChangePageIndex}
onRowsPerPageChange={handleChangePageSize}
/>
</TableRow>
</TableFooter>
</Table>
</div>
);
};
export default CarECUs;

View File

@@ -1,159 +0,0 @@
import React, { useEffect, useState } from "react";
import {
Table,
TableBody,
TableCell,
TableFooter,
TablePagination,
TableRow,
} from "@material-ui/core";
import { LocalDateTimeString } from "../../../utils/dates";
import TableHeaderSortable from "../../Table/HeaderSortable";
import {
UpdatesProvider,
useUpdatesContext,
} from "../../Contexts/UpdatesContext";
import { useStatusContext } from "../../Contexts/StatusContext";
import useStyles from "../../useStyles";
import { logger } from "../../../services/monitoring";
const tableColumns = [
{
id: "id",
label: "ID",
},
{
id: "update_package_id",
label: "Name",
},
{
id: "status",
label: "Status",
},
{
id: "created_at",
label: "Created",
},
{
id: "updated_at",
label: "Updated",
},
];
const MainForm = ({ vin, token }) => {
const classes = useStyles();
const [pageSize, setPageSize] = useState(10);
const [pageIndex, setPageIndex] = useState(0);
const [orderBy, setOrderBy] = useState("id");
const [order, setOrder] = useState("desc");
const { getCarUpdates, carUpdates, totalCarUpdates } = useUpdatesContext();
const { setMessage } = useStatusContext();
useEffect(() => {
(async () => {
try {
if (!vin || !token) return;
await getCarUpdates(
{
vin,
limit: pageSize,
offset: pageSize * pageIndex,
order: `${orderBy} ${order}`,
},
token
);
} catch (e) {
setMessage(e.message);
logger.warn(e.stack);
}
})();
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [vin, token, pageIndex, pageSize, orderBy, order]);
const handleChangePageIndex = (event, newIndex) => {
setPageIndex(newIndex);
};
const handleChangePageSize = (event) => {
setPageSize(parseInt(event.target.value, 10));
setPageIndex(0);
};
const handleSort = (event, property) => {
try {
if (property === orderBy) {
if (order === "asc") {
setOrder("desc");
} else {
setOrder("asc");
}
} else {
setOrderBy(property);
setOrder("asc");
}
} catch (e) {
logger.warn(e.stack);
}
};
const updateName = (row) => {
if (row.updatepackage)
return `${row.updatepackage.package_name} ${row.updatepackage.version}`;
if (row.updatemanifest)
return `${row.updatemanifest.name} ${row.updatemanifest.version}`;
return "None";
};
return (
<Table>
<TableHeaderSortable
classes={classes}
orderBy={orderBy}
order={order}
columnData={tableColumns}
onSortRequest={handleSort}
/>
<TableBody>
{carUpdates.map((row) => (
<TableRow key={row.id}>
<TableCell align="center">{row.id}</TableCell>
<TableCell align="center">{updateName(row)}</TableCell>
<TableCell align="center">{row.status}</TableCell>
<TableCell align="center">
{LocalDateTimeString(row.created)}
</TableCell>
<TableCell align="center">
{LocalDateTimeString(row.updated)}
</TableCell>
</TableRow>
))}
</TableBody>
<TableFooter>
<TableRow>
<TablePagination
rowsPerPageOptions={[5, 10, 25, 100]}
colSpan={5}
count={totalCarUpdates}
rowsPerPage={pageSize}
page={pageIndex}
SelectProps={{
inputProps: { "aria-label": "rows per page" },
native: true,
}}
onPageChange={handleChangePageIndex}
onRowsPerPageChange={handleChangePageSize}
/>
</TableRow>
</TableFooter>
</Table>
);
};
const CarUpdates = (props) => (
<UpdatesProvider>
<MainForm {...props} />
</UpdatesProvider>
);
export default CarUpdates;

View File

@@ -1,91 +0,0 @@
import React, { useEffect, useState } from "react";
import {
Backdrop,
Modal,
Fade,
Table,
TableHead,
TableRow,
TableCell,
TableBody,
} from "@material-ui/core";
import useStyles from "../../useStyles";
import { useUpdatesContext } from "../../Contexts/UpdatesContext";
import { useUserContext } from "../../Contexts/UserContext";
import { useStatusContext } from "../../Contexts/StatusContext";
import { LocalDateTimeString } from "../../../utils/dates";
export default function CarStatusModal(props) {
const classes = useStyles();
const [updates, setUpdates] = useState([]);
const { setMessage } = useStatusContext();
const { getVINUpdates } = useUpdatesContext();
const {
token: {
idToken: { jwtToken: token },
},
} = useUserContext();
useEffect(() => {
(async () => {
try {
if (!props.vin) return;
const result = await getVINUpdates(props.vin, token);
if (result.error) {
throw new Error(`Get VIN updates error. ${result.message}`);
} else {
setUpdates(result.data);
}
} catch (e) {
setMessage(e.message);
}
})();
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [props.vin]);
return (
<div>
<Modal
aria-labelledby="transition-modal-title"
aria-describedby="transition-modal-description"
className={classes.modal}
open={props.vin !== null && props.vin !== undefined}
onClose={props.handleClose}
BackdropComponent={Backdrop}
BackdropProps={{
timeout: 500,
}}
>
<Fade in={props.vin}>
<div className={classes.modaldialog}>
<h2 id="transition-modal-title">{props.vin} Updates</h2>
<Table>
<TableHead>
<TableRow>
<TableCell align="center">Date</TableCell>
<TableCell align="center">Update</TableCell>
<TableCell align="center">Status</TableCell>
<TableCell align="center">Updated</TableCell>
</TableRow>
</TableHead>
<TableBody>
{updates.map((update) => (
<TableRow key={update.id}>
<TableCell align="center">
{LocalDateTimeString(update.created)}
</TableCell>
<TableCell align="center">{`${update.updatepackage.package_name} ${update.updatepackage.version}`}</TableCell>
<TableCell align="center">{update.status}</TableCell>
<TableCell align="center">
{LocalDateTimeString(update.updated)}
</TableCell>
</TableRow>
))}
</TableBody>
</Table>
</div>
</Fade>
</Modal>
</div>
);
}

View File

@@ -1,34 +0,0 @@
import React from "react";
import { Select } from "@material-ui/core";
const ManifestECUFlashModes = (props) => {
const changeHandler = (e) => {
if (!props.changeHandler) return;
props.changeHandler(e);
};
return (
<Select
id={props.id}
native
variant="outlined"
value={props.value}
onChange={changeHandler}
>
{FlashModeTypes.map((item, index) => (
<option key={index} value={item[0]}>
{item[1]}
</option>
))}
</Select>
);
};
export default ManifestECUFlashModes;
const FlashModeTypes = [
["A", "Mode A"],
["D", "Mode D"],
["SELF", "Self"],
];

View File

@@ -10,7 +10,6 @@ import {
TableRow, TableRow,
Tooltip, Tooltip,
} from "@material-ui/core"; } from "@material-ui/core";
import AddCircleIcon from "@material-ui/icons/AddCircle";
import SendIcon from "@material-ui/icons/Send"; import SendIcon from "@material-ui/icons/Send";
import VisibilityIcon from "@material-ui/icons/Visibility"; import VisibilityIcon from "@material-ui/icons/Visibility";
import DeleteIcon from "@material-ui/icons/Delete"; import DeleteIcon from "@material-ui/icons/Delete";
@@ -150,15 +149,15 @@ const MainForm = () => {
actions.push({ actions.push({
tip: `Deploy "${row.name} ${row.version}"`, tip: `Deploy "${row.name} ${row.version}"`,
link: `/package-deploy/${row.id}`, link: `/package-deploy/${row.id}`,
icon: <SendIcon aria-label={`Deploy ${row.name} ${row.version}`} /> icon: <SendIcon aria-label={`Deploy ${row.name} ${row.version}`} />,
}) });
} }
if (hasRole([Roles.DELETE], groups)) { if (hasRole([Roles.DELETE], groups)) {
actions.push({ actions.push({
tip: `Delete "${row.name} ${row.version}"`, tip: `Delete "${row.name} ${row.version}"`,
id: row.id, id: row.id,
icon: <DeleteIcon aria-label={`Delete ${row.name} ${row.version}`} /> icon: <DeleteIcon aria-label={`Delete ${row.name} ${row.version}`} />,
}) });
} }
if (actions.length === 0) return ["No actions"]; if (actions.length === 0) return ["No actions"];
@@ -186,11 +185,7 @@ const MainForm = () => {
return ( return (
<div className={clsx(classes.paper, classes.tableSize)}> <div className={clsx(classes.paper, classes.tableSize)}>
<Grid container className={classes.root} spacing={2}> <Grid container className={classes.root} spacing={2}>
<Grid item md={4} className={classes.textJustifyAlign}> <Grid item md={4} className={classes.textJustifyAlign}></Grid>
<Link to="/package-create" className={classes.labelInline}>
<AddCircleIcon fontSize="large" />
</Link>
</Grid>
<Grid item md={4} className={classes.textCenterAlign}> <Grid item md={4} className={classes.textCenterAlign}>
<SearchField classes={classes} onSearch={handleSearch} /> <SearchField classes={classes} onSearch={handleSearch} />
</Grid> </Grid>

View File

@@ -1,57 +0,0 @@
import React from "react";
import Modal from "@material-ui/core/Modal";
import { Button, LinearProgress } from "@material-ui/core";
import { useFileUploadContext } from "../Contexts/FileUploadContext";
const getModalStyle = () => {
const top = 30;
const left = 50;
return {
width: `350px`,
top: `${top}%`,
left: `${left}%`,
transform: `translate(-${left}%, -${top}%)`,
backgroundColor: `white`,
border: `none`,
position: `absolute`,
margin: `1em`,
padding: `1em`,
textAlign: `center`,
};
};
const ModalProgressBar = () => {
const {
uploading,
progress,
status,
linkURL,
cancel,
} = useFileUploadContext();
const modalStyle = getModalStyle();
const onClickCancel = cancel;
return (
<Modal open={uploading}>
<div style={modalStyle}>
{status && <p>{status}</p>}
{linkURL && (
<p>
<a href={linkURL} target="_blank" rel="noreferrer">
View
</a>
</p>
)}
<LinearProgress variant="determinate" value={progress} />
<Button onClick={onClickCancel}>
{progress === 100 || progress === -1 ? "Done" : "Cancel"}
</Button>
</div>
</Modal>
);
};
export default ModalProgressBar;