npm - @gravity-ui/querieskit - Versions diffs - 1.4.0 → 1.5.0 - Mend

@gravity-ui/querieskit 1.4.0 → 1.5.0

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.

Files changed (41) hide show

package/build/cjs/components/LazyList/LazyList.css CHANGED Viewed

@@ -3,6 +3,10 @@
 }
 .qp-lazy-list__sentinel {
   height: 1px;
+  width: 100%;
+}
+.qp-lazy-list__sentinel_loading {
+  height: 40px;
 }
 .qp-lazy-list__spinner {
   height: 100%;

package/build/cjs/components/LazyList/LazyList.css.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["LazyList.scss"],"names":[],"mappings":"AACE;EACE,qDAAA;AAAJ;AAGE;EACE,WAAA;AADJ;~~AAIE~~;EACE,YAAA;~~AAFJ~~","file":"LazyList.css","sourcesContent":[".qp-lazy-list {\n .g-list__item_selected:hover {\n background-color: var(--g-color-base-selection-hover);\n }\n\n &__sentinel {\n height: 1px;\n }\n\n &__spinner {\n height: 100%;\n }\n}\n"],"sourceRoot":""}
1	+ {"version":3,"sources":["LazyList.scss"],"names":[],"mappings":"AACE;EACE,qDAAA;AAAJ;AAGE;EACE,WAAA;EACA,WAAA;AADJ;AAGI;EACE,YAAA;AADN;AAKE;EACE,YAAA;AAHJ","file":"LazyList.css","sourcesContent":[".qp-lazy-list {\n .g-list__item_selected:hover {\n background-color: var(--g-color-base-selection-hover);\n }\n\n &__sentinel {\n height: 1px;\n width: 100%;\n\n &_loading {\n height: 40px;\n }\n }\n\n &__spinner {\n height: 100%;\n }\n}\n"],"sourceRoot":""}

package/build/cjs/components/LazyList/LazyList.js CHANGED Viewed

@@ -22,6 +22,7 @@ function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 var block = (0, _bemCnLite.default)('qp-lazy-list');
 var SENTINEL_ROW_HEIGHT = 1;
+var LOADING_ROW_HEIGHT = 40;
 var isSentinelRow = function isSentinelRow(row) {
   return Boolean(row) && (0, _typeof2.default)(row) === 'object' && '__sentinel' in row;
 };
