@danikokonn/yarik-frontend-lib 2.1.2 → 2.1.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/DateTimeRangePicker/DateTimeRangePicker.d.ts +1 -1
- package/dist/components/DateTimeRangePicker/DateTimeRangePicker.d.ts.map +1 -1
- package/dist/components/DateTimeRangePicker/DateTimeRangePicker.js +14 -9
- package/dist/components/DatetimeRangeInput/DatetimeRangeInput.d.ts +0 -1
- package/dist/components/DatetimeRangeInput/DatetimeRangeInput.d.ts.map +1 -1
- package/dist/components/DatetimeRangeInput/DatetimeRangeInput.js +12 -14
- package/dist/components/LocalizedDatetimePicker/LocalizedDatetimePicker.d.ts +1 -1
- package/dist/components/LocalizedDatetimePicker/LocalizedDatetimePicker.d.ts.map +1 -1
- package/dist/components/LocalizedDatetimePicker/LocalizedDatetimePicker.js +11 -6
- package/dist/components/SubtaskItem/SubtaskItem.d.ts.map +1 -1
- package/dist/components/SubtaskItem/SubtaskItem.js +8 -17
- package/dist/components/TaskLoader/TaskLoader.js +2 -2
- package/dist/components/TaskStateDialog/TaskStateDialog.d.ts.map +1 -1
- package/dist/components/TaskStateDialog/TaskStateDialog.js +11 -11
- package/dist/utils.d.ts +2 -4
- package/dist/utils.d.ts.map +1 -1
- package/dist/utils.js +30 -25
- package/package.json +13 -19
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import "
|
|
1
|
+
import "dayjs/locale/ru";
|
|
2
2
|
import DateTimeRangePickerProps from "./DateTimeRangePickerProps";
|
|
3
3
|
export default function DateTimeRangePicker({ disableFuture, disabled, fromDatetime, toDateTime, required, error, onStartDateSet, onEndDateSet, }: DateTimeRangePickerProps): import("react/jsx-runtime").JSX.Element;
|
|
4
4
|
//# sourceMappingURL=DateTimeRangePicker.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DateTimeRangePicker.d.ts","sourceRoot":"","sources":["../../../src/components/DateTimeRangePicker/DateTimeRangePicker.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"DateTimeRangePicker.d.ts","sourceRoot":"","sources":["../../../src/components/DateTimeRangePicker/DateTimeRangePicker.tsx"],"names":[],"mappings":"AAQA,OAAO,iBAAiB,CAAC;AAIzB,OAAO,wBAAwB,MAAM,4BAA4B,CAAC;AAKlE,MAAM,CAAC,OAAO,UAAU,mBAAmB,CAAC,EAC1C,aAAa,EACb,QAAQ,EACR,YAAY,EACZ,UAAU,EACV,QAAQ,EACR,KAAK,EACL,cAAc,EACd,YAAY,GACb,EAAE,wBAAwB,2CAmF1B"}
|
|
@@ -1,17 +1,22 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import Stack from "@mui/material/Stack";
|
|
3
3
|
import { DesktopDateTimePicker, LocalizationProvider, } from "@mui/x-date-pickers";
|
|
4
|
-
import {
|
|
5
|
-
import
|
|
6
|
-
import "
|
|
4
|
+
import { AdapterDayjs } from "@mui/x-date-pickers/AdapterDayjs";
|
|
5
|
+
import { ruRU } from "@mui/x-date-pickers/locales";
|
|
6
|
+
import dayjs from "dayjs";
|
|
7
|
+
import "dayjs/locale/ru";
|
|
8
|
+
import timezone from "dayjs/plugin/timezone";
|
|
9
|
+
import utc from "dayjs/plugin/utc";
|
|
7
10
|
import { useState } from "react";
|
|
11
|
+
dayjs.extend(utc);
|
|
12
|
+
dayjs.extend(timezone);
|
|
8
13
|
export default function DateTimeRangePicker({ disableFuture, disabled, fromDatetime, toDateTime, required, error, onStartDateSet, onEndDateSet, }) {
|
|
9
14
|
const [fromDatetimePickerOpen, setFromDatetimePickerOpen] = useState(false);
|
|
10
15
|
const [toDatetimePickerOpen, setToDatetimePickerOpen] = useState(false);
|
|
11
|
-
const fromDttm = fromDatetime.length > 0 ?
|
|
12
|
-
const toDttm = toDateTime.length > 0 ?
|
|
13
|
-
return (_jsx(LocalizationProvider, { dateAdapter:
|
|
14
|
-
onStartDateSet((v && v.
|
|
16
|
+
const fromDttm = fromDatetime.length > 0 ? dayjs(fromDatetime) : null;
|
|
17
|
+
const toDttm = toDateTime.length > 0 ? dayjs(toDateTime) : null;
|
|
18
|
+
return (_jsx(LocalizationProvider, { dateAdapter: AdapterDayjs, adapterLocale: "ru", localeText: ruRU.components.MuiLocalizationProvider.defaultProps.localeText, children: _jsxs(Stack, { direction: "row", sx: { m: 2 }, spacing: 2, children: [_jsx(DesktopDateTimePicker, { disabled: disabled, open: fromDatetimePickerOpen, reduceAnimations: true, onChange: (v) => {
|
|
19
|
+
onStartDateSet((v && v.format()) || "");
|
|
15
20
|
}, disableFuture: disableFuture, views: ["year", "month", "day", "hours", "minutes", "seconds"], timezone: "Europe/Moscow", ampm: false, ampmInClock: false, value: fromDttm, timeSteps: { hours: 1, minutes: 1, seconds: 1 }, slotProps: {
|
|
16
21
|
field: {
|
|
17
22
|
clearable: true,
|
|
@@ -27,8 +32,8 @@ export default function DateTimeRangePicker({ disableFuture, disabled, fromDatet
|
|
|
27
32
|
position: "start",
|
|
28
33
|
onClick: () => setFromDatetimePickerOpen(true),
|
|
29
34
|
},
|
|
30
|
-
}, onClose: () => setFromDatetimePickerOpen(false) }), _jsx(DesktopDateTimePicker, { disabled: disabled, open: toDatetimePickerOpen, reduceAnimations: true, onChange: (v
|
|
31
|
-
onEndDateSet((v && v.
|
|
35
|
+
}, onClose: () => setFromDatetimePickerOpen(false) }), _jsx(DesktopDateTimePicker, { disabled: disabled, open: toDatetimePickerOpen, reduceAnimations: true, onChange: (v) => {
|
|
36
|
+
onEndDateSet((v && v.format()) || "");
|
|
32
37
|
}, disableFuture: disableFuture, views: ["year", "month", "day", "hours", "minutes", "seconds"], timezone: "Europe/Moscow", ampm: false, ampmInClock: false, timeSteps: { hours: 1, minutes: 1, seconds: 1 }, value: toDttm, slotProps: {
|
|
33
38
|
field: {
|
|
34
39
|
clearable: true,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DatetimeRangeInput.d.ts","sourceRoot":"","sources":["../../../src/components/DatetimeRangeInput/DatetimeRangeInput.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"DatetimeRangeInput.d.ts","sourceRoot":"","sources":["../../../src/components/DatetimeRangeInput/DatetimeRangeInput.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,GAAG,EAAoB,MAAM,OAAO,CAAC;AAG9C,OAAO,uBAAuB,MAAM,2BAA2B,CAAC;AAEhE;;;;;;;;;;;;;;;;;;GAkBG;AACH,MAAM,CAAC,OAAO,UAAU,kBAAkB,CAAC,EACzC,cAAc,EACd,IAAI,EACJ,EAAE,EACF,OAAO,EACP,EAAE,EACF,WAAW,EACX,IAAI,EACJ,QAAQ,EACR,QAAQ,GACT,EAAE,uBAAuB,GAAG,GAAG,CAAC,OAAO,CA8FvC"}
|
|
@@ -1,15 +1,13 @@
|
|
|
1
|
-
import { jsx as _jsx,
|
|
1
|
+
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import ClearIcon from "@mui/icons-material/Clear";
|
|
3
3
|
import DateRangeIcon from "@mui/icons-material/DateRange";
|
|
4
|
-
import { Skeleton, Stack } from "@mui/material";
|
|
5
4
|
import IconButton from "@mui/material/IconButton";
|
|
6
5
|
import Popover from "@mui/material/Popover";
|
|
7
6
|
import TextField from "@mui/material/TextField";
|
|
8
|
-
import
|
|
9
|
-
import "
|
|
10
|
-
import { lazy, Suspense, useRef, useState } from "react";
|
|
7
|
+
import dayjs from "dayjs";
|
|
8
|
+
import { useRef, useState } from "react";
|
|
11
9
|
import { prettyDatetime } from "../../utils";
|
|
12
|
-
|
|
10
|
+
import DateTimeRangePicker from "../DateTimeRangePicker/DateTimeRangePicker";
|
|
13
11
|
/**
|
|
14
12
|
* Компонент выбора диапазона дат и времени.
|
|
15
13
|
*
|
|
@@ -40,7 +38,7 @@ export default function DatetimeRangeInput({ onDateRangeSet, from, to, variant,
|
|
|
40
38
|
const rangeValid = fromDatetime &&
|
|
41
39
|
toDateTime &&
|
|
42
40
|
fromDatetime !== toDateTime &&
|
|
43
|
-
|
|
41
|
+
dayjs(fromDatetime).isBefore(dayjs(toDateTime));
|
|
44
42
|
return (_jsxs(_Fragment, { children: [_jsx(TextField, { size: size, variant: variant || "standard", disabled: disabled, required: required, placeholder: variant === "outlined" ? undefined : placeholder, label: variant === "outlined" ? placeholder : undefined, slotProps: {
|
|
45
43
|
input: {
|
|
46
44
|
startAdornment: _jsx(DateRangeIcon, {}),
|
|
@@ -64,11 +62,11 @@ export default function DatetimeRangeInput({ onDateRangeSet, from, to, variant,
|
|
|
64
62
|
paper: {
|
|
65
63
|
sx: { minWidth: "30rem" },
|
|
66
64
|
},
|
|
67
|
-
}, children: _jsx(
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
65
|
+
}, children: _jsx(DateTimeRangePicker, { required: required, disableFuture: true, disabled: disabled, fromDatetime: fromDatetime, toDateTime: toDateTime, onStartDateSet: (s) => {
|
|
66
|
+
setFromDatetime(s);
|
|
67
|
+
onDateRangeSet(s, toDateTime);
|
|
68
|
+
}, onEndDateSet: (e) => {
|
|
69
|
+
setToDatetime(e);
|
|
70
|
+
onDateRangeSet(fromDatetime, e);
|
|
71
|
+
} }) })] }));
|
|
74
72
|
}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import "
|
|
1
|
+
import "dayjs/locale/ru";
|
|
2
2
|
import LocalizedDatetimePickerProps from "./LocalizedDatetimePickerProps";
|
|
3
3
|
export default function LocalizedDateTimePicker({ disableFuture, disabled, value, required, variant, size, onChange, }: LocalizedDatetimePickerProps): import("react/jsx-runtime").JSX.Element;
|
|
4
4
|
//# sourceMappingURL=LocalizedDatetimePicker.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LocalizedDatetimePicker.d.ts","sourceRoot":"","sources":["../../../src/components/LocalizedDatetimePicker/LocalizedDatetimePicker.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"LocalizedDatetimePicker.d.ts","sourceRoot":"","sources":["../../../src/components/LocalizedDatetimePicker/LocalizedDatetimePicker.tsx"],"names":[],"mappings":"AAOA,OAAO,iBAAiB,CAAC;AAKzB,OAAO,4BAA4B,MAAM,gCAAgC,CAAC;AAK1E,MAAM,CAAC,OAAO,UAAU,uBAAuB,CAAC,EAC9C,aAAa,EACb,QAAQ,EACR,KAAK,EACL,QAAQ,EACR,OAAO,EACP,IAAI,EACJ,QAAQ,GACT,EAAE,4BAA4B,2CA6C9B"}
|
|
@@ -1,15 +1,20 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
2
|
import { DesktopDateTimePicker, LocalizationProvider, } from "@mui/x-date-pickers";
|
|
3
|
-
import {
|
|
4
|
-
import
|
|
5
|
-
import "
|
|
3
|
+
import { AdapterDayjs } from "@mui/x-date-pickers/AdapterDayjs";
|
|
4
|
+
import { ruRU } from "@mui/x-date-pickers/locales";
|
|
5
|
+
import dayjs from "dayjs";
|
|
6
|
+
import "dayjs/locale/ru";
|
|
7
|
+
import timezone from "dayjs/plugin/timezone";
|
|
8
|
+
import utc from "dayjs/plugin/utc";
|
|
6
9
|
import { useState } from "react";
|
|
7
10
|
import { useDebounce } from "../../utils";
|
|
11
|
+
dayjs.extend(utc);
|
|
12
|
+
dayjs.extend(timezone);
|
|
8
13
|
export default function LocalizedDateTimePicker({ disableFuture, disabled, value, required, variant, size, onChange, }) {
|
|
9
14
|
const [open, setOpen] = useState(false);
|
|
10
|
-
const datetime = value?.length > 0 ?
|
|
11
|
-
return (_jsx(LocalizationProvider, { dateAdapter:
|
|
12
|
-
onChange((v && v.
|
|
15
|
+
const datetime = value?.length > 0 ? dayjs(value) : null;
|
|
16
|
+
return (_jsx(LocalizationProvider, { dateAdapter: AdapterDayjs, adapterLocale: "ru", localeText: ruRU.components.MuiLocalizationProvider.defaultProps.localeText, children: _jsx(DesktopDateTimePicker, { disabled: disabled, open: open, reduceAnimations: true, onChange: useDebounce((v) => {
|
|
17
|
+
onChange((v && v.format()) || "");
|
|
13
18
|
}, 200), disableFuture: disableFuture, views: ["year", "month", "day", "hours", "minutes", "seconds"], timezone: "Europe/Moscow", ampm: false, ampmInClock: false, value: datetime, timeSteps: { hours: 1, minutes: 1, seconds: 1 }, slotProps: {
|
|
14
19
|
field: {
|
|
15
20
|
clearable: true,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SubtaskItem.d.ts","sourceRoot":"","sources":["../../../src/components/SubtaskItem/SubtaskItem.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"SubtaskItem.d.ts","sourceRoot":"","sources":["../../../src/components/SubtaskItem/SubtaskItem.tsx"],"names":[],"mappings":"AAiBA,OAAO,gBAAgB,MAAM,oBAAoB,CAAC;AA2BlD,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,EAClC,YAAY,EACZ,IAAI,EACJ,QAAQ,EACR,UAAU,EACV,uBAAuB,GACxB,EAAE,gBAAgB,2CAyHlB"}
|
|
@@ -11,9 +11,11 @@ import Accordion from "@mui/material/Accordion";
|
|
|
11
11
|
import AccordionDetails from "@mui/material/AccordionDetails";
|
|
12
12
|
import AccordionSummary from "@mui/material/AccordionSummary";
|
|
13
13
|
import CircularProgress from "@mui/material/CircularProgress";
|
|
14
|
-
import
|
|
14
|
+
import dayjs from "dayjs";
|
|
15
|
+
import duration from "dayjs/plugin/duration";
|
|
15
16
|
import { useEffect, useState } from "react";
|
|
16
|
-
import { taskStateText } from "../../utils";
|
|
17
|
+
import { formatDuration, prettyDatetime, taskStateText } from "../../utils";
|
|
18
|
+
dayjs.extend(duration);
|
|
17
19
|
const SubtaskState = ({ state }) => {
|
|
18
20
|
switch (state) {
|
|
19
21
|
case "success":
|
|
@@ -46,21 +48,10 @@ export default function SubtaskItem({ taskInstance, logs, expanded, onShowLogs,
|
|
|
46
48
|
setCopyText("Копировать");
|
|
47
49
|
}
|
|
48
50
|
}, [expanded]);
|
|
49
|
-
const formatEndDate =
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
year: "numeric",
|
|
54
|
-
hour: "2-digit",
|
|
55
|
-
minute: "2-digit",
|
|
56
|
-
second: "2-digit",
|
|
57
|
-
});
|
|
58
|
-
const formatTaskDuration = moment
|
|
59
|
-
.duration(taskInstance.duration, "seconds")
|
|
60
|
-
.format({
|
|
61
|
-
precision: 1,
|
|
62
|
-
template: "h [ч], m [мин], s [сек]",
|
|
63
|
-
});
|
|
51
|
+
const formatEndDate = prettyDatetime(taskInstance.executionDate, true);
|
|
52
|
+
const formatTaskDuration = taskInstance.duration !== null
|
|
53
|
+
? formatDuration(taskInstance.duration)
|
|
54
|
+
: "н/д";
|
|
64
55
|
return (_jsxs(Accordion, { disableGutters: true, expanded: expanded, onChange: () => onShowLogs(taskInstance.taskId, taskInstance.tryNumber), disabled: !["running", "success", "failed"].includes(taskInstance.state || ""), sx: {
|
|
65
56
|
position: "relative",
|
|
66
57
|
}, children: [_jsx(AccordionSummary, { expandIcon: _jsx(ExpandMore, {}), children: _jsxs("div", { style: { display: "flex", alignItems: "center", gap: "0.5rem" }, children: [_jsx(SubtaskState, { state: taskInstance.state }), _jsxs("span", { children: [taskInstance.taskId, " - ", taskStateText(taskInstance.state), taskInstance.state === "success"
|
|
@@ -17,7 +17,7 @@ import useSWR from "swr";
|
|
|
17
17
|
import { postRequest } from "../../http";
|
|
18
18
|
import { useAirflowContext } from "../../providers/AirflowProvider";
|
|
19
19
|
import { useDagRunStateContext } from "../../providers/DagStateProvider";
|
|
20
|
-
import {
|
|
20
|
+
import { formatDuration, getCSRFToken, prettyDatetime, taskStateText, useDebounce, } from "../../utils";
|
|
21
21
|
import ProcessingIcon from "../icons/ProcessingIcon";
|
|
22
22
|
import SubtaskItem from "../SubtaskItem/SubtaskItem";
|
|
23
23
|
const TaskStateIcon = ({ taskState, }) => {
|
|
@@ -228,7 +228,7 @@ const TaskLoader = ({ style, subTitle, onUnauthorized }) => {
|
|
|
228
228
|
},
|
|
229
229
|
});
|
|
230
230
|
}, 200);
|
|
231
|
-
const formatEndDate =
|
|
231
|
+
const formatEndDate = prettyDatetime(dagRun?.logicalDate, true);
|
|
232
232
|
const formatTaskDuration = formatDuration(taskInstances?.taskInstances.reduce((a, b) => a + (b.duration || 0), 0) ||
|
|
233
233
|
0);
|
|
234
234
|
const activeTaskElem = taskInstances?.taskInstances.find((ti) => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TaskStateDialog.d.ts","sourceRoot":"","sources":["../../../src/components/TaskStateDialog/TaskStateDialog.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"TaskStateDialog.d.ts","sourceRoot":"","sources":["../../../src/components/TaskStateDialog/TaskStateDialog.tsx"],"names":[],"mappings":"AAgBA,OAAO,oBAAoB,MAAM,wBAAwB,CAAC;AAY1D,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,EACtC,SAAS,EACT,QAAQ,EACR,aAAa,EACb,OAAO,EACP,QAAQ,EACR,cAAc,EACd,kBAAkB,EAClB,iBAAiB,EACjB,OAAO,EACP,cAAc,GACf,EAAE,oBAAoB,2CA8LtB"}
|
|
@@ -1,20 +1,20 @@
|
|
|
1
1
|
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { useTheme } from "@mui/material";
|
|
3
|
+
import AppBar from "@mui/material/AppBar";
|
|
4
|
+
import Badge from "@mui/material/Badge";
|
|
5
|
+
import CircularProgress from "@mui/material/CircularProgress";
|
|
3
6
|
import Dialog from "@mui/material/Dialog";
|
|
7
|
+
import IconButton from "@mui/material/IconButton";
|
|
8
|
+
import Stack from "@mui/material/Stack";
|
|
9
|
+
import Toolbar from "@mui/material/Toolbar";
|
|
10
|
+
import Tooltip from "@mui/material/Tooltip";
|
|
11
|
+
import Typography from "@mui/material/Typography";
|
|
4
12
|
import Zoom from "@mui/material/Zoom";
|
|
13
|
+
import CloseIcon from "@mui/icons-material/Close";
|
|
5
14
|
import React from "react";
|
|
6
15
|
import { useAirflowContext } from "../../providers/AirflowProvider";
|
|
7
16
|
import { useDagRunStateContext } from "../../providers/DagStateProvider";
|
|
8
|
-
|
|
9
|
-
const Stack = React.lazy(() => import("@mui/material/Stack"));
|
|
10
|
-
const Toolbar = React.lazy(() => import("@mui/material/Toolbar"));
|
|
11
|
-
const IconButton = React.lazy(() => import("@mui/material/IconButton"));
|
|
12
|
-
const Typography = React.lazy(() => import("@mui/material/Typography"));
|
|
13
|
-
const Tooltip = React.lazy(() => import("@mui/material/Tooltip"));
|
|
14
|
-
const Badge = React.lazy(() => import("@mui/material/Badge"));
|
|
15
|
-
const CloseIcon = React.lazy(() => import("@mui/icons-material/Close"));
|
|
16
|
-
const CircularProgress = React.lazy(() => import("@mui/material/CircularProgress"));
|
|
17
|
-
const TaskLoader = React.lazy(() => import("../TaskLoader/TaskLoader"));
|
|
17
|
+
import TaskLoader from "../TaskLoader/TaskLoader";
|
|
18
18
|
const Transition = React.forwardRef(function Transition(props, ref) {
|
|
19
19
|
return _jsx(Zoom, { ref: ref, ...props });
|
|
20
20
|
});
|
|
@@ -69,7 +69,7 @@ export default function TaskStateDialog({ taskTitle, subTitle, appendedTitle, vi
|
|
|
69
69
|
setLoading(true);
|
|
70
70
|
},
|
|
71
71
|
},
|
|
72
|
-
}, children: _jsxs(
|
|
72
|
+
}, children: _jsxs(_Fragment, { children: [_jsx(AppBar, { sx: { position: "relative" }, color: color, children: _jsxs(Toolbar, { children: [_jsx(IconButton, { disabled: disableClosing, edge: "start", color: "inherit", onClick: () => onClose(), "aria-label": "close", children: _jsx(CloseIcon, {}) }), _jsx(Stack, { sx: {
|
|
73
73
|
ml: 2,
|
|
74
74
|
flex: 1,
|
|
75
75
|
flexWrap: "nowrap",
|
package/dist/utils.d.ts
CHANGED
|
@@ -1,12 +1,10 @@
|
|
|
1
1
|
import { PopoverOrigin } from "@mui/material";
|
|
2
|
-
import "
|
|
3
|
-
import "moment/locale/ru";
|
|
2
|
+
import "dayjs/locale/ru";
|
|
4
3
|
import { DagState, TaskState } from "./types";
|
|
5
4
|
export declare function getCSRFToken(): string;
|
|
6
5
|
export declare function setCSRFToken(newToken: string): void;
|
|
7
|
-
export declare function prettyDatetime(datetime?: string | null): string;
|
|
6
|
+
export declare function prettyDatetime(datetime?: string | null, utc?: boolean): string;
|
|
8
7
|
export declare const taskStateText: (taskState: DagState | TaskState | string | null | undefined) => "Завершена" | "Ошибка" | "В очереди" | "Запланирована" | "Выполняется" | "Недоступно" | "Нет состояния";
|
|
9
|
-
export declare const formatDate: (date: string) => string;
|
|
10
8
|
export declare const formatDuration: (duration: number) => string;
|
|
11
9
|
export declare const getSlugTableName: (name: string) => string;
|
|
12
10
|
export declare const getShiftedColor: (colorHex: string, shift: number) => string;
|
package/dist/utils.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../src/utils.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AAE9C,OAAO,
|
|
1
|
+
{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../src/utils.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AAE9C,OAAO,iBAAiB,CAAC;AAKzB,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAK9C,wBAAgB,YAAY,WAI3B;AAED,wBAAgB,YAAY,CAAC,QAAQ,EAAE,MAAM,QAI5C;AAED,wBAAgB,cAAc,CAAC,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,EAAE,GAAG,CAAC,EAAE,OAAO,UAerE;AAED,eAAO,MAAM,aAAa,GACxB,WAAW,QAAQ,GAAG,SAAS,GAAG,MAAM,GAAG,IAAI,GAAG,SAAS,4GAkB5D,CAAC;AAEF,eAAO,MAAM,cAAc,GAAI,UAAU,MAAM,WAa9C,CAAC;AAEF,eAAO,MAAM,gBAAgB,GAAI,MAAM,MAAM,WAyC5C,CAAC;AAEF,eAAO,MAAM,eAAe,GAAI,UAAU,MAAM,EAAE,OAAO,MAAM,WAkB9D,CAAC;AAEF,eAAO,MAAM,aAAa,GACxB,aAAa,MAAM,EACnB,WAAW,MAAM,EACjB,QAAQ,MAAM,EACd,QAAQ,MAAM,EACd,UAAU,OAAO,EACjB,aAAa,MAAM,WAWpB,CAAC;AAEF,eAAO,MAAM,gBAAgB,GAAI,aAAa,MAAM,EAAE,WAAW,MAAM,WACR,CAAC;AAEhE,wBAAgB,WAAW,CAAC,IAAI,SAAS,OAAO,EAAE,EAChD,QAAQ,EAAE,CAAC,GAAG,IAAI,EAAE,IAAI,KAAK,IAAI,EACjC,KAAK,EAAE,MAAM,aAKD,IAAI,UAUjB;AAED,eAAO,MAAM,yBAAyB,GACpC,UAAU,WAAW,EACrB,eAAe,MAAM,KAOhB,aACN,CAAC;AAEF,eAAO,MAAM,4BAA4B,GACvC,UAAU,WAAW,EACrB,eAAe,MAAM,KAOhB,aACN,CAAC;AAEF,eAAO,MAAM,SAAS,GAAI,OAAO,MAAM,KAAG,MAMzC,CAAC;AAEF,eAAO,MAAM,UAAU,GACrB,UAAU,MAAM,EAChB,QAAQ,MAAM,EACd,OAAO,MAAM,KACZ,MAMF,CAAC;AACF,eAAO,MAAM,UAAU,GAAI,SAAS,MAAM,EAAE,OAAO,MAAM,KAAG,MAM3D,CAAC;AACF,eAAO,MAAM,WAAW,GACtB,SAAS,MAAM,EACf,UAAU,MAAM,EAChB,QAAQ,MAAM,EACd,OAAO,MAAM,KACZ,MAMF,CAAC;AACF,eAAO,MAAM,aAAa,GAAI,OAAO,MAAM,KAAG,MAM7C,CAAC;AACF,eAAO,MAAM,aAAa,GACxB,KAAK,MAAM,EAEX,KAAK,GAAG,EACR,QAAQ,OAAO,KACd,MAKF,CAAC;AACF,eAAO,MAAM,WAAW,GAAI,YAAY,MAAM,KAAG,MAKhD,CAAC;AACF,eAAO,MAAM,WAAW,GAAI,OAAO,MAAM,KAAG,MAK3C,CAAC"}
|
package/dist/utils.js
CHANGED
|
@@ -1,21 +1,32 @@
|
|
|
1
|
-
import
|
|
2
|
-
import "
|
|
3
|
-
import
|
|
4
|
-
import "
|
|
1
|
+
import dayjs from "dayjs";
|
|
2
|
+
import "dayjs/locale/ru";
|
|
3
|
+
import timezone from "dayjs/plugin/timezone";
|
|
4
|
+
import utc from "dayjs/plugin/utc";
|
|
5
5
|
import { useCallback, useRef } from "react";
|
|
6
6
|
import { slugify } from "transliteration";
|
|
7
|
+
dayjs.extend(utc);
|
|
8
|
+
dayjs.extend(timezone);
|
|
7
9
|
export function getCSRFToken() {
|
|
8
10
|
return document.getElementsByName("csrfmiddlewaretoken")[0].value;
|
|
9
11
|
}
|
|
10
12
|
export function setCSRFToken(newToken) {
|
|
11
13
|
document.getElementsByName("csrfmiddlewaretoken")[0].value = newToken;
|
|
12
14
|
}
|
|
13
|
-
export function prettyDatetime(datetime) {
|
|
14
|
-
if (datetime
|
|
15
|
-
return moment_tz(datetime).locale("ru").format("dd DD MMM YYYY, HH:mm:ss");
|
|
16
|
-
}
|
|
17
|
-
else {
|
|
15
|
+
export function prettyDatetime(datetime, utc) {
|
|
16
|
+
if (!datetime || datetime.length === 0)
|
|
18
17
|
return "";
|
|
18
|
+
const fmt = "dd DD MMM YYYY, HH:mm:ss";
|
|
19
|
+
const tz = dayjs.tz.guess();
|
|
20
|
+
try {
|
|
21
|
+
if (utc) {
|
|
22
|
+
return dayjs.utc(datetime).tz(tz).locale("ru").format(fmt);
|
|
23
|
+
}
|
|
24
|
+
else {
|
|
25
|
+
return dayjs.tz(datetime, tz).locale("ru").format(fmt);
|
|
26
|
+
}
|
|
27
|
+
}
|
|
28
|
+
catch {
|
|
29
|
+
return datetime;
|
|
19
30
|
}
|
|
20
31
|
}
|
|
21
32
|
export const taskStateText = (taskState) => {
|
|
@@ -36,23 +47,17 @@ export const taskStateText = (taskState) => {
|
|
|
36
47
|
return "Нет состояния";
|
|
37
48
|
}
|
|
38
49
|
};
|
|
39
|
-
export const formatDate = (date) => {
|
|
40
|
-
return new Date(date).toLocaleString("ru", {
|
|
41
|
-
weekday: "short",
|
|
42
|
-
month: "short",
|
|
43
|
-
day: "numeric",
|
|
44
|
-
year: "numeric",
|
|
45
|
-
hour: "2-digit",
|
|
46
|
-
minute: "2-digit",
|
|
47
|
-
second: "2-digit",
|
|
48
|
-
timeZone: "Europe/Moscow",
|
|
49
|
-
});
|
|
50
|
-
};
|
|
51
50
|
export const formatDuration = (duration) => {
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
51
|
+
const d = dayjs.duration(duration, "seconds");
|
|
52
|
+
const totalSeconds = d.asSeconds();
|
|
53
|
+
const hours = Math.floor(totalSeconds / 3600);
|
|
54
|
+
if (hours > 0)
|
|
55
|
+
return `${hours} ч`;
|
|
56
|
+
const minutes = Math.floor(totalSeconds / 60);
|
|
57
|
+
if (minutes > 0)
|
|
58
|
+
return `${minutes} мин`;
|
|
59
|
+
const seconds = totalSeconds;
|
|
60
|
+
return `${Number(seconds.toFixed(1))} сек`;
|
|
56
61
|
};
|
|
57
62
|
export const getSlugTableName = (name) => {
|
|
58
63
|
const replaces = {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@danikokonn/yarik-frontend-lib",
|
|
3
|
-
"version": "2.1.
|
|
3
|
+
"version": "2.1.4",
|
|
4
4
|
"license": "Apache-2.0",
|
|
5
5
|
"description": "",
|
|
6
6
|
"author": "",
|
|
@@ -14,6 +14,7 @@
|
|
|
14
14
|
},
|
|
15
15
|
"devDependencies": {
|
|
16
16
|
"@eslint/js": "^9.34.0",
|
|
17
|
+
"@tsconfig/strictest": "^2.0.8",
|
|
17
18
|
"@testing-library/jest-dom": "^6.9.1",
|
|
18
19
|
"@testing-library/react": "^16.3.2",
|
|
19
20
|
"@testing-library/user-event": "^14.6.1",
|
|
@@ -21,7 +22,7 @@
|
|
|
21
22
|
"@types/moment-duration-format": "^2.2.7",
|
|
22
23
|
"@types/react": "^19.2.14",
|
|
23
24
|
"@types/react-dom": "^19.2.3",
|
|
24
|
-
"@vitest/coverage-v8": "^4.1.
|
|
25
|
+
"@vitest/coverage-v8": "^4.1.2",
|
|
25
26
|
"eslint": "^9.39.4",
|
|
26
27
|
"eslint-plugin-react": "^7.37.5",
|
|
27
28
|
"eslint-plugin-unicorn": "^62.0.0",
|
|
@@ -30,35 +31,28 @@
|
|
|
30
31
|
"prettier": "3.6.2",
|
|
31
32
|
"react": "^19.2.4",
|
|
32
33
|
"react-dom": "^19.2.4",
|
|
33
|
-
"ts-loader": "^9.5.4",
|
|
34
|
-
"tss-react": "^4.9.20",
|
|
35
34
|
"typescript": "^5.9.3",
|
|
36
|
-
"typescript-eslint": "^8.57.
|
|
35
|
+
"typescript-eslint": "^8.57.2",
|
|
37
36
|
"vitest": "^4.1.0"
|
|
38
37
|
},
|
|
39
38
|
"dependencies": {
|
|
39
|
+
"dayjs": "^1.11.20",
|
|
40
|
+
"react-json-tree": "^0.20.0",
|
|
41
|
+
"transliteration": "^2.6.1"
|
|
42
|
+
},
|
|
43
|
+
"peerDependencies": {
|
|
40
44
|
"@emotion/react": "^11.14.0",
|
|
41
45
|
"@emotion/styled": "^11.14.1",
|
|
42
46
|
"@mui/icons-material": "^7.3.9",
|
|
43
47
|
"@mui/material": "^7.3.9",
|
|
44
48
|
"@mui/x-date-pickers": "^8.27.2",
|
|
45
|
-
"@tsconfig/strictest": "^2.0.8",
|
|
46
|
-
"css-loader": "^7.1.4",
|
|
47
|
-
"moment": "^2.30.1",
|
|
48
|
-
"moment-duration-format": "^2.3.2",
|
|
49
|
-
"moment-timezone": "^0.6.1",
|
|
50
49
|
"notistack": "^3.0.2",
|
|
50
|
+
"react": ">=18 <20",
|
|
51
|
+
"react-dom": ">=18 <20",
|
|
51
52
|
"react-imask": "^7.6.1",
|
|
52
|
-
"react-
|
|
53
|
-
"react-router": "^7.13.1",
|
|
53
|
+
"react-router": "^7.13.2",
|
|
54
54
|
"react-virtuoso": "^4.18.3",
|
|
55
|
-
"
|
|
56
|
-
"swr": "^2.4.1",
|
|
57
|
-
"transliteration": "^2.6.1"
|
|
58
|
-
},
|
|
59
|
-
"peerDependencies": {
|
|
60
|
-
"react": ">=18 <20",
|
|
61
|
-
"react-dom": ">=18 <20"
|
|
55
|
+
"swr": "^2.4.1"
|
|
62
56
|
},
|
|
63
57
|
"scripts": {
|
|
64
58
|
"test": "vitest",
|