Update task details view

This commit is contained in:
Ken Hibino
2021-10-16 06:48:42 -07:00
parent 36c82e380a
commit efb2aa75a8
4 changed files with 79 additions and 8 deletions

View File

@@ -276,6 +276,9 @@ export interface TaskInfo {
next_process_at: string;
timeout_seconds: number;
deadline: string;
completed_at: string;
result: string;
ttl_seconds: number;
}
export interface ActiveTask extends BaseTask {
@@ -330,7 +333,7 @@ export interface CompletedTask extends BaseTask {
retried: number;
completed_at: string;
result: string;
result_ttl_seconds: number
ttl_seconds: number
}
export interface ServerInfo {

View File

@@ -325,10 +325,8 @@ function Row(props: RowProps) {
</SyntaxHighlighter>
</TableCell>
<TableCell>
{task.result_ttl_seconds > 0
? `${stringifyDuration(
durationFromSeconds(task.result_ttl_seconds)
)} left`
{task.ttl_seconds > 0
? `${stringifyDuration(durationFromSeconds(task.ttl_seconds))} left`
: `expired`}
</TableCell>
<TableCell

View File

@@ -18,6 +18,7 @@ import { TaskDetailsRouteParams } from "../paths";
import { usePolling } from "../hooks";
import { listQueuesAsync } from "../actions/queuesActions";
import SyntaxHighlighter from "../components/SyntaxHighlighter";
import { durationFromSeconds, stringifyDuration } from "../utils";
function mapStateToProps(state: AppState) {
return {
@@ -232,6 +233,56 @@ function TaskDetailsView(props: Props) {
)}
</div>
</div>
{
/* Completed Task Only */ taskInfo?.state === "completed" && (
<>
<div className={classes.infoRow}>
<Typography
variant="subtitle2"
className={classes.infoKeyCell}
>
Completed:{" "}
</Typography>
<div className={classes.infoValueCell}>
<Typography>{taskInfo.completed_at}</Typography>
</div>
</div>
<div className={classes.infoRow}>
<Typography
variant="subtitle2"
className={classes.infoKeyCell}
>
Result:{" "}
</Typography>
<div className={classes.infoValueCell}>
<SyntaxHighlighter
language="json"
customStyle={{ margin: 0, maxWidth: 400 }}
>
{taskInfo.result}
</SyntaxHighlighter>
</div>
</div>
<div className={classes.infoRow}>
<Typography
variant="subtitle2"
className={classes.infoKeyCell}
>
TTL:{" "}
</Typography>
<Typography className={classes.infoValueCell}>
<Typography>
{taskInfo.ttl_seconds > 0
? `${stringifyDuration(
durationFromSeconds(taskInfo.ttl_seconds)
)} left`
: "expired"}
</Typography>
</Typography>
</div>
</>
)
}
</Paper>
)}
<div className={classes.footer}>