@@ -41,24 +42,36 @@ var LazyList = exports.LazyList = function LazyList(_ref) {
     isEmpty = _ref.isEmpty,
     className = _ref.className;
   var listRef = (0, _react.useRef)(null);
-  var previousItemsLengthRef = (0, _react.useRef)(items.length);
+  var previousListStateRef = (0, _react.useRef)({
+    itemsLength: items.length,
+    loading: loading,
+    hasMore: hasMore
+  });
   var sentinelRef = (0, _useLoadMoreSentinel.useLoadMoreSentinel)(hasMore, onLoadMore, loading, items.length);
   var rows = (0, _react.useMemo)(function () {
-    return hasMore ? [].concat((0, _toConsumableArray2.default)(items), [{
+    return hasMore || loading ? [].concat((0, _toConsumableArray2.default)(items), [{
       __sentinel: true
     }]) : items;
-  }, [items, hasMore]);
+  }, [items, hasMore, loading]);
   var getRowHeight = function getRowHeight(row) {
-    return isSentinelRow(row) ? SENTINEL_ROW_HEIGHT : itemHeight(row);
+    if (isSentinelRow(row)) {
+      return loading ? LOADING_ROW_HEIGHT : SENTINEL_ROW_HEIGHT;
+    }
+    return itemHeight(row);
   };
   (0, _react.useLayoutEffect)(function () {
-    var previousItemsLength = previousItemsLengthRef.current;
-    if (previousItemsLength !== items.length) {
+    var previousListState = previousListStateRef.current;
+    var listStateChanged = previousListState.itemsLength !== items.length || previousListState.loading !== loading || previousListState.hasMore !== hasMore;
+    if (listStateChanged) {
       var _listRef$current;
-      (_listRef$current = listRef.current) === null || _listRef$current === void 0 || (_listRef$current = _listRef$current.refContainer.current) === null || _listRef$current === void 0 || _listRef$current.resetAfterIndex(Math.min(previousItemsLength, items.length), true);
-      previousItemsLengthRef.current = items.length;
+      (_listRef$current = listRef.current) === null || _listRef$current === void 0 || (_listRef$current = _listRef$current.refContainer.current) === null || _listRef$current === void 0 || _listRef$current.resetAfterIndex(Math.min(previousListState.itemsLength, items.length), true);
+      previousListStateRef.current = {
+        itemsLength: items.length,
+        loading: loading,
+        hasMore: hasMore
+      };
     }
-  }, [items.length]);
+  }, [hasMore, items.length, loading]);
   if (error) {
     return /*#__PURE__*/(0, _jsxRuntime.jsx)(_react.default.Fragment, {
       children: error
@@ -89,7 +102,16 @@ var LazyList = exports.LazyList = function LazyList(_ref) {
     renderItem: function renderItem(row, isActive, index) {
       return isSentinelRow(row) ? /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
         ref: sentinelRef,
-        className: block('sentinel')
+        className: block('sentinel', {
+          loading: Boolean(loading)
+        }),
+        children: loading && /*#__PURE__*/(0, _jsxRuntime.jsx)(_uikit.Flex, {
+          alignItems: "center",
+          justifyContent: "center",
+          width: "100%",
+          height: "100%",
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_uikit.Loader, {})
+        })
       }) : _renderItem(row, isActive, index);
     },
     selectedItemIndex: selectedItemIndex,

package/build/cjs/components/LazyList/LazyList.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["_react","_interopRequireWildcard","require","_uikit","_bemCnLite","_interopRequireDefault","_useLoadMoreSentinel","_ListSpinner","_jsxRuntime","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","block","cn","SENTINEL_ROW_HEIGHT","isSentinelRow","row","Boolean","_typeof","LazyList","exports","_ref","items","itemHeight","renderItem","hasMore","onLoadMore","onItemClick","selectedItemIndex","_ref$filterable","filterable","loading","error","emptyContent","isEmpty","className","listRef","useRef","previousItemsLengthRef","length","sentinelRef","useLoadMoreSentinel","rows","useMemo","concat","_toConsumableArray","__sentinel","getRowHeight","useLayoutEffect","previousItemsLength","current","_listRef$current","refContainer","resetAfterIndex","Math","min","_jsx","React","Fragment","children","empty","ListSpinner","List","ref","itemsHeight","listRows","reduce","total","isActive","index","_renderItem","_onItemClick"],"sources":["LazyList.tsx"],"sourcesContent":["import React, {useLayoutEffect, useMemo, useRef} from 'react';\nimport {List} from '@gravity-ui/uikit';\nimport cn from 'bem-cn-lite';\nimport {useLoadMoreSentinel} from '../../helpers/useLoadMoreSentinel';\nimport {ListSpinner} from '../ListSpinner';\nimport './LazyList.scss';\n\nconst block = cn('qp-lazy-list');\n\nconst SENTINEL_ROW_HEIGHT = 1;\n\ntype SentinelRow = {__sentinel: true};\ntype LazyListRow<T> = T \| SentinelRow;\n\nconst isSentinelRow = <T,>(row: LazyListRow<T>): row is SentinelRow =>\n Boolean(row) && typeof row === 'object' && '__sentinel' in (row as object);\n\nexport type LazyListProps<T extends object> = {\n items: T[];\n itemHeight: (item: T) => number;\n renderItem: (item: T, isActive: boolean, index: number) => React.ReactNode;\n hasMore?: boolean;\n onLoadMore?: () => void;\n onItemClick?: (item: T, index: number) => void;\n selectedItemIndex?: T[keyof T] \| number;\n filterable?: boolean;\n loading?: boolean;\n error?: React.ReactNode;\n emptyContent?: React.ReactNode;\n isEmpty?: boolean;\n className?: string;\n};\n\nexport const LazyList = <T extends object>({\n items,\n itemHeight,\n renderItem,\n hasMore,\n onLoadMore,\n onItemClick,\n selectedItemIndex,\n filterable = false,\n loading,\n error,\n emptyContent,\n isEmpty,\n className,\n}: LazyListProps<T>) => {\n const listRef = useRef<List<LazyListRow<T>>>(null);\n const previousItemsLengthRef = useRef(items.length);\n const sentinelRef = useLoadMoreSentinel(hasMore, onLoadMore, loading, items.length);\n\n const rows: LazyListRow<T>[] = useMemo(\n () => (hasMore ? [...items, {__sentinel: true}] : items),\n [items, hasMore],\n );\n\n const getRowHeight = (row: LazyListRow<T>) =>\n isSentinelRow(row) ? SENTINEL_ROW_HEIGHT : itemHeight(row);\n\n useLayoutEffect(() => {\n const previousItemsLength = previousItemsLengthRef.current;\n\n if (previousItemsLength !== items.length) {\n listRef.current?.refContainer.current?.resetAfterIndex(\n Math.min(previousItemsLength, items.length),\n true,\n );\n previousItemsLengthRef.current = items.length;\n }\n }, [items.length]);\n\n if (error) {\n return <React.Fragment>{error}</React.Fragment>;\n }\n\n const empty = isEmpty ?? !items.length;\n\n if (loading && empty) {\n return <ListSpinner className={block('spinner', className)} />;\n }\n\n if (empty) {\n return <React.Fragment>{emptyContent}</React.Fragment>;\n }\n\n return (\n <List<LazyListRow<T>>\n ref={listRef}\n className={block(null, className)}\n filterable={filterable}\n items={rows}\n itemHeight={getRowHeight}\n itemsHeight={(listRows) =>\n listRows.reduce((total, row) => total + getRowHeight(row), 0)\n }\n renderItem={(row, isActive, index) =>\n isSentinelRow(row) ? (\n <div ref={sentinelRef} className={block('sentinel')} />\n ) : (\n renderItem(row, isActive, index)\n )\n }\n selectedItemIndex={selectedItemIndex as never}\n onItemClick={(row, index) => {\n if (!isSentinelRow(row)) {\n onItemClick?.(row, index);\n }\n }}\n />\n );\n};\n"],"mappings":"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","ignoreList":[]}
1	+ {"version":3,"names":["_react","_interopRequireWildcard","require","_uikit","_bemCnLite","_interopRequireDefault","_useLoadMoreSentinel","_ListSpinner","_jsxRuntime","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","block","cn","SENTINEL_ROW_HEIGHT","LOADING_ROW_HEIGHT","isSentinelRow","row","Boolean","_typeof","LazyList","exports","_ref","items","itemHeight","renderItem","hasMore","onLoadMore","onItemClick","selectedItemIndex","_ref$filterable","filterable","loading","error","emptyContent","isEmpty","className","listRef","useRef","previousListStateRef","itemsLength","length","sentinelRef","useLoadMoreSentinel","rows","useMemo","concat","_toConsumableArray","__sentinel","getRowHeight","useLayoutEffect","previousListState","current","listStateChanged","_listRef$current","refContainer","resetAfterIndex","Math","min","_jsx","React","Fragment","children","empty","ListSpinner","List","ref","itemsHeight","listRows","reduce","total","isActive","index","Flex","alignItems","justifyContent","width","height","Loader","_renderItem","_onItemClick"],"sources":["LazyList.tsx"],"sourcesContent":["import React, {useLayoutEffect, useMemo, useRef} from 'react';\nimport {Flex, List, Loader} from '@gravity-ui/uikit';\nimport cn from 'bem-cn-lite';\nimport {useLoadMoreSentinel} from '../../helpers/useLoadMoreSentinel';\nimport {ListSpinner} from '../ListSpinner';\nimport './LazyList.scss';\n\nconst block = cn('qp-lazy-list');\n\nconst SENTINEL_ROW_HEIGHT = 1;\nconst LOADING_ROW_HEIGHT = 40;\n\ntype SentinelRow = {__sentinel: true};\ntype LazyListRow<T> = T \| SentinelRow;\n\nconst isSentinelRow = <T,>(row: LazyListRow<T>): row is SentinelRow =>\n Boolean(row) && typeof row === 'object' && '__sentinel' in (row as object);\n\nexport type LazyListProps<T extends object> = {\n items: T[];\n itemHeight: (item: T) => number;\n renderItem: (item: T, isActive: boolean, index: number) => React.ReactNode;\n hasMore?: boolean;\n onLoadMore?: () => void;\n onItemClick?: (item: T, index: number) => void;\n selectedItemIndex?: T[keyof T] \| number;\n filterable?: boolean;\n loading?: boolean;\n error?: React.ReactNode;\n emptyContent?: React.ReactNode;\n isEmpty?: boolean;\n className?: string;\n};\n\nexport const LazyList = <T extends object>({\n items,\n itemHeight,\n renderItem,\n hasMore,\n onLoadMore,\n onItemClick,\n selectedItemIndex,\n filterable = false,\n loading,\n error,\n emptyContent,\n isEmpty,\n className,\n}: LazyListProps<T>) => {\n const listRef = useRef<List<LazyListRow<T>>>(null);\n const previousListStateRef = useRef({itemsLength: items.length, loading, hasMore});\n const sentinelRef = useLoadMoreSentinel(hasMore, onLoadMore, loading, items.length);\n\n const rows: LazyListRow<T>[] = useMemo(\n () => (hasMore \|\| loading ? [...items, {__sentinel: true}] : items),\n [items, hasMore, loading],\n );\n\n const getRowHeight = (row: LazyListRow<T>) => {\n if (isSentinelRow(row)) {\n return loading ? LOADING_ROW_HEIGHT : SENTINEL_ROW_HEIGHT;\n }\n\n return itemHeight(row);\n };\n\n useLayoutEffect(() => {\n const previousListState = previousListStateRef.current;\n const listStateChanged =\n previousListState.itemsLength !== items.length \|\|\n previousListState.loading !== loading \|\|\n previousListState.hasMore !== hasMore;\n\n if (listStateChanged) {\n listRef.current?.refContainer.current?.resetAfterIndex(\n Math.min(previousListState.itemsLength, items.length),\n true,\n );\n previousListStateRef.current = {itemsLength: items.length, loading, hasMore};\n }\n }, [hasMore, items.length, loading]);\n\n if (error) {\n return <React.Fragment>{error}</React.Fragment>;\n }\n\n const empty = isEmpty ?? !items.length;\n\n if (loading && empty) {\n return <ListSpinner className={block('spinner', className)} />;\n }\n\n if (empty) {\n return <React.Fragment>{emptyContent}</React.Fragment>;\n }\n\n return (\n <List<LazyListRow<T>>\n ref={listRef}\n className={block(null, className)}\n filterable={filterable}\n items={rows}\n itemHeight={getRowHeight}\n itemsHeight={(listRows) =>\n listRows.reduce((total, row) => total + getRowHeight(row), 0)\n }\n renderItem={(row, isActive, index) =>\n isSentinelRow(row) ? (\n <div\n ref={sentinelRef}\n className={block('sentinel', {loading: Boolean(loading)})}\n >\n {loading && (\n <Flex\n alignItems=\"center\"\n justifyContent=\"center\"\n width=\"100%\"\n height=\"100%\"\n >\n <Loader />\n </Flex>\n )}\n </div>\n ) : (\n renderItem(row, isActive, index)\n )\n }\n selectedItemIndex={selectedItemIndex as never}\n onItemClick={(row, index) => {\n if (!isSentinelRow(row)) {\n onItemClick?.(row, index);\n }\n }}\n />\n );\n};\n"],"mappings":"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","ignoreList":[]}

package/build/cjs/components/QueryDuration/QueryDuration.stories.js CHANGED Viewed

@@ -48,6 +48,13 @@ var AllStatuses = exports.AllStatuses = {
         status: "aborted",
         startTime: fiveMinutesAgo,
         endTime: now
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_QueryDuration.QueryDuration, {
+        status: "completed",
+        startTime: now - (27 * 60 + 15) * 60 * 1000,
+        endTime: now
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_QueryDuration.QueryDuration, {
+        status: "completed",
+        startTime: fiveMinutesAgo
       }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_QueryDuration.QueryDuration, {
         status: "running",
         startTime: fiveMinutesAgo

package/build/cjs/components/QueryDuration/QueryDuration.stories.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["_react","_interopRequireDefault","require","_QueryDuration","_jsxRuntime","e","__esModule","default","now","Date","fiveMinutesAgo","oneHourAgo","meta","title","component","QueryDuration","tags","_default","exports","Default","args","status","startTime","AllStatuses","render","_jsxs","style","display","gap","flexWrap","alignItems","children","_jsx","endTime"],"sources":["QueryDuration.stories.tsx"],"sourcesContent":["import React from 'react';\nimport type {Meta, StoryObj} from '@storybook/react';\nimport {QueryDuration} from './QueryDuration';\n\nconst now = Date.now();\nconst fiveMinutesAgo = now - 5 * 60 * 1000;\nconst oneHourAgo = now - 60 * 60 * 1000;\n\nconst meta: Meta<typeof QueryDuration> = {\n title: 'Components/QueryDuration',\n component: QueryDuration,\n tags: ['autodocs'],\n};\n\nexport default meta;\ntype Story = StoryObj<typeof QueryDuration>;\n\n/** Live timer: endTime not provided — counter ticks every second /\nexport const Default: Story = {\n args: {\n status: 'running',\n startTime: fiveMinutesAgo,\n },\n};\n\n/* All variants side by side: Running updates in real time, Draft is static /\nexport const AllStatuses: Story = {\n render: () => (\n <div style={{display: 'flex', gap: 8, flexWrap: 'wrap', alignItems: 'center'}}>\n {/ Static /}\n <QueryDuration status=\"completed\" startTime={fiveMinutesAgo} endTime={now} />\n <QueryDuration status=\"failed\" startTime={oneHourAgo} endTime={now} />\n <QueryDuration status=\"aborted\" startTime={fiveMinutesAgo} endTime={now} />\n {/ Live timer /}\n <QueryDuration status=\"running\" startTime={fiveMinutesAgo} />\n {/ Always --:-- */}\n <QueryDuration status=\"draft\" startTime={now} />\n </div>\n ),\n};\n"],"mappings":";;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAEA,IAAAC,cAAA,GAAAD,OAAA;AAA8C,IAAAE,WAAA,GAAAF,OAAA;AAAA,SAAAD,uBAAAI,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAE9C,IAAMG,GAAG,GAAGC,IAAI,CAACD,GAAG,CAAC,CAAC;AACtB,IAAME,cAAc,GAAGF,GAAG,GAAG,CAAC,GAAG,EAAE,GAAG,IAAI;AAC1C,IAAMG,UAAU,GAAGH,GAAG,GAAG,EAAE,GAAG,EAAE,GAAG,IAAI;AAEvC,IAAMI,IAAgC,GAAG;EACrCC,KAAK,EAAE,0BAA0B;EACjCC,SAAS,EAAEC,4BAAa;EACxBC,IAAI,EAAE,CAAC,UAAU;AACrB,CAAC;AAAA,IAAAC,QAAA,GAAAC,OAAA,CAAAX,OAAA,GAEcK,IAAI;AAGnB;AACO,IAAMO,OAAc,GAAAD,OAAA,CAAAC,OAAA,GAAG;EAC1BC,IAAI,EAAE;IACFC,MAAM,EAAE,SAAS;IACjBC,SAAS,EAAEZ;EACf;AACJ,CAAC;;AAED;AACO,IAAMa,WAAkB,GAAAL,OAAA,CAAAK,WAAA,GAAG;EAC9BC,MAAM,EAAE,SAARA,MAAMA,CAAA;IAAA,oBACF,IAAAC,gBAAA;MAAKC,KAAK,EAAE;QAACC,OAAO,EAAE,MAAM;QAAEC,GAAG,EAAE,CAAC;QAAEC,QAAQ,EAAE,MAAM;QAAEC,UAAU,EAAE;MAAQ,CAAE;MAAAC,QAAA,gBAE1E,IAAAC,eAAA,EAACjB,4BAAa;QAACM,MAAM,EAAC,WAAW;QAACC,SAAS,EAAEZ,cAAe;QAACuB,OAAO,EAAEzB;MAAI,CAAE,CAAC,eAC7E,IAAAwB,eAAA,EAACjB,4BAAa;QAACM,MAAM,EAAC,QAAQ;QAACC,SAAS,EAAEX,UAAW;QAACsB,OAAO,EAAEzB;MAAI,CAAE,CAAC,eACtE,IAAAwB,eAAA,EAACjB,4BAAa;QAACM,MAAM,EAAC,SAAS;QAACC,SAAS,EAAEZ,cAAe;QAACuB,OAAO,EAAEzB;MAAI,CAAE,CAAC,~~eAE3E~~,IAAAwB,eAAA,EAACjB,4BAAa;QAACM,MAAM,EAAC,SAAS;QAACC,SAAS,EAAEZ;MAAe,CAAE,CAAC,eAE7D,IAAAsB,eAAA,EAACjB,4BAAa;QAACM,MAAM,EAAC,OAAO;QAACC,SAAS,EAAEd;MAAI,CAAE,CAAC;IAAA,CAC/C,CAAC;EAAA;AAEd,CAAC","ignoreList":[]}
1	+ {"version":3,"names":["_react","_interopRequireDefault","require","_QueryDuration","_jsxRuntime","e","__esModule","default","now","Date","fiveMinutesAgo","oneHourAgo","meta","title","component","QueryDuration","tags","_default","exports","Default","args","status","startTime","AllStatuses","render","_jsxs","style","display","gap","flexWrap","alignItems","children","_jsx","endTime"],"sources":["QueryDuration.stories.tsx"],"sourcesContent":["import React from 'react';\nimport type {Meta, StoryObj} from '@storybook/react';\nimport {QueryDuration} from './QueryDuration';\n\nconst now = Date.now();\nconst fiveMinutesAgo = now - 5 * 60 * 1000;\nconst oneHourAgo = now - 60 * 60 * 1000;\n\nconst meta: Meta<typeof QueryDuration> = {\n title: 'Components/QueryDuration',\n component: QueryDuration,\n tags: ['autodocs'],\n};\n\nexport default meta;\ntype Story = StoryObj<typeof QueryDuration>;\n\n/** Live timer: endTime not provided — counter ticks every second /\nexport const Default: Story = {\n args: {\n status: 'running',\n startTime: fiveMinutesAgo,\n },\n};\n\n/* All variants side by side: Running updates in real time, Draft is static /\nexport const AllStatuses: Story = {\n render: () => (\n <div style={{display: 'flex', gap: 8, flexWrap: 'wrap', alignItems: 'center'}}>\n {/ Static /}\n <QueryDuration status=\"completed\" startTime={fiveMinutesAgo} endTime={now} />\n <QueryDuration status=\"failed\" startTime={oneHourAgo} endTime={now} />\n <QueryDuration status=\"aborted\" startTime={fiveMinutesAgo} endTime={now} />\n <QueryDuration\n status=\"completed\"\n startTime={now - (27 60 + 15) * 60 * 1000}\n endTime={now}\n />\n <QueryDuration status=\"completed\" startTime={fiveMinutesAgo} />\n {/* Live timer /}\n <QueryDuration status=\"running\" startTime={fiveMinutesAgo} />\n {/ Always --:-- */}\n <QueryDuration status=\"draft\" startTime={now} />\n </div>\n ),\n};\n"],"mappings":";;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAEA,IAAAC,cAAA,GAAAD,OAAA;AAA8C,IAAAE,WAAA,GAAAF,OAAA;AAAA,SAAAD,uBAAAI,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAE9C,IAAMG,GAAG,GAAGC,IAAI,CAACD,GAAG,CAAC,CAAC;AACtB,IAAME,cAAc,GAAGF,GAAG,GAAG,CAAC,GAAG,EAAE,GAAG,IAAI;AAC1C,IAAMG,UAAU,GAAGH,GAAG,GAAG,EAAE,GAAG,EAAE,GAAG,IAAI;AAEvC,IAAMI,IAAgC,GAAG;EACrCC,KAAK,EAAE,0BAA0B;EACjCC,SAAS,EAAEC,4BAAa;EACxBC,IAAI,EAAE,CAAC,UAAU;AACrB,CAAC;AAAA,IAAAC,QAAA,GAAAC,OAAA,CAAAX,OAAA,GAEcK,IAAI;AAGnB;AACO,IAAMO,OAAc,GAAAD,OAAA,CAAAC,OAAA,GAAG;EAC1BC,IAAI,EAAE;IACFC,MAAM,EAAE,SAAS;IACjBC,SAAS,EAAEZ;EACf;AACJ,CAAC;;AAED;AACO,IAAMa,WAAkB,GAAAL,OAAA,CAAAK,WAAA,GAAG;EAC9BC,MAAM,EAAE,SAARA,MAAMA,CAAA;IAAA,oBACF,IAAAC,gBAAA;MAAKC,KAAK,EAAE;QAACC,OAAO,EAAE,MAAM;QAAEC,GAAG,EAAE,CAAC;QAAEC,QAAQ,EAAE,MAAM;QAAEC,UAAU,EAAE;MAAQ,CAAE;MAAAC,QAAA,gBAE1E,IAAAC,eAAA,EAACjB,4BAAa;QAACM,MAAM,EAAC,WAAW;QAACC,SAAS,EAAEZ,cAAe;QAACuB,OAAO,EAAEzB;MAAI,CAAE,CAAC,eAC7E,IAAAwB,eAAA,EAACjB,4BAAa;QAACM,MAAM,EAAC,QAAQ;QAACC,SAAS,EAAEX,UAAW;QAACsB,OAAO,EAAEzB;MAAI,CAAE,CAAC,eACtE,IAAAwB,eAAA,EAACjB,4BAAa;QAACM,MAAM,EAAC,SAAS;QAACC,SAAS,EAAEZ,cAAe;QAACuB,OAAO,EAAEzB;MAAI,CAAE,CAAC,eAC3E,IAAAwB,eAAA,EAACjB,4BAAa;QACVM,MAAM,EAAC,WAAW;QAClBC,SAAS,EAAEd,GAAG,GAAG,CAAC,EAAE,GAAG,EAAE,GAAG,EAAE,IAAI,EAAE,GAAG,IAAK;QAC5CyB,OAAO,EAAEzB;MAAI,CAChB,CAAC,eACF,IAAAwB,eAAA,EAACjB,4BAAa;QAACM,MAAM,EAAC,WAAW;QAACC,SAAS,EAAEZ;MAAe,CAAE,CAAC,eAE/D,IAAAsB,eAAA,EAACjB,4BAAa;QAACM,MAAM,EAAC,SAAS;QAACC,SAAS,EAAEZ;MAAe,CAAE,CAAC,eAE7D,IAAAsB,eAAA,EAACjB,4BAAa;QAACM,MAAM,EAAC,OAAO;QAACC,SAAS,EAAEd;MAAI,CAAE,CAAC;IAAA,CAC/C,CAAC;EAAA;AAEd,CAAC","ignoreList":[]}

package/build/cjs/components/QueryDuration/useQueryDuration.d.ts CHANGED Viewed

@@ -1,2 +1,2 @@
 import { QueryStatus } from '../../types/history';
-export declare const useQueryDuration: (state: QueryStatus, startTime?: string | number, endTime?: string | number) => string | undefined;
+export declare const useQueryDuration: (state: QueryStatus, startTime?: string | number, endTime?: string | number) => string;

package/build/cjs/components/QueryDuration/useQueryDuration.js CHANGED Viewed

@@ -6,35 +6,41 @@ Object.defineProperty(exports, "__esModule", {
 exports.useQueryDuration = void 0;
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 require("core-js/modules/es.array.includes.js");
+require("core-js/modules/es.date.now.js");
 require("core-js/modules/es.string.includes.js");
 require("core-js/modules/web.timers.js");
 var _react = require("react");
 var _query = require("../../constants/query");
 var _time = require("../../helpers/time");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+var calculateDuration = function calculateDuration(state, startTime, endTime) {
+  if (state === 'draft' || startTime === undefined) {
+    return '--:--';
+  }
+  if (_query.CompletedQueryStates.includes(state)) {
+    return endTime === undefined ? '--:--' : (0, _time.durationDates)(startTime, endTime);
+  }
+  return (0, _time.durationDates)(startTime, endTime !== null && endTime !== void 0 ? endTime : Date.now());
+};
 var useQueryDuration = exports.useQueryDuration = function useQueryDuration(state, startTime, endTime) {
-  var _useState = (0, _react.useState)((0, _time.durationDates)(startTime, endTime)),
+  var _useState = (0, _react.useState)(function () {
+      return calculateDuration(state, startTime, endTime);
+    }),
     _useState2 = (0, _slicedToArray2.default)(_useState, 2),
     duration = _useState2[0],
     setDuration = _useState2[1];
   (0, _react.useEffect)(function () {
-    if (state === 'draft' || !startTime) {
-      setDuration('--:--');
-      return;
-    }
-    if (_query.CompletedQueryStates.includes(state)) {
-      setDuration(endTime ? (0, _time.durationDates)(startTime, endTime) : '--:--');
-      return;
-    }
-    setDuration((0, _time.durationDates)(startTime, endTime));
-    if (endTime) {
-      return;
+    setDuration(calculateDuration(state, startTime, endTime));
+    var timer;
+    if (!(state === 'draft' || startTime === undefined || _query.CompletedQueryStates.includes(state) || endTime !== undefined)) {
+      timer = setInterval(function () {
+        return setDuration((0, _time.durationDates)(startTime, Date.now()));
+      }, 1000);
     }
-    var timer = setInterval(function () {
-      return setDuration((0, _time.durationDates)(startTime, endTime));
-    }, 1000);
     return function () {
-      clearInterval(timer);
+      if (timer !== undefined) {
+        clearInterval(timer);
+      }
     };
   }, [state, startTime, endTime]);
   return duration;

package/build/cjs/components/QueryDuration/useQueryDuration.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["_react","require","_query","_time","_interopRequireDefault","e","__esModule","default","~~useQueryDuration~~","~~exports","~~state","startTime","endTime","~~_useState~~","~~useState~~","durationDates","~~_useState2~~","~~_slicedToArray~~","~~duration~~","~~setDuration~~","~~useEffect~~","~~CompletedQueryStates~~","~~includes~~","timer","setInterval","clearInterval"],"sources":["useQueryDuration.ts"],"sourcesContent":["import {useEffect, useState} from 'react';\nimport {QueryStatus} from '../../types/history';\nimport {CompletedQueryStates} from '../../constants/query';\nimport {durationDates} from '../../helpers/time';\n\~~nexport~~ ~~const~~ ~~useQueryDuration~~ = (\n state: QueryStatus,\n startTime?: string \| number,\n endTime?: string \| number,\n) => {\n ~~const~~ ~~[duration,~~ ~~setDuration]~~ = ~~useState(durationDates(~~startTime, ~~endTime~~));\n\n ~~useEffect~~(() => {\n if ~~(state~~ === '~~draft~~' \|\| !startTime) {\n ~~setDuration~~(~~'--:--'~~);\n ~~return~~;\n }\~~n if~~ (~~CompletedQueryStates.includes(~~state)) {\n setDuration(~~endTime~~ ? ~~durationDates~~(startTime, endTime) ~~: '--:--'~~);\n ~~return;\~~n }\n setDuration(~~durationDates~~(startTime, endTime));\n if (~~endTime~~) {\n ~~return;\~~n }\n ~~const~~ timer = setInterval(() => setDuration(durationDates(startTime, ~~endTime~~)), 1000);\n\n return () => {\n clearInterval(timer);\n };\n }, [state, startTime, endTime]);\n\n return duration;\n};\n"],"mappings":"~~;;;;;;;;;;~~AAAA,IAAAA,MAAA,GAAAC,OAAA;AAEA,IAAAC,MAAA,GAAAD,OAAA;AACA,IAAAE,KAAA,GAAAF,OAAA;AAAqB,SAAAG,uBAAAC,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;~~AAEd~~,IAAMG,gBAAgB,GAAAC,OAAA,CAAAD,gBAAA,GAAG,SAAnBA,gBAAgBA,~~CACzBE~~,KAAkB,EAClBC,SAA2B,EAC3BC,OAAyB,EACxB;EACD,~~IAAAC~~,SAAA,GAAgC,IAAAC,eAAQ,EAAC,~~IAAAC~~,~~mBAAa~~,~~EAACJ~~,SAAS,EAAEC,OAAO,CAAC,~~CAAC~~;~~IAAAI~~,UAAA,OAAAC,uBAAA,~~EAAAJ~~,SAAA;~~IAApEK~~,QAAQ,GAAAF,UAAA;IAAEG,WAAW,GAAAH,UAAA;EAE5B,IAAAI,gBAAS,EAAC,YAAM;~~IACZ~~,~~IAAIV~~,~~KAAK~~,~~KAAK~~,~~OAAO~~,~~IAAI~~,~~CAACC~~,SAAS,~~EAAE;MACjCQ~~,~~WAAW~~,CAAC,~~OAAO,~~CAAC;~~MACpB;IACJ;IACA~~,~~IAAIE~~,~~2BAAoB~~,~~CAACC~~,~~QAAQ~~,~~CAACZ~~,KAAK,~~CAAC,EAAE;MACtCS,WAAW,CAACP,~~OAAO,~~GAAG~~,~~IAAAG~~,~~mBAAa~~,~~EAACJ,~~SAAS,~~EAAEC~~,~~OAAO~~,~~CAAC~~,~~GAAG~~,~~OAAO~~,~~CAAC;MAClE;IACJ;IACAO~~,~~WAAW,~~CAAC,~~IAAAJ~~,~~mBAAa~~,~~EAACJ~~,SAAS,~~EAAEC~~,~~OAAO,CAAC,CAAC;IAC9C,IAAIA,OAAO,~~EAAE;~~MACT;IACJ;IACA~~,~~IAAMW,~~KAAK,GAAGC,WAAW,CAAC;~~MAAA~~,~~OAAML~~,WAAW,CAAC,~~IAAAJ~~,mBAAa,~~EAACJ~~,SAAS,~~EAAEC~~,~~OAAO~~,CAAC,CAAC;~~IAAA~~,GAAE,IAAI,CAAC;~~IAErF~~,OAAO,YAAM;~~MACTa~~,aAAa,CAACF,KAAK,CAAC;~~IACxB~~,CAAC;EACL,CAAC,EAAE,~~CAACb~~,KAAK,EAAEC,SAAS,EAAEC,OAAO,CAAC,CAAC;EAE/B,~~OAAOM~~,QAAQ;AACnB,CAAC","ignoreList":[]}
1	+ {"version":3,"names":["_react","require","_query","_time","_interopRequireDefault","e","__esModule","default","calculateDuration","state","startTime","endTime","undefined","CompletedQueryStates","includes","durationDates","Date","now","useQueryDuration","exports","_useState","useState","_useState2","_slicedToArray","duration","setDuration","useEffect","timer","setInterval","clearInterval"],"sources":["useQueryDuration.ts"],"sourcesContent":["import {useEffect, useState} from 'react';\nimport {QueryStatus} from '../../types/history';\nimport {CompletedQueryStates} from '../../constants/query';\nimport {durationDates} from '../../helpers/time';\n\nconst calculateDuration = (\n state: QueryStatus,\n startTime?: string \| number,\n endTime?: string \| number,\n) => {\n if (state === 'draft' \|\| startTime === undefined) {\n return '--:--';\n }\n\n if (CompletedQueryStates.includes(state)) {\n return endTime === undefined ? '--:--' : durationDates(startTime, endTime);\n }\n\n return durationDates(startTime, endTime ?? Date.now());\n};\n\nexport const useQueryDuration = (\n state: QueryStatus,\n startTime?: string \| number,\n endTime?: string \| number,\n) => {\n const [duration, setDuration] = useState(() => calculateDuration(state, startTime, endTime));\n\n useEffect(() => {\n setDuration(calculateDuration(state, startTime, endTime));\n\n let timer: ReturnType<typeof setInterval> \| undefined;\n\n if (!(\n state === 'draft' \|\|\n startTime === undefined \|\|\n CompletedQueryStates.includes(state) \|\|\n endTime !== undefined\n )) {\n timer = setInterval(() => setDuration(durationDates(startTime, Date.now())), 1000);\n }\n\n return () => {\n if (timer !== undefined) {\n clearInterval(timer);\n }\n };\n }, [state, startTime, endTime]);\n\n return duration;\n};\n"],"mappings":";;;;;;;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AAEA,IAAAC,MAAA,GAAAD,OAAA;AACA,IAAAE,KAAA,GAAAF,OAAA;AAAqB,SAAAG,uBAAAC,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAErB,IAAMG,iBAAiB,GAAG,SAApBA,iBAAiBA,CACnBC,KAAkB,EAClBC,SAA2B,EAC3BC,OAAyB,EACxB;EACD,IAAIF,KAAK,KAAK,OAAO,IAAIC,SAAS,KAAKE,SAAS,EAAE;IAC9C,OAAO,OAAO;EAClB;EAEA,IAAIC,2BAAoB,CAACC,QAAQ,CAACL,KAAK,CAAC,EAAE;IACtC,OAAOE,OAAO,KAAKC,SAAS,GAAG,OAAO,GAAG,IAAAG,mBAAa,EAACL,SAAS,EAAEC,OAAO,CAAC;EAC9E;EAEA,OAAO,IAAAI,mBAAa,EAACL,SAAS,EAAEC,OAAO,aAAPA,OAAO,cAAPA,OAAO,GAAIK,IAAI,CAACC,GAAG,CAAC,CAAC,CAAC;AAC1D,CAAC;AAEM,IAAMC,gBAAgB,GAAAC,OAAA,CAAAD,gBAAA,GAAG,SAAnBA,gBAAgBA,CACzBT,KAAkB,EAClBC,SAA2B,EAC3BC,OAAyB,EACxB;EACD,IAAAS,SAAA,GAAgC,IAAAC,eAAQ,EAAC;MAAA,OAAMb,iBAAiB,CAACC,KAAK,EAAEC,SAAS,EAAEC,OAAO,CAAC;IAAA,EAAC;IAAAW,UAAA,OAAAC,uBAAA,EAAAH,SAAA;IAArFI,QAAQ,GAAAF,UAAA;IAAEG,WAAW,GAAAH,UAAA;EAE5B,IAAAI,gBAAS,EAAC,YAAM;IACZD,WAAW,CAACjB,iBAAiB,CAACC,KAAK,EAAEC,SAAS,EAAEC,OAAO,CAAC,CAAC;IAEzD,IAAIgB,KAAiD;IAErD,IAAI,EACAlB,KAAK,KAAK,OAAO,IACjBC,SAAS,KAAKE,SAAS,IACvBC,2BAAoB,CAACC,QAAQ,CAACL,KAAK,CAAC,IACpCE,OAAO,KAAKC,SAAS,CACxB,EAAE;MACCe,KAAK,GAAGC,WAAW,CAAC;QAAA,OAAMH,WAAW,CAAC,IAAAV,mBAAa,EAACL,SAAS,EAAEM,IAAI,CAACC,GAAG,CAAC,CAAC,CAAC,CAAC;MAAA,GAAE,IAAI,CAAC;IACtF;IAEA,OAAO,YAAM;MACT,IAAIU,KAAK,KAAKf,SAAS,EAAE;QACrBiB,aAAa,CAACF,KAAK,CAAC;MACxB;IACJ,CAAC;EACL,CAAC,EAAE,CAAClB,KAAK,EAAEC,SAAS,EAAEC,OAAO,CAAC,CAAC;EAE/B,OAAOa,QAAQ;AACnB,CAAC","ignoreList":[]}

package/build/cjs/helpers/time.d.ts CHANGED Viewed

@@ -1,7 +1,7 @@
 import { DateTime } from '@gravity-ui/date-utils';
 type Date = DateTime | string | number | undefined;
 export declare const formatTime: (date: Date) => string | undefined;
-export declare const durationDates: (date1: Date, date2: Date) => string | undefined;
+export declare const durationDates: (date1: Date, date2: Date) => string;
 export declare const formatTimeCanonical: (ts: Date) => string | undefined;
 export declare const formatDateCanonical: (ts: Date) => string | undefined;
 export declare const getTimestampFromDate: (date: Date) => number | undefined;

package/build/cjs/helpers/time.js CHANGED Viewed

@@ -4,29 +4,34 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.getTimestampFromDate = exports.formatTimeCanonical = exports.formatTime = exports.formatDateCanonical = exports.durationDates = void 0;
+require("core-js/modules/es.array.concat.js");
+require("core-js/modules/es.string.pad-start.js");
 var _dateUtils = require("@gravity-ui/date-utils");
 var formatTime = exports.formatTime = function formatTime(date) {
   var _dateTimeParse;
   return (_dateTimeParse = (0, _dateUtils.dateTimeParse)(date)) === null || _dateTimeParse === void 0 ? void 0 : _dateTimeParse.format('HH:mm');
 };
 var durationDates = exports.durationDates = function durationDates(date1, date2) {
-  var _dateTimeParse2;
-  if (!date1 && !date2) return '--:--';
-  var start = (0, _dateUtils.dateTimeParse)(date1) || (0, _dateUtils.dateTime)();
-  var end = (0, _dateUtils.dateTimeParse)(date2) || (0, _dateUtils.dateTime)();
-  var diff = end === null || end === void 0 ? void 0 : end.diff(start);
-  return (_dateTimeParse2 = (0, _dateUtils.dateTimeParse)(diff)) === null || _dateTimeParse2 === void 0 ? void 0 : _dateTimeParse2.format('HH:mm');
+  if (date1 === undefined || date2 === undefined) return '--:--';
+  var start = (0, _dateUtils.dateTimeParse)(date1);
+  var end = (0, _dateUtils.dateTimeParse)(date2);
+  if (!start || !end) return '--:--';
+  var diffMs = Math.max(0, end.valueOf() - start.valueOf());
+  var totalMinutes = Math.floor(diffMs / 60000);
+  var hours = Math.floor(totalMinutes / 60);
+  var minutes = totalMinutes % 60;
+  return "".concat(String(hours).padStart(2, '0'), ":").concat(String(minutes).padStart(2, '0'));
 };
 var formatTimeCanonical = exports.formatTimeCanonical = function formatTimeCanonical(ts) {
-  var _dateTimeParse3;
-  return (_dateTimeParse3 = (0, _dateUtils.dateTimeParse)(ts)) === null || _dateTimeParse3 === void 0 ? void 0 : _dateTimeParse3.format('DD.MM.YYYY, HH:mm');
+  var _dateTimeParse2;
+  return (_dateTimeParse2 = (0, _dateUtils.dateTimeParse)(ts)) === null || _dateTimeParse2 === void 0 ? void 0 : _dateTimeParse2.format('DD.MM.YYYY, HH:mm');
 };
 var formatDateCanonical = exports.formatDateCanonical = function formatDateCanonical(ts) {
-  var _dateTimeParse4;
-  return (_dateTimeParse4 = (0, _dateUtils.dateTimeParse)(ts)) === null || _dateTimeParse4 === void 0 ? void 0 : _dateTimeParse4.format('DD.MM.YYYY');
+  var _dateTimeParse3;
+  return (_dateTimeParse3 = (0, _dateUtils.dateTimeParse)(ts)) === null || _dateTimeParse3 === void 0 ? void 0 : _dateTimeParse3.format('DD.MM.YYYY');
 };
 var getTimestampFromDate = exports.getTimestampFromDate = function getTimestampFromDate(date) {
-  var _dateTimeParse5;
-  return (_dateTimeParse5 = (0, _dateUtils.dateTimeParse)(date)) === null || _dateTimeParse5 === void 0 ? void 0 : _dateTimeParse5.valueOf();
+  var _dateTimeParse4;
+  return (_dateTimeParse4 = (0, _dateUtils.dateTimeParse)(date)) === null || _dateTimeParse4 === void 0 ? void 0 : _dateTimeParse4.valueOf();
 };
 // #sourceMappingURL=time.js.map

package/build/cjs/helpers/time.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["_dateUtils","require","formatTime","exports","date","_dateTimeParse","dateTimeParse","format","durationDates","date1","date2","~~_dateTimeParse2~~","start","~~dateTime~~","~~end~~","~~diff~~","formatTimeCanonical","ts","~~_dateTimeParse3~~","formatDateCanonical","~~_dateTimeParse4~~","getTimestampFromDate","~~_dateTimeParse5~~"~~,"valueOf"~~],"sources":["time.ts"],"sourcesContent":["import {DateTime, ~~dateTime,~~ dateTimeParse} from '@gravity-ui/date-utils';\n\ntype Date = DateTime \| string \| number \| undefined;\n\nexport const formatTime = (date: Date) => {\n return dateTimeParse(date)?.format('HH:mm');\n};\n\nexport const durationDates = (date1: Date, date2: Date) => {\n if (!date1 && !date2) return '--:--';\n\n const start = dateTimeParse(date1) ~~\|\| dateTime()~~;\n const end = dateTimeParse(date2) \|\| ~~dateTime(~~);\n const ~~diff~~ = end~~?.diff~~(start);\n\n return ~~dateTimeParse~~(~~diff~~)~~?.format~~('~~HH:mm~~');\n};\n\nexport const formatTimeCanonical = (ts: Date) => {\n return dateTimeParse(ts)?.format('DD.MM.YYYY, HH:mm');\n};\n\nexport const formatDateCanonical = (ts: Date) => {\n return dateTimeParse(ts)?.format('DD.MM.YYYY');\n};\n\nexport const getTimestampFromDate = (date: Date) => {\n return dateTimeParse(date)?.valueOf();\n};\n"],"mappings":"~~;;;;;;~~AAAA,IAAAA,UAAA,GAAAC,OAAA;AAIO,IAAMC,UAAU,GAAAC,OAAA,CAAAD,UAAA,GAAG,SAAbA,UAAUA,CAAIE,IAAU,EAAK;EAAA,IAAAC,cAAA;EACtC,QAAAA,cAAA,GAAO,IAAAC,wBAAa,EAACF,IAAI,CAAC,cAAAC,cAAA,uBAAnBA,cAAA,CAAqBE,MAAM,CAAC,OAAO,CAAC;AAC/C,CAAC;AAEM,IAAMC,aAAa,GAAAL,OAAA,CAAAK,aAAA,GAAG,SAAhBA,aAAaA,CAAIC,KAAW,EAAEC,KAAW,EAAK;~~EAAA~~,~~IAAAC~~,~~eAAA;EACvD~~,~~IAAI~~,~~CAACF~~,KAAK,~~IAAI~~,~~CAACC~~,~~KAAK,~~EAAE,OAAO,OAAO;~~EAEpC~~,~~IAAME~~,KAAK,GAAG,IAAAN,wBAAa,EAACG,KAAK,CAAC,~~IAAI~~,~~IAAAI~~,~~mBAAQ~~,~~EAAC~~,CAAC;~~EAChD~~,IAAMC,GAAG,GAAG,~~IAAAR~~,~~wBAAa~~,~~EAACI~~,KAAK,CAAC,IAAI,~~IAAAG~~,~~mBAAQ~~,~~EAAC~~,CAAC;~~EAC9C~~,~~IAAME~~,IAAI,~~GAAGD~~,~~GAAG~~,~~aAAHA~~,GAAG,~~uBAAHA~~,GAAG,~~CAAEC~~,~~IAAI~~,CAACH,KAAK,CAAC~~;EAE7B~~,~~QAAAD~~,~~eAAA~~,~~GAAO~~,~~IAAAL~~,~~wBAAa~~,~~EAACS~~,~~IAAI,~~CAAC,~~cAAAJ~~,~~eAAA~~,~~uBAAnBA~~,~~eAAA~~,~~CAAqBJ~~,~~MAAM~~,CAAC,~~OAAO~~,CAAC;~~AAC/C~~,CAAC;AAEM,~~IAAMS~~,mBAAmB,~~GAAAb~~,OAAA,~~CAAAa~~,mBAAA,GAAG,SAAtBA,mBAAmBA,CAAIC,EAAQ,EAAK;EAAA,IAAAC,eAAA;EAC7C,QAAAA,eAAA,GAAO,~~IAAAZ~~,wBAAa,~~EAACW~~,EAAE,CAAC,cAAAC,eAAA,uBAAjBA,eAAA,~~CAAmBX~~,MAAM,CAAC,mBAAmB,CAAC;AACzD,CAAC;AAEM,~~IAAMY~~,mBAAmB,~~GAAAhB~~,OAAA,~~CAAAgB~~,mBAAA,GAAG,SAAtBA,mBAAmBA,CAAIF,EAAQ,EAAK;EAAA,IAAAG,eAAA;EAC7C,QAAAA,eAAA,GAAO,~~IAAAd~~,wBAAa,~~EAACW~~,EAAE,CAAC,cAAAG,eAAA,uBAAjBA,eAAA,~~CAAmBb~~,MAAM,CAAC,YAAY,CAAC;AAClD,CAAC;AAEM,~~IAAMc~~,oBAAoB,~~GAAAlB~~,OAAA,~~CAAAkB~~,oBAAA,GAAG,SAAvBA,oBAAoBA,~~CAAIjB~~,IAAU,EAAK;EAAA,~~IAAAkB~~,eAAA;EAChD,QAAAA,eAAA,GAAO,~~IAAAhB~~,wBAAa,EAACF,IAAI,CAAC,~~cAAAkB~~,eAAA,uBAAnBA,eAAA,~~CAAqBC~~,OAAO,CAAC,CAAC;AACzC,CAAC","ignoreList":[]}
1	+ {"version":3,"names":["_dateUtils","require","formatTime","exports","date","_dateTimeParse","dateTimeParse","format","durationDates","date1","date2","undefined","start","end","diffMs","Math","max","valueOf","totalMinutes","floor","hours","minutes","concat","String","padStart","formatTimeCanonical","ts","_dateTimeParse2","formatDateCanonical","_dateTimeParse3","getTimestampFromDate","_dateTimeParse4"],"sources":["time.ts"],"sourcesContent":["import {DateTime, dateTimeParse} from '@gravity-ui/date-utils';\n\ntype Date = DateTime \| string \| number \| undefined;\n\nexport const formatTime = (date: Date) => {\n return dateTimeParse(date)?.format('HH:mm');\n};\n\nexport const durationDates = (date1: Date, date2: Date) => {\n if (date1 === undefined \|\| date2 === undefined) return '--:--';\n\n const start = dateTimeParse(date1);\n const end = dateTimeParse(date2);\n\n if (!start \|\| !end) return '--:--';\n\n const diffMs = Math.max(0, end.valueOf() - start.valueOf());\n const totalMinutes = Math.floor(diffMs / 60_000);\n const hours = Math.floor(totalMinutes / 60);\n const minutes = totalMinutes % 60;\n\n return `${String(hours).padStart(2, '0')}:${String(minutes).padStart(2, '0')}`;\n};\n\nexport const formatTimeCanonical = (ts: Date) => {\n return dateTimeParse(ts)?.format('DD.MM.YYYY, HH:mm');\n};\n\nexport const formatDateCanonical = (ts: Date) => {\n return dateTimeParse(ts)?.format('DD.MM.YYYY');\n};\n\nexport const getTimestampFromDate = (date: Date) => {\n return dateTimeParse(date)?.valueOf();\n};\n"],"mappings":";;;;;;;;AAAA,IAAAA,UAAA,GAAAC,OAAA;AAIO,IAAMC,UAAU,GAAAC,OAAA,CAAAD,UAAA,GAAG,SAAbA,UAAUA,CAAIE,IAAU,EAAK;EAAA,IAAAC,cAAA;EACtC,QAAAA,cAAA,GAAO,IAAAC,wBAAa,EAACF,IAAI,CAAC,cAAAC,cAAA,uBAAnBA,cAAA,CAAqBE,MAAM,CAAC,OAAO,CAAC;AAC/C,CAAC;AAEM,IAAMC,aAAa,GAAAL,OAAA,CAAAK,aAAA,GAAG,SAAhBA,aAAaA,CAAIC,KAAW,EAAEC,KAAW,EAAK;EACvD,IAAID,KAAK,KAAKE,SAAS,IAAID,KAAK,KAAKC,SAAS,EAAE,OAAO,OAAO;EAE9D,IAAMC,KAAK,GAAG,IAAAN,wBAAa,EAACG,KAAK,CAAC;EAClC,IAAMI,GAAG,GAAG,IAAAP,wBAAa,EAACI,KAAK,CAAC;EAEhC,IAAI,CAACE,KAAK,IAAI,CAACC,GAAG,EAAE,OAAO,OAAO;EAElC,IAAMC,MAAM,GAAGC,IAAI,CAACC,GAAG,CAAC,CAAC,EAAEH,GAAG,CAACI,OAAO,CAAC,CAAC,GAAGL,KAAK,CAACK,OAAO,CAAC,CAAC,CAAC;EAC3D,IAAMC,YAAY,GAAGH,IAAI,CAACI,KAAK,CAACL,MAAM,GAAG,KAAM,CAAC;EAChD,IAAMM,KAAK,GAAGL,IAAI,CAACI,KAAK,CAACD,YAAY,GAAG,EAAE,CAAC;EAC3C,IAAMG,OAAO,GAAGH,YAAY,GAAG,EAAE;EAEjC,UAAAI,MAAA,CAAUC,MAAM,CAACH,KAAK,CAAC,CAACI,QAAQ,CAAC,CAAC,EAAE,GAAG,CAAC,OAAAF,MAAA,CAAIC,MAAM,CAACF,OAAO,CAAC,CAACG,QAAQ,CAAC,CAAC,EAAE,GAAG,CAAC;AAChF,CAAC;AAEM,IAAMC,mBAAmB,GAAAtB,OAAA,CAAAsB,mBAAA,GAAG,SAAtBA,mBAAmBA,CAAIC,EAAQ,EAAK;EAAA,IAAAC,eAAA;EAC7C,QAAAA,eAAA,GAAO,IAAArB,wBAAa,EAACoB,EAAE,CAAC,cAAAC,eAAA,uBAAjBA,eAAA,CAAmBpB,MAAM,CAAC,mBAAmB,CAAC;AACzD,CAAC;AAEM,IAAMqB,mBAAmB,GAAAzB,OAAA,CAAAyB,mBAAA,GAAG,SAAtBA,mBAAmBA,CAAIF,EAAQ,EAAK;EAAA,IAAAG,eAAA;EAC7C,QAAAA,eAAA,GAAO,IAAAvB,wBAAa,EAACoB,EAAE,CAAC,cAAAG,eAAA,uBAAjBA,eAAA,CAAmBtB,MAAM,CAAC,YAAY,CAAC;AAClD,CAAC;AAEM,IAAMuB,oBAAoB,GAAA3B,OAAA,CAAA2B,oBAAA,GAAG,SAAvBA,oBAAoBA,CAAI1B,IAAU,EAAK;EAAA,IAAA2B,eAAA;EAChD,QAAAA,eAAA,GAAO,IAAAzB,wBAAa,EAACF,IAAI,CAAC,cAAA2B,eAAA,uBAAnBA,eAAA,CAAqBd,OAAO,CAAC,CAAC;AACzC,CAAC","ignoreList":[]}

package/build/cjs/modules/HistoryRow/HistoryRow.css CHANGED Viewed

@@ -19,10 +19,11 @@
 }
 .qp-history-row__data {
   display: grid;
-  grid-template-columns: 52px 1fr;
+  grid-template-columns: minmax(64px, max-content) 1fr;
   grid-gap: 8px;
 }
 .qp-history-row__duration {
   text-align: center;
+  white-space: nowrap;
 }
 /*# sourceMappingURL=HistoryRow.css.map */

package/build/cjs/modules/HistoryRow/HistoryRow.css.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["HistoryRow.scss"],"names":[],"mappings":"AAAA;EACE,YAAA;EACA,aAAA;EACA,+BAAA;EACA,aAAA;EAAA,QAAA;AACF;AACE;EACE,mDAAA;AACJ;AAEE;EACE,cAAA;AAAJ;AAGE;EACE,YAAA;AADJ;AAIE;EACE,gBAAA;AAFJ;AAKE;EACE,aAAA;EACA~~,+BAAA~~;EACA,aAAA;AAHJ;AAME;EACE,kBAAA;AAJJ","file":"HistoryRow.css","sourcesContent":[".qp-history-row {\n height: 100%;\n display: grid;\n grid-template-columns: 20px 1fr;\n gap: 4px;\n\n &_compared {\n background-color: var(--g-color-base-utility-light);\n }\n\n &__icon {\n flex: 0 0 20px;\n }\n\n &__header {\n height: 20px;\n }\n\n &__right-column {\n overflow: hidden;\n }\n\n &__data {\n display: grid;\n grid-template-columns: ~~52px~~ 1fr;\n grid-gap: 8px;\n }\n\n &__duration {\n text-align: center;\n }\n}\n"],"sourceRoot":""}
1	+ {"version":3,"sources":["HistoryRow.scss"],"names":[],"mappings":"AAAA;EACE,YAAA;EACA,aAAA;EACA,+BAAA;EACA,aAAA;EAAA,QAAA;AACF;AACE;EACE,mDAAA;AACJ;AAEE;EACE,cAAA;AAAJ;AAGE;EACE,YAAA;AADJ;AAIE;EACE,gBAAA;AAFJ;AAKE;EACE,aAAA;EACA,oDAAA;EACA,aAAA;AAHJ;AAME;EACE,kBAAA;EACA,mBAAA;AAJJ","file":"HistoryRow.css","sourcesContent":[".qp-history-row {\n height: 100%;\n display: grid;\n grid-template-columns: 20px 1fr;\n gap: 4px;\n\n &_compared {\n background-color: var(--g-color-base-utility-light);\n }\n\n &__icon {\n flex: 0 0 20px;\n }\n\n &__header {\n height: 20px;\n }\n\n &__right-column {\n overflow: hidden;\n }\n\n &__data {\n display: grid;\n grid-template-columns: minmax(64px, max-content) 1fr;\n grid-gap: 8px;\n }\n\n &__duration {\n text-align: center;\n white-space: nowrap;\n }\n}\n"],"sourceRoot":""}

package/build/cjs/modules/HistoryRow/HistoryRow.js CHANGED Viewed

@@ -57,7 +57,7 @@ var HistoryRow = exports.HistoryRow = function HistoryRow(_ref) {
         })]
       }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
         className: block('data'),
