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

.NET library implementing distributed task queue machinery using Apache Cassandra

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.TaskDetails = void 0;
const tslib_1 = require("tslib");
const jsx_runtime_1 = require("react/jsx-runtime");
const edi_ui_1 = require("@skbkontur/edi-ui");
const ArrowRoundTimeForwardIcon16Regular_1 = require("@skbkontur/icons/ArrowRoundTimeForwardIcon16Regular");
const XIcon16Regular_1 = require("@skbkontur/icons/XIcon16Regular");
const react_stack_layout_1 = require("@skbkontur/react-stack-layout");
const react_ui_1 = require("@skbkontur/react-ui");
const react_1 = tslib_1.__importDefault(require("react"));
const CustomSettingsContext_1 = require("../../../CustomSettingsContext");
const TaskStateExtensions_1 = require("../../../Domain/TaskStateExtensions");
const RouterLink_1 = require("../../RouterLink/RouterLink");
const TaskDetails_styles_1 = require("./TaskDetails.styles");
function dateFormatter(item, selector) {
    return jsx_runtime_1.jsx(edi_ui_1.Timestamp, { value: selector(item) }, void 0);
}
function TaskDetails(props) {
    const { allowRerunOrCancel, taskInfo, isChecked, onCancel, onRerun, onCheck, getTaskLocation } = props;
    const theme = react_1.default.useContext(react_ui_1.ThemeContext);
    const { customStateCaptions } = CustomSettingsContext_1.useCustomSettings();
    const canCancel = taskInfo.taskActions ? taskInfo.taskActions.canCancel : TaskStateExtensions_1.cancelableStates.includes(taskInfo.state);
    const canRerun = taskInfo.taskActions ? taskInfo.taskActions.canRerun : TaskStateExtensions_1.rerunableStates.includes(taskInfo.state);
    const renderTaskDate = (taskInfo, caption, selector) => {
        return (jsx_runtime_1.jsxs("div", { children: [jsx_runtime_1.jsx("span", Object.assign({ className: TaskDetails_styles_1.jsStyles.dateCaption(theme) }, { children: caption }), void 0), jsx_runtime_1.jsx("span", { children: dateFormatter(taskInfo, selector) }, void 0)] }, void 0));
    };
    return (jsx_runtime_1.jsxs(react_stack_layout_1.RowStack, Object.assign({ block: true, className: `${TaskDetails_styles_1.jsStyles.taskDetails()} ${TaskDetails_styles_1.jsStyles.state(theme, taskInfo.state)}`, gap: 2 }, { children: [jsx_runtime_1.jsx(react_stack_layout_1.Fit, { children: jsx_runtime_1.jsx(react_ui_1.Checkbox, { className: TaskDetails_styles_1.jsStyles.checkbox(), onValueChange: onCheck, checked: isChecked }, void 0) }, void 0), jsx_runtime_1.jsxs(react_stack_layout_1.ColumnStack, Object.assign({ block: true, gap: 1 }, { children: [jsx_runtime_1.jsx(react_stack_layout_1.Fit, Object.assign({ className: TaskDetails_styles_1.jsStyles.name() }, { children: jsx_runtime_1.jsx(RouterLink_1.RouterLink, Object.assign({ "data-tid": "Name", to: getTaskLocation(taskInfo.id) }, { children: taskInfo.name }), void 0) }), void 0), jsx_runtime_1.jsx(react_stack_layout_1.Fit, { children: jsx_runtime_1.jsxs(react_stack_layout_1.RowStack, Object.assign({ verticalAlign: "stretch", block: true, gap: 2 }, { children: [jsx_runtime_1.jsxs(react_stack_layout_1.Fit, Object.assign({ tag: react_stack_layout_1.ColumnStack, className: TaskDetails_styles_1.jsStyles.infoBlock1() }, { children: [jsx_runtime_1.jsx(react_stack_layout_1.Fit, Object.assign({ className: TaskDetails_styles_1.jsStyles.id() }, { children: jsx_runtime_1.jsx(edi_ui_1.AllowCopyToClipboard, { children: jsx_runtime_1.jsx("span", Object.assign({ "data-tid": "TaskId" }, { children: taskInfo.id }), void 0) }, void 0) }), void 0), jsx_runtime_1.jsxs(react_stack_layout_1.Fit, { children: [jsx_runtime_1.jsx("span", Object.assign({ className: TaskDetails_styles_1.jsStyles.stateName(), "data-tid": "State" }, { children: customStateCaptions[taskInfo.state] }), void 0), jsx_runtime_1.jsxs("span", Object.assign({ className: TaskDetails_styles_1.jsStyles.attempts() }, { children: ["Attempts: ", jsx_runtime_1.jsx("span", Object.assign({ "data-tid": "Attempts" }, { children: taskInfo.attempts }), void 0)] }), void 0)] }, void 0), jsx_runtime_1.jsx(react_stack_layout_1.Fill, Object.assign({ className: TaskDetails_styles_1.jsStyles.parentTask() }, { children: jsx_runtime_1.jsxs("div", { children: ["Parent:", " ", taskInfo.parentTaskId ? (jsx_runtime_1.jsx(edi_ui_1.AllowCopyToClipboard, { children: taskInfo.parentTaskId }, void 0)) : ("-")] }, void 0) }), void 0), allowRerunOrCancel && (jsx_runtime_1.jsx(react_stack_layout_1.Fit, { children: jsx_runtime_1.jsxs(react_stack_layout_1.RowStack, Object.assign({ baseline: true, block: true, gap: 2 }, { children: [jsx_runtime_1.jsx(react_stack_layout_1.Fit, { children: jsx_runtime_1.jsx(react_ui_1.Link, Object.assign({ "data-tid": "Cancel", disabled: !canCancel, onClick: onCancel, icon: jsx_runtime_1.jsx(XIcon16Regular_1.XIcon16Regular, {}, void 0) }, { children: "Cancel" }), void 0) }, void 0), jsx_runtime_1.jsx(react_stack_layout_1.Fit, { children: jsx_runtime_1.jsx(react_ui_1.Link, Object.assign({ "data-tid": "Rerun", disabled: !canRerun, onClick: onRerun, icon: jsx_runtime_1.jsx(ArrowRoundTimeForwardIcon16Regular_1.ArrowRoundTimeForwardIcon16Regular, {}, void 0) }, { children: "Rerun" }), void 0) }, void 0)] }), void 0) }, void 0))] }), void 0), jsx_runtime_1.jsxs(react_stack_layout_1.Fit, Object.assign({ className: TaskDetails_styles_1.jsStyles.dates() }, { children: [renderTaskDate(taskInfo, "Enqueued", x => x.ticks), renderTaskDate(taskInfo, "Started", x => x.startExecutingTicks), renderTaskDate(taskInfo, "Finished", x => x.finishExecutingTicks), renderTaskDate(taskInfo, "StateTime", x => x.minimalStartTicks), renderTaskDate(taskInfo, "Expiration", x => x.expirationTimestampTicks)] }), void 0)] }), void 0) }, void 0)] }), void 0)] }), void 0));
}
exports.TaskDetails = TaskDetails;
//# sourceMappingURL=TaskDetails.js.map