@danikokonn/yarik-frontend-lib 2.1.3 → 2.1.4

package/dist/components/SubtaskItem/SubtaskItem.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SubtaskItem.d.ts","sourceRoot":"","sources":["../../../src/components/SubtaskItem/SubtaskItem.tsx"],"names":[],"mappings":"AAgBA,OAAO,gBAAgB,MAAM,oBAAoB,CAAC;AAyBlD,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,EAClC,YAAY,EACZ,IAAI,EACJ,QAAQ,EACR,UAAU,EACV,uBAAuB,GACxB,EAAE,gBAAgB,2CAsIlB"}
+{"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"}

package/dist/components/SubtaskItem/SubtaskItem.js

@@ -11,9 +11,11 @@ import Accordion from "@mui/material/Accordion";
 import AccordionDetails from "@mui/material/AccordionDetails";
 import AccordionSummary from "@mui/material/AccordionSummary";
 import CircularProgress from "@mui/material/CircularProgress";
-import moment from "moment";
+import dayjs from "dayjs";
+import duration from "dayjs/plugin/duration";
 import { useEffect, useState } from "react";
-import { taskStateText } from "../../utils";
+import { formatDuration, prettyDatetime, taskStateText } from "../../utils";
+dayjs.extend(duration);
 const SubtaskState = ({ state }) => {
     switch (state) {
         case "success":
@@ -46,21 +48,10 @@ export default function SubtaskItem({ taskInstance, logs, expanded, onShowLogs,
             setCopyText("Копировать");
         }
     }, [expanded]);
-    const formatEndDate = new Date(taskInstance.executionDate).toLocaleString("ru", {
-        weekday: "short",
-        month: "short",
-        day: "numeric",
-        year: "numeric",
-        hour: "2-digit",
-        minute: "2-digit",
-        second: "2-digit",
-    });
-    const formatTaskDuration = moment
-        .duration(taskInstance.duration, "seconds")
-        .format({
-        precision: 1,
-        template: "h [ч], m [мин], s [сек]",
-    });
+    const formatEndDate = prettyDatetime(taskInstance.executionDate, true);
+    const formatTaskDuration = taskInstance.duration !== null
+        ? formatDuration(taskInstance.duration)
+        : "н/д";
     return (_jsxs(Accordion, { disableGutters: true, expanded: expanded, onChange: () => onShowLogs(taskInstance.taskId, taskInstance.tryNumber), disabled: !["running", "success", "failed"].includes(taskInstance.state || ""), sx: {
             position: "relative",
         }, 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"

package/dist/components/TaskLoader/TaskLoader.js

@@ -17,7 +17,7 @@ import useSWR from "swr";
 import { postRequest } from "../../http";
 import { useAirflowContext } from "../../providers/AirflowProvider";
 import { useDagRunStateContext } from "../../providers/DagStateProvider";
-import { formatDate, formatDuration, getCSRFToken, taskStateText, useDebounce, } from "../../utils";
+import { formatDuration, getCSRFToken, prettyDatetime, taskStateText, useDebounce, } from "../../utils";
 import ProcessingIcon from "../icons/ProcessingIcon";
 import SubtaskItem from "../SubtaskItem/SubtaskItem";
 const TaskStateIcon = ({ taskState, }) => {
@@ -228,7 +228,7 @@ const TaskLoader = ({ style, subTitle, onUnauthorized }) => {
             },
         });
     }, 200);
-    const formatEndDate = formatDate(dagRun?.logicalDate || "");
+    const formatEndDate = prettyDatetime(dagRun?.logicalDate, true);
     const formatTaskDuration = formatDuration(taskInstances?.taskInstances.reduce((a, b) => a + (b.duration || 0), 0) ||
         0);
     const activeTaskElem = taskInstances?.taskInstances.find((ti) => {

package/dist/utils.d.ts

@@ -1,12 +1,10 @@
 import { PopoverOrigin } from "@mui/material";
-import "moment-duration-format";
-import "moment/locale/ru";
+import "dayjs/locale/ru";
 import { DagState, TaskState } from "./types";
 export declare function getCSRFToken(): string;
 export declare function setCSRFToken(newToken: string): void;
-export declare function prettyDatetime(datetime?: string | null): string;
+export declare function prettyDatetime(datetime?: string | null, utc?: boolean): string;
 export declare const taskStateText: (taskState: DagState | TaskState | string | null | undefined) => "Завершена" | "Ошибка" | "В очереди" | "Запланирована" | "Выполняется" | "Недоступно" | "Нет состояния";
-export declare const formatDate: (date: string) => string;
 export declare const formatDuration: (duration: number) => string;
 export declare const getSlugTableName: (name: string) => string;
 export declare const getShiftedColor: (colorHex: string, shift: number) => string;

package/dist/utils.d.ts.map

@@ -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,wBAAwB,CAAC;AAEhC,OAAO,kBAAkB,CAAC;AAG1B,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAE9C,wBAAgB,YAAY,WAI3B;AAED,wBAAgB,YAAY,CAAC,QAAQ,EAAE,MAAM,QAI5C;AAED,wBAAgB,cAAc,CAAC,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,UAMtD;AAED,eAAO,MAAM,aAAa,GACxB,WAAW,QAAQ,GAAG,SAAS,GAAG,MAAM,GAAG,IAAI,GAAG,SAAS,4GAkB5D,CAAC;AAEF,eAAO,MAAM,UAAU,GAAI,MAAM,MAAM,WAWtC,CAAC;AAEF,eAAO,MAAM,cAAc,GAAI,UAAU,MAAM,WAK9C,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"}
+{"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

@@ -1,21 +1,32 @@
-import moment from "moment";
-import "moment-duration-format";
-import moment_tz from "moment-timezone";
-import "moment/locale/ru";
+import dayjs from "dayjs";
+import "dayjs/locale/ru";
+import timezone from "dayjs/plugin/timezone";
+import utc from "dayjs/plugin/utc";
 import { useCallback, useRef } from "react";
 import { slugify } from "transliteration";
+dayjs.extend(utc);
+dayjs.extend(timezone);
 export function getCSRFToken() {
     return document.getElementsByName("csrfmiddlewaretoken")[0].value;
 }
 export function setCSRFToken(newToken) {
     document.getElementsByName("csrfmiddlewaretoken")[0].value = newToken;
 }
-export function prettyDatetime(datetime) {
-    if (datetime && datetime.length > 0) {
-        return moment_tz(datetime).locale("ru").format("dd DD MMM YYYY, HH:mm:ss");
-    }
-    else {
+export function prettyDatetime(datetime, utc) {
+    if (!datetime || datetime.length === 0)
         return "";
+    const fmt = "dd DD MMM YYYY, HH:mm:ss";
+    const tz = dayjs.tz.guess();
+    try {
+        if (utc) {
+            return dayjs.utc(datetime).tz(tz).locale("ru").format(fmt);
+        }
+        else {
+            return dayjs.tz(datetime, tz).locale("ru").format(fmt);
+        }
+    }
+    catch {
+        return datetime;
     }
 }
 export const taskStateText = (taskState) => {
@@ -36,23 +47,17 @@ export const taskStateText = (taskState) => {
             return "Нет состояния";
     }
 };
-export const formatDate = (date) => {
-    return new Date(date).toLocaleString("ru", {
-        weekday: "short",
-        month: "short",
-        day: "numeric",
-        year: "numeric",
-        hour: "2-digit",
-        minute: "2-digit",
-        second: "2-digit",
-        timeZone: "Europe/Moscow",
-    });
-};
 export const formatDuration = (duration) => {
-    return moment.duration(duration, "seconds").format({
-        precision: 1,
-        template: "h [ч], m [мин], s [сек]",
-    });
+    const d = dayjs.duration(duration, "seconds");
+    const totalSeconds = d.asSeconds();
+    const hours = Math.floor(totalSeconds / 3600);
+    if (hours > 0)
+        return `${hours} ч`;
+    const minutes = Math.floor(totalSeconds / 60);
+    if (minutes > 0)
+        return `${minutes} мин`;
+    const seconds = totalSeconds;
+    return `${Number(seconds.toFixed(1))} сек`;
 };
 export const getSlugTableName = (name) => {
     const replaces = {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@danikokonn/yarik-frontend-lib",
-  "version": "2.1.3",
+  "version": "2.1.4",
   "license": "Apache-2.0",
   "description": "",
   "author": "",
@@ -14,6 +14,7 @@
   },
   "devDependencies": {
     "@eslint/js": "^9.34.0",
+    "@tsconfig/strictest": "^2.0.8",
     "@testing-library/jest-dom": "^6.9.1",
     "@testing-library/react": "^16.3.2",
     "@testing-library/user-event": "^14.6.1",
@@ -30,21 +31,13 @@
     "prettier": "3.6.2",
     "react": "^19.2.4",
     "react-dom": "^19.2.4",
-    "ts-loader": "^9.5.4",
-    "tss-react": "^4.9.20",
     "typescript": "^5.9.3",
     "typescript-eslint": "^8.57.2",
     "vitest": "^4.1.0"
   },
   "dependencies": {
-    "@tsconfig/strictest": "^2.0.8",
-    "css-loader": "^7.1.4",
     "dayjs": "^1.11.20",
-    "moment": "^2.30.1",
-    "moment-duration-format": "^2.3.2",
-    "moment-timezone": "^0.6.1",
     "react-json-tree": "^0.20.0",
-    "style-loader": "^4.0.0",
     "transliteration": "^2.6.1"
   },
   "peerDependencies": {