@skbkontur/cassandra-distributed-task-queue-ui/components/TaskTimeLine/TaskTimeLine.js

.NET library implementing distributed task queue machinery using Apache Cassandra

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.TaskTimeLine = TaskTimeLine;
const jsx_runtime_1 = require("react/jsx-runtime");
const edi_ui_1 = require("@skbkontur/edi-ui");
const ArrowADownIcon16Regular_1 = require("@skbkontur/icons/ArrowADownIcon16Regular");
const ArrowAUpIcon16Regular_1 = require("@skbkontur/icons/ArrowAUpIcon16Regular");
const ArrowDCornerDownRightIcon16Regular_1 = require("@skbkontur/icons/ArrowDCornerDownRightIcon16Regular");
const ArrowRoundTimeForwardIcon16Regular_1 = require("@skbkontur/icons/ArrowRoundTimeForwardIcon16Regular");
const ArrowShapeTriangleADownIcon16Regular_1 = require("@skbkontur/icons/ArrowShapeTriangleADownIcon16Regular");
const CheckAIcon16Regular_1 = require("@skbkontur/icons/CheckAIcon16Regular");
const NetDownloadIcon16Regular_1 = require("@skbkontur/icons/NetDownloadIcon16Regular");
const TimeClockIcon16Regular_1 = require("@skbkontur/icons/TimeClockIcon16Regular");
const XCircleIcon16Regular_1 = require("@skbkontur/icons/XCircleIcon16Regular");
const XIcon16Regular_1 = require("@skbkontur/icons/XIcon16Regular");
const react_ui_1 = require("@skbkontur/react-ui");
const react_1 = require("react");
const TaskState_1 = require("../../Domain/Api/TaskState");
const RouterLink_1 = require("../RouterLink/RouterLink");
const TaskStateIcon_1 = require("../TaskChainTree/TaskStateIcon");
const TaskTimeLine_styles_1 = require("./TaskTimeLine.styles");
const TimeLine_1 = require("./TimeLine/TimeLine");
const TimeLineEntry = TimeLine_1.TimeLine.Entry;
const alwaysVisibleTaskIdsCount = 3;
function TaskTimeLine({ taskMeta, childTaskIds, getHrefToTask }) {
    const [showAllErrors, setShowAllErrors] = (0, react_1.useState)(false);
    const theme = (0, react_1.useContext)(react_ui_1.ThemeContext);
    const createSimpleEntry = (entry) => {
        return ((0, jsx_runtime_1.jsxs)(TimeLineEntry, { icon: entry.icon, children: [(0, jsx_runtime_1.jsx)("div", { style: { color: entry.color }, children: entry.title }), entry.date && ((0, jsx_runtime_1.jsx)("div", { className: TaskTimeLine_styles_1.jsStyles.date(theme), children: (0, jsx_runtime_1.jsx)(edi_ui_1.Timestamp, { value: entry.date }) }))] }, entry.title));
    };
    const getStartedEntry = () => {
        if (!taskMeta.startExecutingTicks) {
            return null;
        }
        return createSimpleEntry({
            title: "Started",
            icon: (0, jsx_runtime_1.jsx)(ArrowDCornerDownRightIcon16Regular_1.ArrowDCornerDownRightIcon16Regular, {}),
            date: taskMeta.startExecutingTicks,
        });
    };
    const getExecutionEntries = () => {
        if (taskMeta.attempts === undefined || taskMeta.attempts === null || taskMeta.attempts === 0) {
            return [getShouldStartedEntry(), getStartedEntry()];
        }
        const shouldStartAndStartEntries = [];
        if (taskMeta.state === TaskState_1.TaskState.WaitingForRerun) {
            shouldStartAndStartEntries.push(getStartedEntry(), createSimpleEntry({
                title: "Finished",
                icon: (0, jsx_runtime_1.jsx)(CheckAIcon16Regular_1.CheckAIcon16Regular, {}),
                date: taskMeta.finishExecutingTicks,
            }));
        }
        else if (taskMeta.state === TaskState_1.TaskState.WaitingForRerunAfterError) {
            const color = (0, TaskStateIcon_1.getIconColor)(theme, "error");
            shouldStartAndStartEntries.push(getStartedEntry(), createSimpleEntry({
                title: "Failed",
                icon: (0, jsx_runtime_1.jsx)(XCircleIcon16Regular_1.XCircleIcon16Regular, { color: color }),
                color: color,
                date: taskMeta.finishExecutingTicks,
            }));
        }
        else {
            shouldStartAndStartEntries.push(getShouldStartedEntry(), getStartedEntry());
        }
        if (taskMeta.attempts !== undefined && taskMeta.attempts !== null && taskMeta.attempts > 1) {
            const TimeLineCycled = TimeLine_1.TimeLine.Cycled;
            return [
                (0, jsx_runtime_1.jsx)(TimeLineCycled, { icon: (0, jsx_runtime_1.jsx)(ArrowRoundTimeForwardIcon16Regular_1.ArrowRoundTimeForwardIcon16Regular, {}), content: `Restarted for ${taskMeta.attempts} times`, children: shouldStartAndStartEntries }, "FewAttempts"),
            ];
        }
        return shouldStartAndStartEntries;
    };
    const getShouldStartedEntry = () => {
        return createSimpleEntry({
            title: "Start scheduled",
            icon: (0, jsx_runtime_1.jsx)(TimeClockIcon16Regular_1.TimeClockIcon16Regular, {}),
            date: taskMeta.minimalStartTicks,
        });
    };
    const getCurrentStateEntries = () => {
        if (taskMeta.state === TaskState_1.TaskState.Finished) {
            const color = (0, TaskStateIcon_1.getIconColor)(theme, "success");
            return [
                createSimpleEntry({
                    title: "Finished",
                    icon: (0, jsx_runtime_1.jsx)(CheckAIcon16Regular_1.CheckAIcon16Regular, { color: color }),
                    color: color,
                    date: taskMeta.finishExecutingTicks,
                }),
            ];
        }
        if (taskMeta.state === TaskState_1.TaskState.Fatal) {
            const color = (0, TaskStateIcon_1.getIconColor)(theme, "error");
            return [
                createSimpleEntry({
                    title: "Failed",
                    icon: (0, jsx_runtime_1.jsx)(XCircleIcon16Regular_1.XCircleIcon16Regular, { color: color }),
                    color: color,
                    date: taskMeta.finishExecutingTicks,
                }),
            ];
        }
        if (taskMeta.state === TaskState_1.TaskState.Canceled) {
            const color = (0, TaskStateIcon_1.getIconColor)(theme, "error");
            return [
                createSimpleEntry({
                    title: "Canceled",
                    icon: (0, jsx_runtime_1.jsx)(XIcon16Regular_1.XIcon16Regular, { color: color }),
                    color: color,
                    date: taskMeta.finishExecutingTicks || taskMeta.lastModificationTicks,
                }),
            ];
        }
        if (taskMeta.state === TaskState_1.TaskState.WaitingForRerun || taskMeta.state === TaskState_1.TaskState.WaitingForRerunAfterError) {
            const color = (0, TaskStateIcon_1.getIconColor)(theme, "waiting");
            return [
                getShouldStartedEntry(),
                createSimpleEntry({
                    title: "Waiting for next run",
                    icon: (0, jsx_runtime_1.jsx)(TimeClockIcon16Regular_1.TimeClockIcon16Regular, { color: color }),
                    color: color,
                }),
            ];
        }
        if (taskMeta.state === TaskState_1.TaskState.InProcess) {
            const color = (0, TaskStateIcon_1.getIconColor)(theme, "waiting");
            return [
                createSimpleEntry({
                    title: "Waiting for complete",
                    icon: (0, jsx_runtime_1.jsx)(TimeClockIcon16Regular_1.TimeClockIcon16Regular, { color: color }),
                    color: color,
                }),
            ];
        }
        if (taskMeta.state === TaskState_1.TaskState.New) {
            const color = (0, TaskStateIcon_1.getIconColor)(theme, "waiting");
            return [
                createSimpleEntry({
                    title: "Waiting for start",
                    icon: (0, jsx_runtime_1.jsx)(TimeClockIcon16Regular_1.TimeClockIcon16Regular, { color: color }),
                    color: color,
                }),
            ];
        }
        if (taskMeta.state === TaskState_1.TaskState.Unknown) {
            return [];
        }
        return [];
    };
    const getEnqueuedEntry = () => {
        return createSimpleEntry({
            title: "Enqueued",
            icon: (0, jsx_runtime_1.jsx)(NetDownloadIcon16Regular_1.NetDownloadIcon16Regular, {}),
            date: taskMeta.ticks,
        });
    };
    const getChildrenTaskIdsEntry = () => {
        if (childTaskIds && childTaskIds.length > 0) {
            const visibleTaskIdsCount = showAllErrors ? childTaskIds.length : alwaysVisibleTaskIdsCount;
            const hiddenTaskIdsCount = childTaskIds.length - visibleTaskIdsCount;
            const color = (0, TaskStateIcon_1.getIconColor)(theme, "waiting");
            return ((0, jsx_runtime_1.jsx)(TimeLineEntry, { icon: (0, jsx_runtime_1.jsx)(ArrowADownIcon16Regular_1.ArrowADownIcon16Regular, { color: color }), children: (0, jsx_runtime_1.jsxs)("div", { style: { color: color }, "data-tid": "EnqueuedTasks", children: [(0, jsx_runtime_1.jsx)("div", { children: "Enqueued tasks:" }), childTaskIds.slice(0, visibleTaskIdsCount).map(x => ((0, jsx_runtime_1.jsx)("div", { "data-tid": "TaskLink", children: (0, jsx_runtime_1.jsx)(edi_ui_1.AllowCopyToClipboard, { children: (0, jsx_runtime_1.jsx)(RouterLink_1.RouterLink, { to: getHrefToTask(x), children: x }) }) }, x))), hiddenTaskIdsCount > 0 && ((0, jsx_runtime_1.jsxs)(react_ui_1.Link, { "data-tid": "ShowAllTasks", onClick: () => setShowAllErrors(true), children: ["...and ", hiddenTaskIdsCount, " more", "\u00A0", (0, jsx_runtime_1.jsx)(ArrowShapeTriangleADownIcon16Regular_1.ArrowShapeTriangleADownIcon16Regular, {})] }))] }) }, "Children"));
        }
        return null;
    };
    const getParentTaskIdEntry = () => {
        if (!taskMeta.parentTaskId) {
            return null;
        }
        const color = (0, TaskStateIcon_1.getIconColor)(theme, "waiting");
        return ((0, jsx_runtime_1.jsx)(TimeLineEntry, { icon: (0, jsx_runtime_1.jsx)(ArrowAUpIcon16Regular_1.ArrowAUpIcon16Regular, { color: color }), children: (0, jsx_runtime_1.jsxs)("div", { style: { color: color }, children: ["Parent:", " ", (0, jsx_runtime_1.jsx)(edi_ui_1.AllowCopyToClipboard, { children: (0, jsx_runtime_1.jsx)(RouterLink_1.RouterLink, { to: getHrefToTask(taskMeta.parentTaskId), children: taskMeta.parentTaskId }) })] }) }, "Parent"));
    };
    return ((0, jsx_runtime_1.jsx)(TimeLine_1.TimeLine, { children: [
            getParentTaskIdEntry(),
            getEnqueuedEntry(),
            ...getExecutionEntries(),
            ...getCurrentStateEntries(),
            getChildrenTaskIdsEntry(),
        ] }));
}
//# sourceMappingURL=TaskTimeLine.js.map