-        children: [(0, _isFieldVisible.isFieldVisible)(visibleFields, 'duration') && startTime && /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.QueryDuration, {
+        children: [(0, _isFieldVisible.isFieldVisible)(visibleFields, 'duration') && startTime !== undefined && /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.QueryDuration, {
           className: block('duration'),
           status: status,
           startTime: startTime,
@@ -67,7 +67,7 @@ var HistoryRow = exports.HistoryRow = function HistoryRow(_ref) {
           children: [(0, _isFieldVisible.isFieldVisible)(visibleFields, 'mode') && mode && /*#__PURE__*/(0, _jsxRuntime.jsx)(_uikit.Text, {
             color: "complementary",
             children: mode
-          }), (0, _isFieldVisible.isFieldVisible)(visibleFields, 'startTime') && startTime && /*#__PURE__*/(0, _jsxRuntime.jsx)(_uikit.Text, {
+          }), (0, _isFieldVisible.isFieldVisible)(visibleFields, 'startTime') && startTime !== undefined && /*#__PURE__*/(0, _jsxRuntime.jsx)(_uikit.Text, {
             color: "complementary",
             children: (0, _time.formatTime)(startTime)
           }), (0, _isFieldVisible.isFieldVisible)(visibleFields, 'engine') && engine && /*#__PURE__*/(0, _jsxRuntime.jsx)(_uikit.Text, {

package/build/cjs/modules/HistoryRow/HistoryRow.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["_react","_interopRequireDefault","require","_uikit","_bemCnLite","_components","_time","_isFieldVisible","_jsxRuntime","e","__esModule","default","block","cn","HistoryRow","exports","_ref","item","actions","isActive","comparison","editing","visibleFields","renderLink","href","status","mode","startTime","endTime","engine","isPrivate","isEditing","Boolean","enabled","isComparisonMode","isChecked","checked","showMenu","length","_jsxs","RowLink","disabled","className","_defineProperty","children","_jsx","QueryStatusIcon","Flex","direction","gap","justifyContent","EditableRowTitle","RowActionsMenu","isFieldVisible","QueryDuration","Text","color","formatTime","HistoryPrivateIcon"],"sources":["HistoryRow.tsx"],"sourcesContent":["import React from 'react';\nimport {QueryListRowRenderData} from '../../types/queryList';\nimport {QueryHistoryRow} from '../../types/history';\nimport {Flex, Text} from '@gravity-ui/uikit';\nimport './HistoryRow.scss';\nimport cn from 'bem-cn-lite';\nimport {\n EditableRowTitle,\n HistoryPrivateIcon,\n QueryDuration,\n QueryStatusIcon,\n RowActionsMenu,\n RowLink,\n} from '../../components';\nimport {formatTime} from '../../helpers/time';\nimport {isFieldVisible} from '../../helpers/isFieldVisible';\n\nexport type Props<T extends QueryHistoryRow> = {\n item: T;\n} & Omit<QueryListRowRenderData<T>, 'item' \| 'variant'>;\n\nconst block = cn('qp-history-row');\n\nexport const HistoryRow = <T extends QueryHistoryRow>({\n item,\n actions,\n isActive,\n comparison,\n editing,\n visibleFields,\n renderLink,\n}: Props<T>) => {\n const {href, status, mode, startTime, endTime, engine, isPrivate} = item;\n const isEditing = Boolean(editing?.enabled);\n const isComparisonMode = Boolean(comparison?.enabled);\n const isChecked = Boolean(comparison?.checked);\n const showMenu = isActive && Boolean(actions?.length) && !isComparisonMode;\n\n return (\n <RowLink\n href={href}\n disabled={isEditing \|\| isComparisonMode}\n renderLink={renderLink}\n className={block({[status]: true, compared: isChecked})}\n >\n <QueryStatusIcon status={status} />\n <Flex direction=\"column\" gap={1} className={block('right-column')}>\n <Flex justifyContent=\"space-between\" className={block('header')}>\n <EditableRowTitle item={item} editing={editing} />\n {showMenu && <RowActionsMenu item={item} actions={actions} />}\n </Flex>\n <div className={block('data')}>\n {isFieldVisible(visibleFields, 'duration') && startTime && (\n <QueryDuration\n className={block('duration')}\n status={status}\n startTime={startTime}\n endTime={endTime}\n />\n )}\n <Flex gap={2}>\n {isFieldVisible(visibleFields, 'mode') && mode && (\n <Text color=\"complementary\">{mode}</Text>\n )}\n {isFieldVisible(visibleFields, 'startTime') && startTime && (\n <Text color=\"complementary\">{formatTime(startTime)}</Text>\n )}\n {isFieldVisible(visibleFields, 'engine') && engine && (\n <Text color=\"complementary\">{engine}</Text>\n )}\n {isFieldVisible(visibleFields, 'isPrivate') && (\n <HistoryPrivateIcon isPrivate={isPrivate} />\n )}\n </Flex>\n </div>\n </Flex>\n </RowLink>\n );\n};\n"],"mappings":";;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAGA,IAAAC,MAAA,GAAAD,OAAA;AACAA,OAAA;AACA,IAAAE,UAAA,GAAAH,sBAAA,CAAAC,OAAA;AACA,IAAAG,WAAA,GAAAH,OAAA;AAQA,IAAAI,KAAA,GAAAJ,OAAA;AACA,IAAAK,eAAA,GAAAL,OAAA;AAA4D,IAAAM,WAAA,GAAAN,OAAA;AAAA,SAAAD,uBAAAQ,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAM5D,IAAMG,KAAK,GAAG,IAAAC,kBAAE,EAAC,gBAAgB,CAAC;AAE3B,IAAMC,UAAU,GAAAC,OAAA,CAAAD,UAAA,GAAG,SAAbA,UAAUA,CAAAE,IAAA,EAQP;EAAA,IAPZC,IAAI,GAAAD,IAAA,CAAJC,IAAI;IACJC,OAAO,GAAAF,IAAA,CAAPE,OAAO;IACPC,QAAQ,GAAAH,IAAA,CAARG,QAAQ;IACRC,UAAU,GAAAJ,IAAA,CAAVI,UAAU;IACVC,OAAO,GAAAL,IAAA,CAAPK,OAAO;IACPC,aAAa,GAAAN,IAAA,CAAbM,aAAa;IACbC,UAAU,GAAAP,IAAA,CAAVO,UAAU;EAEV,IAAOC,IAAI,GAAyDP,IAAI,CAAjEO,IAAI;IAAEC,MAAM,GAAiDR,IAAI,CAA3DQ,MAAM;IAAEC,IAAI,GAA2CT,IAAI,CAAnDS,IAAI;IAAEC,SAAS,GAAgCV,IAAI,CAA7CU,SAAS;IAAEC,OAAO,GAAuBX,IAAI,CAAlCW,OAAO;IAAEC,MAAM,GAAeZ,IAAI,CAAzBY,MAAM;IAAEC,SAAS,GAAIb,IAAI,CAAjBa,SAAS;EAChE,IAAMC,SAAS,GAAGC,OAAO,CAACX,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAEY,OAAO,CAAC;EAC3C,IAAMC,gBAAgB,GAAGF,OAAO,CAACZ,UAAU,aAAVA,UAAU,uBAAVA,UAAU,CAAEa,OAAO,CAAC;EACrD,IAAME,SAAS,GAAGH,OAAO,CAACZ,UAAU,aAAVA,UAAU,uBAAVA,UAAU,CAAEgB,OAAO,CAAC;EAC9C,IAAMC,QAAQ,GAAGlB,QAAQ,IAAIa,OAAO,CAACd,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAEoB,MAAM,CAAC,IAAI,CAACJ,gBAAgB;EAE1E,oBACI,IAAAK,gBAAA,EAACC,mBAAO;IACJhB,IAAI,EAAEA,IAAK;IACXiB,QAAQ,EAAEV,SAAS,IAAIG,gBAAiB;IACxCX,UAAU,EAAEA,UAAW;IACvBmB,SAAS,EAAE9B,KAAK,KAAA+B,wBAAA,MAAAA,wBAAA,MAAGlB,MAAM,EAAG,IAAI,eAAYU,SAAS,CAAC,CAAE;IAAAS,QAAA,gBAExD,IAAAC,eAAA,EAACC,2BAAe;MAACrB,MAAM,EAAEA;IAAO,CAAE,CAAC,eACnC,IAAAc,gBAAA,EAACQ,WAAI;MAACC,SAAS,EAAC,QAAQ;MAACC,GAAG,EAAE,CAAE;MAACP,SAAS,EAAE9B,KAAK,CAAC,cAAc,CAAE;MAAAgC,QAAA,gBAC9D,IAAAL,gBAAA,EAACQ,WAAI;QAACG,cAAc,EAAC,eAAe;QAACR,SAAS,EAAE9B,KAAK,CAAC,QAAQ,CAAE;QAAAgC,QAAA,gBAC5D,IAAAC,eAAA,EAACM,4BAAgB;UAAClC,IAAI,EAAEA,IAAK;UAACI,OAAO,EAAEA;QAAQ,CAAE,CAAC,EACjDgB,QAAQ,iBAAI,IAAAQ,eAAA,EAACO,0BAAc;UAACnC,IAAI,EAAEA,IAAK;UAACC,OAAO,EAAEA;QAAQ,CAAE,CAAC;MAAA,CAC3D,CAAC,eACP,IAAAqB,gBAAA;QAAKG,SAAS,EAAE9B,KAAK,CAAC,MAAM,CAAE;QAAAgC,QAAA,GACzB,IAAAS,8BAAc,EAAC/B,aAAa,EAAE,UAAU,CAAC,IAAIK,SAAS,~~iBACnD~~,~~IAAAkB~~,eAAA,~~EAACS~~,yBAAa;~~UACVZ~~,SAAS,EAAE9B,KAAK,CAAC,UAAU,CAAE;UAC7Ba,MAAM,EAAEA,MAAO;UACfE,SAAS,EAAEA,SAAU;UACrBC,OAAO,EAAEA;QAAQ,CACpB,CACJ,eACD,IAAAW,gBAAA,EAACQ,WAAI;UAACE,GAAG,EAAE,CAAE;UAAAL,QAAA,GACR,IAAAS,8BAAc,EAAC/B,aAAa,EAAE,MAAM,CAAC,IAAII,IAAI,iBAC1C,IAAAmB,eAAA,~~EAACU~~,WAAI;YAACC,KAAK,EAAC,eAAe;~~YAAAZ~~,QAAA,EAAElB;UAAI,CAAO,CAC3C,EACA,IAAA2B,8BAAc,EAAC/B,aAAa,EAAE,WAAW,CAAC,IAAIK,SAAS,~~iBACpD~~,~~IAAAkB~~,eAAA,~~EAACU~~,WAAI;YAACC,KAAK,EAAC,eAAe;~~YAAAZ~~,QAAA,EAAE,~~IAAAa~~,gBAAU,~~EAAC9B~~,SAAS;UAAC,CAAO,CAC5D,EACA,IAAA0B,8BAAc,EAAC/B,aAAa,EAAE,QAAQ,CAAC,IAAIO,MAAM,iBAC9C,IAAAgB,eAAA,~~EAACU~~,WAAI;YAACC,KAAK,EAAC,eAAe;~~YAAAZ~~,QAAA,EAAEf;UAAM,CAAO,CAC7C,EACA,IAAAwB,8BAAc,EAAC/B,aAAa,EAAE,WAAW,CAAC,iBACvC,IAAAuB,eAAA,~~EAACa~~,8BAAkB;~~YAAC5B~~,SAAS,EAAEA;UAAU,CAAE,CAC9C;QAAA,CACC,CAAC;MAAA,CACN,CAAC;IAAA,CACJ,CAAC;EAAA,CACF,CAAC;AAElB,CAAC","ignoreList":[]}
1	+ {"version":3,"names":["_react","_interopRequireDefault","require","_uikit","_bemCnLite","_components","_time","_isFieldVisible","_jsxRuntime","e","__esModule","default","block","cn","HistoryRow","exports","_ref","item","actions","isActive","comparison","editing","visibleFields","renderLink","href","status","mode","startTime","endTime","engine","isPrivate","isEditing","Boolean","enabled","isComparisonMode","isChecked","checked","showMenu","length","_jsxs","RowLink","disabled","className","_defineProperty","children","_jsx","QueryStatusIcon","Flex","direction","gap","justifyContent","EditableRowTitle","RowActionsMenu","isFieldVisible","undefined","QueryDuration","Text","color","formatTime","HistoryPrivateIcon"],"sources":["HistoryRow.tsx"],"sourcesContent":["import React from 'react';\nimport {QueryListRowRenderData} from '../../types/queryList';\nimport {QueryHistoryRow} from '../../types/history';\nimport {Flex, Text} from '@gravity-ui/uikit';\nimport './HistoryRow.scss';\nimport cn from 'bem-cn-lite';\nimport {\n EditableRowTitle,\n HistoryPrivateIcon,\n QueryDuration,\n QueryStatusIcon,\n RowActionsMenu,\n RowLink,\n} from '../../components';\nimport {formatTime} from '../../helpers/time';\nimport {isFieldVisible} from '../../helpers/isFieldVisible';\n\nexport type Props<T extends QueryHistoryRow> = {\n item: T;\n} & Omit<QueryListRowRenderData<T>, 'item' \| 'variant'>;\n\nconst block = cn('qp-history-row');\n\nexport const HistoryRow = <T extends QueryHistoryRow>({\n item,\n actions,\n isActive,\n comparison,\n editing,\n visibleFields,\n renderLink,\n}: Props<T>) => {\n const {href, status, mode, startTime, endTime, engine, isPrivate} = item;\n const isEditing = Boolean(editing?.enabled);\n const isComparisonMode = Boolean(comparison?.enabled);\n const isChecked = Boolean(comparison?.checked);\n const showMenu = isActive && Boolean(actions?.length) && !isComparisonMode;\n\n return (\n <RowLink\n href={href}\n disabled={isEditing \|\| isComparisonMode}\n renderLink={renderLink}\n className={block({[status]: true, compared: isChecked})}\n >\n <QueryStatusIcon status={status} />\n <Flex direction=\"column\" gap={1} className={block('right-column')}>\n <Flex justifyContent=\"space-between\" className={block('header')}>\n <EditableRowTitle item={item} editing={editing} />\n {showMenu && <RowActionsMenu item={item} actions={actions} />}\n </Flex>\n <div className={block('data')}>\n {isFieldVisible(visibleFields, 'duration') && startTime !== undefined && (\n <QueryDuration\n className={block('duration')}\n status={status}\n startTime={startTime}\n endTime={endTime}\n />\n )}\n <Flex gap={2}>\n {isFieldVisible(visibleFields, 'mode') && mode && (\n <Text color=\"complementary\">{mode}</Text>\n )}\n {isFieldVisible(visibleFields, 'startTime') && startTime !== undefined && (\n <Text color=\"complementary\">{formatTime(startTime)}</Text>\n )}\n {isFieldVisible(visibleFields, 'engine') && engine && (\n <Text color=\"complementary\">{engine}</Text>\n )}\n {isFieldVisible(visibleFields, 'isPrivate') && (\n <HistoryPrivateIcon isPrivate={isPrivate} />\n )}\n </Flex>\n </div>\n </Flex>\n </RowLink>\n );\n};\n"],"mappings":"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","ignoreList":[]}

package/build/cjs/widgets/QueriesHistory/QueriesHistory.stories.d.ts CHANGED Viewed

@@ -7,6 +7,8 @@ export declare const Default: Story;
 export declare const Empty: Story;
 export declare const InitialLoading: Story;
 export declare const Paginated: Story;
+export declare const LoadingMore: Story;
+export declare const NarrowDuration: Story;
 export declare const FullSearchUnavailable: Story;
 export declare const RouterLinks: Story;
 export declare const CustomRowRenderer: Story;

package/build/cjs/widgets/QueriesHistory/QueriesHistory.stories.js CHANGED Viewed

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = exports.WithHeader = exports.RouterLinks = exports.Paginated = exports.InitialLoading = exports.FullSearchUnavailable = exports.Empty = exports.Default = exports.CustomRowRenderer = void 0;
+exports.default = exports.WithHeader = exports.RouterLinks = exports.Paginated = exports.NarrowDuration = exports.LoadingMore = exports.InitialLoading = exports.FullSearchUnavailable = exports.Empty = exports.Default = exports.CustomRowRenderer = void 0;
 var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
@@ -15,6 +15,7 @@ require("core-js/modules/es.array.includes.js");
 require("core-js/modules/es.array.map.js");
 require("core-js/modules/es.array.slice.js");
 require("core-js/modules/es.date.now.js");
+require("core-js/modules/es.date.to-string.js");
 require("core-js/modules/es.iterator.constructor.js");
 require("core-js/modules/es.iterator.filter.js");
 require("core-js/modules/es.object.to-string.js");
@@ -119,7 +120,39 @@ var LINK_ITEMS = BASE_ITEMS.map(function (item) {
     href: "/queries/".concat(item.id)
   }) : item;
 });
-var PAGINATION_PAGES = [LINK_ITEMS.slice(0, 3), LINK_ITEMS.slice(3, 6), LINK_ITEMS.slice(6)];
+var PAGINATION_PAGES = [LINK_ITEMS.slice(0, 6), LINK_ITEMS.slice(6)];
+var NARROW_HISTORY_START = Date.UTC(2024, 0, 15, 12, 0, 0);
+var NARROW_HISTORY_ITEMS = [{
+  id: 'five-minutes',
+  title: 'Five-minute query',
+  status: 'completed',
+  engine: 'YQL',
+  mode: 'Test',
+  isPrivate: false,
+  startTime: NARROW_HISTORY_START,
+  endTime: NARROW_HISTORY_START + 5 * min,
+  height: 52
+}, {
+  id: 'three-hours',
+  title: 'Three-hour query',
+  status: 'completed',
+  engine: 'YQL',
+  mode: 'Test',
+  isPrivate: true,
+  startTime: NARROW_HISTORY_START,
+  endTime: NARROW_HISTORY_START + 190 * min,
+  height: 52
+}, {
+  id: 'twenty-seven-hours',
+  title: 'Twenty-seven-hour query',
+  status: 'completed',
+  engine: 'YQL',
+  mode: 'Test',
+  isPrivate: false,
+  startTime: NARROW_HISTORY_START,
+  endTime: NARROW_HISTORY_START + 1635 * min,
+  height: 52
+}];
 var activeFields = ['duration', 'mode', 'startTime', 'engine', 'isPrivate'];
 var fields = [{
   id: 'duration',
@@ -416,7 +449,7 @@ var PaginatedStory = function PaginatedStory() {
         return currentPage + 1;
       });
       setLoading(false);
-    }, 700);
+    }, 1500);
   };
   return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
     style: {
@@ -516,6 +549,26 @@ var CustomRowRendererStory = function CustomRowRendererStory() {
     })
   });
 };
