diff options
| -rw-r--r-- | webui/src/pages/bug/MessageHistoryDialog.tsx | 29 |
1 files changed, 20 insertions, 9 deletions
diff --git a/webui/src/pages/bug/MessageHistoryDialog.tsx b/webui/src/pages/bug/MessageHistoryDialog.tsx index 139eb4a5..0ed33642 100644 --- a/webui/src/pages/bug/MessageHistoryDialog.tsx +++ b/webui/src/pages/bug/MessageHistoryDialog.tsx @@ -173,6 +173,7 @@ function MessageHistoryDialog({ bugId, commentId, open, onClose }: Props) { // Sort by most recent edit. Must create a copy of constant history as // reverse() modifies inplace. const history = comment?.history.slice().reverse(); + const editCount = history?.length === undefined ? 0 : history?.length - 1; const handleChange = (panel: string) => ( event: React.ChangeEvent<{}>, @@ -181,6 +182,23 @@ function MessageHistoryDialog({ bugId, commentId, open, onClose }: Props) { setExpanded(newExpanded ? panel : false); }; + const getSummary = (index: number, date: Date) => { + const desc = + index === editCount ? 'Created ' : `#${editCount - index} • Edited `; + const mostRecent = index === 0 ? ' (most recent)' : ''; + return ( + <> + <Tooltip title={moment(date).format('LLLL')}> + <span> + {desc} + <Moment date={date} format="on ll" /> + {mostRecent} + </span> + </Tooltip> + </> + ); + }; + return ( <Dialog onClose={onClose} @@ -190,7 +208,7 @@ function MessageHistoryDialog({ bugId, commentId, open, onClose }: Props) { maxWidth="md" > <DialogTitle id="customized-dialog-title" onClose={onClose}> - Edited {history?.length} times. + {`Edited ${editCount} ${editCount > 1 ? 'times' : 'time'}.`} </DialogTitle> <DialogContent dividers> {history?.map((edit, index) => ( @@ -204,14 +222,7 @@ function MessageHistoryDialog({ bugId, commentId, open, onClose }: Props) { aria-controls="panel1d-content" id="panel1d-header" > - <Typography> - {`#${history?.length - index} • Edited `} - <Tooltip title={moment(edit.date).format('LLLL')}> - <Moment date={edit.date} format="on ll" /> - </Tooltip> - {index === 0 && ' (most recent edit)'} - {index === history?.length - 1 && ' (Initial description)'} - </Typography> + <Typography>{getSummary(index, edit.date)}</Typography> </AccordionSummary> <AccordionDetails>{edit.message}</AccordionDetails> </Accordion> |