diff --git a/src/components/ItemBodyView/ItemBodyView.js b/src/components/ItemBodyView/ItemBodyView.js index 19e48fb..4e5edce 100644 --- a/src/components/ItemBodyView/ItemBodyView.js +++ b/src/components/ItemBodyView/ItemBodyView.js @@ -1,11 +1,12 @@ import React from "react"; import PropTypes from "prop-types"; import { Timeline, TimelineItem, TimelineSeparator, TimelineConnector, TimelineContent, TimelineDot } from '@material-ui/lab'; -import { Typography, makeStyles } from "@material-ui/core"; +import { makeStyles } from "@material-ui/core"; import DirectoryInformation from "../DirectoryInformation/"; import Assignment from "../Assignment/"; import TimelineActionCard from "../TimelineActionCard/"; import MessageView from "../MessageView/"; +import ParseError from "../ParseError/"; import { objectIsEmpty } from "../../utilities"; export default function ItemBodyView({ item }) { @@ -31,42 +32,23 @@ export default function ItemBodyView({ item }) { const generateTimelineItem = (section) => { switch (section.type) { case "directory_information": - return ( - - ); + return case "initial_message": - return ( - <> - - - ); + return case "edit": - return ( - - ); + return case "status": - return ( - <> - - {`${section.by} update the status to at ${Date(section.datetime)}`} - - {section.content.map((line) => {line})} - - ); + return case "assignment": - return ( - - ); + return case "reply_to_user": - return ( - - ); + return case "reply_from_user": - return ( - - ); + return + case "parse_error": + return default: - return "No Match Found"; + return `No match found for type: ${section.type}`; }; }; diff --git a/src/components/ParseError/ParseError.js b/src/components/ParseError/ParseError.js new file mode 100644 index 0000000..28dd626 --- /dev/null +++ b/src/components/ParseError/ParseError.js @@ -0,0 +1,61 @@ +import React from "react"; +import PropTypes from "prop-types"; +import { Typography, Paper, makeStyles, useTheme } from '@material-ui/core'; +import clsx from "clsx"; + +export default function ParseError({ file_path, expected, got, line_num }){ + + const theme = useTheme(); + + const useStyles = makeStyles({ + "Paper-root": { + overflow: "hidden" + }, + "headerColor": { + backgroundColor: theme.palette.parse_error.main + }, + "padding": { + padding: theme.spacing(1) + } + + }); + const classes = useStyles(); + + return( + +
+ + Parsing Error + +
+
+ + File Path: {file_path} + + + Line: {line_num} + + + Expected: {expected} + + + Got: {got} + +
+
+ ); +} + +ParseError.propTypes = { + "file_path": PropTypes.string, + "expected": PropTypes.string, + "got": PropTypes.string, + "line_num": PropTypes.number +}; + +ParseError.defaultProps = { + "file_path": "", + "expected": "", + "got": "", + "line_num": "" +}; \ No newline at end of file diff --git a/src/components/ParseError/ParseError.md b/src/components/ParseError/ParseError.md new file mode 100644 index 0000000..98b58a2 --- /dev/null +++ b/src/components/ParseError/ParseError.md @@ -0,0 +1,36 @@ +Displays a parsing error. + +--- + +```jsx +import { ThemeProvider } from "@material-ui/core/styles"; +import webqueue2Theme from "../../theme"; +import ParseError from "./ParseError"; + +const theme = webqueue2Theme(false); + +const demo_data = { + "type": "parse_error", + "datetime": "2020-10-23T00:45:32", + "file_path": "/home/pier/e/campb303/webqueue2/q-snapshot/ce/32", + "expected": "Did not encounter a reply-from-user ending delimiter", + "got": "765-869-4032 to assist please?\tThank you\n", + "line_num": 120 +}; + + + +``` +```jsx static + +``` \ No newline at end of file diff --git a/src/components/ParseError/index.js b/src/components/ParseError/index.js new file mode 100644 index 0000000..8a5ec40 --- /dev/null +++ b/src/components/ParseError/index.js @@ -0,0 +1 @@ +export { default } from "./ParseError"; \ No newline at end of file diff --git a/src/components/TimelineActionCard/TimelineActionCard.js b/src/components/TimelineActionCard/TimelineActionCard.js index 431cd3e..1137b19 100644 --- a/src/components/TimelineActionCard/TimelineActionCard.js +++ b/src/components/TimelineActionCard/TimelineActionCard.js @@ -16,6 +16,10 @@ export default function TimelineActionCard({ type, datetime, by, content }){ "reply_to_user": { "verbage": "replied", "coloring": theme.palette.reply_to_user.main + }, + "status": { + "verbage": "updated the status", + "coloring": theme.palette.status.main } } @@ -54,9 +58,9 @@ TimelineActionCard.propTypes = { ]), /** ISO 8601 formatted time string. */ "datetime": PropTypes.string.isRequired, - /** The name of the person who added the edit. */ + /** The name of the person who added the action. */ "by": PropTypes.string.isRequired, - /** An array of strings containing the content of the edit. */ + /** An array of strings containing the content of the action. */ "content": PropTypes.array.isRequired }; diff --git a/src/theme.js b/src/theme.js index 685626a..52c59bd 100644 --- a/src/theme.js +++ b/src/theme.js @@ -26,8 +26,11 @@ export default function theme(darkMode = false) { "reply_to_user": { main: "rgba(99, 125, 255, 0.2)", }, - "reply_from_user": { + "status": { main: "rgba(99, 255, 151, 0.2)", + }, + "parse_error": { + main: "rgba(255, 99, 204, 0.2)", } }, })