aboutsummaryrefslogtreecommitdiffstats
path: root/webui/src/bug/Timeline.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'webui/src/bug/Timeline.tsx')
-rw-r--r--webui/src/bug/Timeline.tsx48
1 files changed, 48 insertions, 0 deletions
diff --git a/webui/src/bug/Timeline.tsx b/webui/src/bug/Timeline.tsx
new file mode 100644
index 00000000..ba0f9fc7
--- /dev/null
+++ b/webui/src/bug/Timeline.tsx
@@ -0,0 +1,48 @@
+import { makeStyles } from '@material-ui/core/styles';
+import React from 'react';
+
+import LabelChange from './LabelChange';
+import Message from './Message';
+import SetStatus from './SetStatus';
+import SetTitle from './SetTitle';
+import { TimelineItemFragment } from './TimelineQuery.generated';
+
+const useStyles = makeStyles(theme => ({
+ main: {
+ '& > *:not(:last-child)': {
+ marginBottom: theme.spacing(2),
+ },
+ },
+}));
+
+type Props = {
+ ops: Array<TimelineItemFragment>;
+};
+
+function Timeline({ ops }: Props) {
+ const classes = useStyles();
+
+ return (
+ <div className={classes.main}>
+ {ops.map((op, index) => {
+ switch (op.__typename) {
+ case 'CreateTimelineItem':
+ return <Message key={index} op={op} />;
+ case 'AddCommentTimelineItem':
+ return <Message key={index} op={op} />;
+ case 'LabelChangeTimelineItem':
+ return <LabelChange key={index} op={op} />;
+ case 'SetTitleTimelineItem':
+ return <SetTitle key={index} op={op} />;
+ case 'SetStatusTimelineItem':
+ return <SetStatus key={index} op={op} />;
+ }
+
+ console.warn('unsupported operation type ' + op.__typename);
+ return null;
+ })}
+ </div>
+ );
+}
+
+export default Timeline;