+var NarrowDurationStory = function NarrowDurationStory() {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+    style: {
+      width: 300,
+      height: 300
+    },
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_QueriesHistory.QueriesHistory, {
+      title: "Duration examples",
+      items: NARROW_HISTORY_ITEMS,
+      visibleFields: {
+        value: activeFields,
+        fields: fields,
+        onChange: (0, _actions.action)('onVisibleFieldsChange')
+      },
+      search: {
+        onUpdate: (0, _actions.action)('onSearchUpdate')
+      }
+    })
+  });
+};
 var Default = exports.Default = {
   render: function render() {
     return /*#__PURE__*/(0, _jsxRuntime.jsx)(DefaultStory, {});
@@ -550,6 +603,32 @@ var Paginated = exports.Paginated = {
     return /*#__PURE__*/(0, _jsxRuntime.jsx)(PaginatedStory, {});
   }
 };
+var LoadingMore = exports.LoadingMore = {
+  args: {
+    title: 'Loading next page',
+    items: LINK_ITEMS.slice(0, 3),
+    loading: true,
+    hasMore: true,
+    onLoadMore: (0, _actions.action)('onLoadMore'),
+    search: {
+      onUpdate: (0, _actions.action)('onSearchUpdate')
+    }
+  },
+  decorators: [function (StoryComponent) {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      style: {
+        width: 300,
+        height: 300
+      },
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(StoryComponent, {})
+    });
+  }]
+};
+var NarrowDuration = exports.NarrowDuration = {
+  render: function render() {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(NarrowDurationStory, {});
+  }
+};
 var FullSearchUnavailable = exports.FullSearchUnavailable = {
   render: function render() {
     return /*#__PURE__*/(0, _jsxRuntime.jsx)(FullSearchUnavailableStory, {});