@postgres.ai/shared 4.0.1-pr-1053 → 4.0.1

package/components/ResetCloneModal/index.js

@@ -7,7 +7,6 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
  */
 import { useEffect, useState } from 'react';
 import { makeStyles } from '@material-ui/core';
-import { formatDistanceToNowStrict } from 'date-fns';
 import { Text } from '@postgres.ai/shared/components/Text';
 import { Modal } from '@postgres.ai/shared/components/Modal';
 import { Select } from '@postgres.ai/shared/components/Select';
@@ -15,7 +14,7 @@ import { ImportantText } from '@postgres.ai/shared/components/ImportantText';
 import { Spinner } from '@postgres.ai/shared/components/Spinner';
 import { SimpleModalControls } from '@postgres.ai/shared/components/SimpleModalControls';
 import { compareSnapshotsDesc } from '@postgres.ai/shared/utils/snapshot';
-import { isValidDate } from '@postgres.ai/shared/utils/date';
+import { formatDateWithDistance } from '@postgres.ai/shared/utils/date';
 const useStyles = makeStyles({
     snapshots: {
         margin: '16px 0 0 0',
@@ -64,10 +63,7 @@ export const ResetCloneModal = (props) => {
                     const isCurrent = snapshot.id === ((_a = clone.snapshot) === null || _a === void 0 ? void 0 : _a.id);
                     return {
                         value: snapshot.id,
-                        children: (_jsxs(_Fragment, { children: [snapshot.dataStateAt, " (", isValidDate(snapshot.dataStateAtDate) &&
-                                    formatDistanceToNowStrict(snapshot.dataStateAtDate, {
-                                        addSuffix: true,
-                                    }), ")", isLatest && (_jsx("span", { className: classes.snapshotTag, children: "Latest" })), isCurrent && (_jsx("span", { className: classes.snapshotTag, children: "Current" }))] })),
+                        children: (_jsxs(_Fragment, { children: [formatDateWithDistance(snapshot.dataStateAt, snapshot.dataStateAtDate), isLatest && (_jsx("span", { className: classes.snapshotTag, children: "Latest" })), isCurrent && (_jsx("span", { className: classes.snapshotTag, children: "Current" }))] })),
                     };
                 })) !== null && _a !== void 0 ? _a : [], onChange: (e) => setSelectedSnapshotId(e.target.value), fullWidth: true, className: classes.snapshots }), _jsx(SimpleModalControls, { items: [
                     {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@postgres.ai/shared",
-  "version": "4.0.1-pr-1053",
+  "version": "4.0.1",
   "main": "index.js",
   "types": "index.d.ts",
   "peerDependencies": {

package/pages/Branches/components/BranchesTable/index.js

@@ -10,8 +10,7 @@ import { useEffect, useState } from 'react';
 import copy from 'copy-to-clipboard';
 import { makeStyles } from '@material-ui/core';
 import { useHistory } from 'react-router-dom';
-import { formatDistanceToNowStrict } from 'date-fns';
-import { isValidDate } from '@postgres.ai/shared/utils/date';
+import { formatDateWithDistance } from '@postgres.ai/shared/utils/date';
 import { ArrowDropDownIcon } from '@postgres.ai/shared/icons/ArrowDropDown';
 import { HorizontalScrollContainer } from '@postgres.ai/shared/components/HorizontalScrollContainer';
 import { useHost } from '@postgres.ai/shared/pages/Instance/context';
@@ -92,11 +91,7 @@ export const BranchesTable = ({ branches, emptyTableText, deleteBranch, branches
                                                 setIsOpenDestroyModal(true);
                                             },
                                         },
-                                    ] }), _jsx(TableBodyCell, { children: branch.name }), _jsx(TableBodyCell, { children: branch.parent }), _jsxs(TableBodyCell, { children: [branch.dataStateAt, " (", isValidDate(new Date(branch.dataStateAt))
-                                            ? formatDistanceToNowStrict(new Date(branch.dataStateAt), {
-                                                addSuffix: true,
-                                            })
-                                            : '-', ")"] }), _jsx(TableBodyCell, { children: branch.snapshotID }), _jsx(TableBodyCell, { children: branch.numSnapshots })] }, branch.name));
+                                    ] }), _jsx(TableBodyCell, { children: branch.name }), _jsx(TableBodyCell, { children: branch.parent }), _jsx(TableBodyCell, { children: formatDateWithDistance(branch.dataStateAt, new Date(branch.dataStateAt)) }), _jsx(TableBodyCell, { children: branch.snapshotID }), _jsx(TableBodyCell, { children: branch.numSnapshots })] }, branch.name));
                     }) }), _jsx(DeleteBranchModal, { isOpen: isOpenDestroyModal, onClose: () => {
                         setIsOpenDestroyModal(false);
                         setBranchId('');

package/pages/Instance/Clones/ClonesList/index.js

@@ -7,7 +7,6 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
  */
 import { useState } from 'react';
 import cn from 'classnames';
-import { formatDistanceToNowStrict } from 'date-fns';
 import { useHistory } from 'react-router-dom';
 import { Table, TableHead, TableRow, TableHeaderCell, TableBody, TableBodyCell, } from '@postgres.ai/shared/components/Table';
 import { ArrowDropDownIcon } from '@postgres.ai/shared/icons/ArrowDropDown';
@@ -20,7 +19,7 @@ import { Tooltip } from '@postgres.ai/shared/components/Tooltip';
 import { useHost } from '@postgres.ai/shared/pages/Instance/context';
 import { getCloneStatusType, getCloneStatusText, } from '@postgres.ai/shared/utils/clone';
 import { formatBytesIEC } from '@postgres.ai/shared/utils/units';
-import { isValidDate } from '@postgres.ai/shared/utils/date';
+import { formatDateWithDistance } from '@postgres.ai/shared/utils/date';
 import { MenuCell } from './MenuCell';
 import { ConnectionModal } from './ConnectionModal';
 import styles from './styles.module.scss';
@@ -83,14 +82,6 @@ export const ClonesList = (props) => {
                                 const clonePagePath = host.routes.clone(clone.id);
                                 return (_jsxs(TableRow, { hover: !props.isDisabled, onClick: props.isDisabled
                                         ? undefined
-                                        : () => history.push(clonePagePath), className: cn(!props.isDisabled && styles.interactiveRow), children: [_jsx(MenuCell, { clone: clone, onConnect: openConnectionModal, clonePagePath: clonePagePath }), _jsx(TableBodyCell, { children: _jsx(Tooltip, { content: clone.status.message, children: _jsx(Status, { type: getCloneStatusType(clone.status.code), children: getCloneStatusText(clone.status.code) }) }) }), _jsx(TableBodyCell, { children: clone.id }), !props.hideBranchingFeatures && _jsx(TableBodyCell, { children: clone.branch }), _jsx(TableBodyCell, { children: clone.protected ? (_jsx(Tooltip, { content: "Clone is protected from manual and automated deletion. Note that abandoned protected clones may lead to out-of-disk-space events because they hold old data, blocking cleanup and refresh processes.", children: _jsx(ShieldIcon, { className: styles.protectionIcon }) })) : (_jsx(Tooltip, { content: "Clone is not protected from deletion. To save disk space it will be automatically deleted if there is no activity for a long time.", children: _jsx(RenewableIcon, { className: styles.protectionIcon }) })) }), _jsxs(TableBodyCell, { children: [clone.createdAt, " (", isValidDate(clone.createdAtDate)
-                                                    ? formatDistanceToNowStrict(clone.createdAtDate, {
-                                                        addSuffix: true,
-                                                    })
-                                                    : '-', ")"] }), _jsx(TableBodyCell, { children: clone.db.port }), _jsx(TableBodyCell, { children: clone.db.username }), _jsx(TableBodyCell, { children: formatBytesIEC(clone.metadata.cloneDiffSize) }), _jsx(TableBodyCell, { children: (_b = (_a = clone.snapshot) === null || _a === void 0 ? void 0 : _a.pool) !== null && _b !== void 0 ? _b : '-' }), _jsx(TableBodyCell, { children: clone.snapshot ? (_jsxs(_Fragment, { children: [clone.snapshot.dataStateAt, " (", isValidDate(clone.snapshot.dataStateAtDate)
-                                                        ? formatDistanceToNowStrict(clone.snapshot.dataStateAtDate, {
-                                                            addSuffix: true,
-                                                        })
-                                                        : '-', ")"] })) : ('-') })] }, clone.id));
+                                        : () => history.push(clonePagePath), className: cn(!props.isDisabled && styles.interactiveRow), children: [_jsx(MenuCell, { clone: clone, onConnect: openConnectionModal, clonePagePath: clonePagePath }), _jsx(TableBodyCell, { children: _jsx(Tooltip, { content: clone.status.message, children: _jsx(Status, { type: getCloneStatusType(clone.status.code), children: getCloneStatusText(clone.status.code) }) }) }), _jsx(TableBodyCell, { children: clone.id }), !props.hideBranchingFeatures && _jsx(TableBodyCell, { children: clone.branch }), _jsx(TableBodyCell, { children: clone.protected ? (_jsx(Tooltip, { content: "Clone is protected from manual and automated deletion. Note that abandoned protected clones may lead to out-of-disk-space events because they hold old data, blocking cleanup and refresh processes.", children: _jsx(ShieldIcon, { className: styles.protectionIcon }) })) : (_jsx(Tooltip, { content: "Clone is not protected from deletion. To save disk space it will be automatically deleted if there is no activity for a long time.", children: _jsx(RenewableIcon, { className: styles.protectionIcon }) })) }), _jsx(TableBodyCell, { children: formatDateWithDistance(clone.createdAt, clone.createdAtDate) }), _jsx(TableBodyCell, { children: clone.db.port }), _jsx(TableBodyCell, { children: clone.db.username }), _jsx(TableBodyCell, { children: formatBytesIEC(clone.metadata.cloneDiffSize) }), _jsx(TableBodyCell, { children: (_b = (_a = clone.snapshot) === null || _a === void 0 ? void 0 : _a.pool) !== null && _b !== void 0 ? _b : '-' }), _jsx(TableBodyCell, { children: clone.snapshot ? formatDateWithDistance(clone.snapshot.dataStateAt, clone.snapshot.dataStateAtDate) : '-' })] }, clone.id));
                             }) })] }) }), cloneIdForConnect && (_jsx(ConnectionModal, { cloneId: cloneIdForConnect, isOpen: isOpenConnectionModal, onClose: closeConnectionModal }))] }));
 };

package/pages/Instance/InactiveInstance/index.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Tooltip } from '@material-ui/core';
 import { makeStyles } from '@material-ui/core';
-import { formatDistanceToNowStrict } from 'date-fns';
+import { formatDistanceSafe } from '@postgres.ai/shared/utils/date';
 import { Link } from '@postgres.ai/shared/components/Link2';
 import { formatTimestampUtc } from './utils';
 const useStyles = makeStyles({
@@ -54,12 +54,7 @@ export const InactiveInstance = ({ org, instance, }) => {
         }
         return '';
     };
-    return (_jsxs("div", { className: classes.container, children: [_jsxs("div", { className: classes.flexContainer, children: [_jsx("span", { children: "Plan" }), _jsx("span", { children: (instance === null || instance === void 0 ? void 0 : instance.dto.plan) || '---' })] }), _jsxs("div", { className: classes.flexContainer, children: [_jsx("span", { children: "Version" }), _jsx("span", { children: getVersionDigits((instance === null || instance === void 0 ? void 0 : instance.state) && ((_b = (_a = instance === null || instance === void 0 ? void 0 : instance.state) === null || _a === void 0 ? void 0 : _a.engine) === null || _b === void 0 ? void 0 : _b.version)) })] }), _jsxs("div", { className: classes.flexContainer, children: [_jsx("span", { children: "Registered" }), _jsx("span", { className: classes.timeLabel, children: _jsx(Tooltip, { title: (_c = formatTimestampUtc(instance === null || instance === void 0 ? void 0 : instance.createdAt)) !== null && _c !== void 0 ? _c : '', classes: { tooltip: classes.toolTip }, children: _jsx("span", { children: (instance === null || instance === void 0 ? void 0 : instance.createdAt) &&
-                                    formatDistanceToNowStrict(new Date(instance === null || instance === void 0 ? void 0 : instance.createdAt), {
-                                        addSuffix: true,
-                                    }) }) }) })] }), (instance === null || instance === void 0 ? void 0 : instance.telemetryLastReportedAt) && (_jsxs("div", { className: classes.flexContainer, children: [_jsx("span", { children: "Telemetry last reported" }), _jsx("span", { className: classes.timeLabel, children: _jsx(Tooltip, { title: (_d = formatTimestampUtc(instance === null || instance === void 0 ? void 0 : instance.telemetryLastReportedAt)) !== null && _d !== void 0 ? _d : '', classes: { tooltip: classes.toolTip }, children: _jsx("span", { children: formatDistanceToNowStrict(new Date(instance === null || instance === void 0 ? void 0 : instance.telemetryLastReportedAt), {
-                                    addSuffix: true,
-                                }) }) }) })] })), _jsxs("div", { className: classes.flexContainer, children: [_jsx("span", { children: "Instance ID" }), _jsx("span", { children: _jsxs("span", { style: {
+    return (_jsxs("div", { className: classes.container, children: [_jsxs("div", { className: classes.flexContainer, children: [_jsx("span", { children: "Plan" }), _jsx("span", { children: (instance === null || instance === void 0 ? void 0 : instance.dto.plan) || '---' })] }), _jsxs("div", { className: classes.flexContainer, children: [_jsx("span", { children: "Version" }), _jsx("span", { children: getVersionDigits((instance === null || instance === void 0 ? void 0 : instance.state) && ((_b = (_a = instance === null || instance === void 0 ? void 0 : instance.state) === null || _a === void 0 ? void 0 : _a.engine) === null || _b === void 0 ? void 0 : _b.version)) })] }), _jsxs("div", { className: classes.flexContainer, children: [_jsx("span", { children: "Registered" }), _jsx("span", { className: classes.timeLabel, children: _jsx(Tooltip, { title: (_c = formatTimestampUtc(instance === null || instance === void 0 ? void 0 : instance.createdAt)) !== null && _c !== void 0 ? _c : '', classes: { tooltip: classes.toolTip }, children: _jsx("span", { children: (instance === null || instance === void 0 ? void 0 : instance.createdAt) ? formatDistanceSafe(new Date(instance === null || instance === void 0 ? void 0 : instance.createdAt)) : '-' }) }) })] }), (instance === null || instance === void 0 ? void 0 : instance.telemetryLastReportedAt) && (_jsxs("div", { className: classes.flexContainer, children: [_jsx("span", { children: "Telemetry last reported" }), _jsx("span", { className: classes.timeLabel, children: _jsx(Tooltip, { title: (_d = formatTimestampUtc(instance === null || instance === void 0 ? void 0 : instance.telemetryLastReportedAt)) !== null && _d !== void 0 ? _d : '', classes: { tooltip: classes.toolTip }, children: _jsx("span", { children: (instance === null || instance === void 0 ? void 0 : instance.telemetryLastReportedAt) ? formatDistanceSafe(new Date(instance === null || instance === void 0 ? void 0 : instance.telemetryLastReportedAt)) : '-' }) }) })] })), _jsxs("div", { className: classes.flexContainer, children: [_jsx("span", { children: "Instance ID" }), _jsx("span", { children: _jsxs("span", { style: {
                                 fontWeight: 'normal',
                             }, children: [_jsx(Link, { to: `/${org}/instances/${instance === null || instance === void 0 ? void 0 : instance.id}`, children: instance === null || instance === void 0 ? void 0 : instance.id }), "\u00A0 (self-assigned:", ' ', ((_e = instance === null || instance === void 0 ? void 0 : instance.dto) === null || _e === void 0 ? void 0 : _e.selfassigned_instance_id) || 'N/A', ")"] }) })] }), (instance === null || instance === void 0 ? void 0 : instance.dto.plan) !== 'CE' && (_jsxs("div", { className: classes.flexContainer, children: [_jsx("span", { children: "Billing data" }), _jsx("span", { children: _jsx(Link, { to: `/${org}/billing`, children: "Billing data" }) })] })), _jsxs("p", { className: classes.content, children: ["To work with this instance, access its UI or API directly. Full integration of UI to the Platform is currently available only to the EE users. If you have any questions, reach out to", ' ', _jsx("a", { href: "https://postgres.ai/contact", target: "_blank", rel: "noopener noreferrer", children: "the Postgres.ai team" }), "."] })] }));
 };

package/pages/Instance/Snapshots/components/SnapshotsList/index.js

@@ -10,7 +10,8 @@ import { IconButton } from '@mui/material';
 import { icons } from '@postgres.ai/shared/styles/icons';
 import { RowMenu } from '@postgres.ai/shared/components/Table/RowMenu';
 import { generateSnapshotPageId, groupSnapshotsByCreatedAtDate, } from '@postgres.ai/shared/pages/Instance/Snapshots/utils';
-import { format, formatDistanceToNowStrict } from 'date-fns';
+import { format } from 'date-fns';
+import { formatDistanceSafe } from '@postgres.ai/shared/utils/date';
 import { formatBytesIEC } from '@postgres.ai/shared/utils/units';
 import { useHistory } from 'react-router';
 const useStyles = makeStyles({
@@ -109,7 +110,7 @@ const useStyles = makeStyles({
 const SnapshotListItem = ({ snapshot, setSnapshotModal, openClonesModal, }) => {
     var _a, _b;
     const classes = useStyles();
-    const timeAgo = formatDistanceToNowStrict(snapshot.createdAtDate);
+    const timeAgo = formatDistanceSafe(snapshot.createdAtDate);
     const history = useHistory();
     const host = useHost();
     return (_jsx("div", { className: classes.commitItem, children: _jsxs("div", { className: classes.gridContainer, children: [_jsxs("div", { className: classes.infoBlock, children: [_jsx("div", { className: classes.header, children: snapshot.message || '-' }), _jsxs("div", { className: classes.infoContent, title: snapshot.dataStateAt, children: [timeAgo, " ago"] })] }), _jsxs("div", { className: classes.infoBlock, children: [_jsx("div", { className: classes.header, children: "Pool" }), _jsx("div", { className: classes.infoContent, children: (_a = snapshot.pool) !== null && _a !== void 0 ? _a : '-' })] }), _jsxs("div", { className: classes.infoBlock, children: [_jsx("div", { className: classes.header, children: "Number of clones" }), _jsx("div", { className: classes.infoContent, children: (_b = snapshot.numClones) !== null && _b !== void 0 ? _b : '-' })] }), _jsxs("div", { className: classes.infoBlock, children: [_jsx("div", { className: classes.header, children: "Logical Size" }), _jsx("div", { className: classes.infoContent, children: snapshot.logicalSize ? formatBytesIEC(snapshot.logicalSize) : '-' })] }), _jsxs("div", { className: classes.infoBlock, children: [_jsx("div", { className: classes.header, children: "Physical Size" }), _jsx("div", { className: classes.infoContent, children: snapshot.physicalSize

package/pages/Instance/Snapshots/components/SnapshotsTable/index.js

@@ -9,7 +9,6 @@ import React from 'react';
 import cn from 'classnames';
 import { observer } from 'mobx-react-lite';
 import { makeStyles } from '@material-ui/core';
-import { formatDistanceToNowStrict } from 'date-fns';
 import copy from 'copy-to-clipboard';
 import { useHistory } from 'react-router-dom';
 import { HorizontalScrollContainer } from '@postgres.ai/shared/components/HorizontalScrollContainer';
@@ -18,7 +17,7 @@ import { DestroySnapshotModal } from '@postgres.ai/shared/pages/Snapshots/Snapsh
 import { useStores } from '@postgres.ai/shared/pages/Instance/context';
 import { ArrowDropDownIcon } from '@postgres.ai/shared/icons/ArrowDropDown';
 import { formatBytesIEC } from '@postgres.ai/shared/utils/units';
-import { isSameDayUTC, isValidDate } from '@postgres.ai/shared/utils/date';
+import { isSameDayUTC, formatDateWithDistance } from '@postgres.ai/shared/utils/date';
 import { Table, TableHead, TableRow, TableBody, TableHeaderCell, TableBodyCell, TableBodyCellMenu, } from '@postgres.ai/shared/components/Table';
 const useStyles = makeStyles({
     cellContentCentered: {
@@ -108,15 +107,7 @@ export const SnapshotsTable = observer(({ instanceId }) => {
                                                 snapshotId: snapshot.id,
                                             }),
                                         },
-                                    ] }), _jsxs(TableBodyCell, { children: [snapshot.dataStateAt, " (", isValidDate(snapshot.dataStateAtDate)
-                                            ? formatDistanceToNowStrict(snapshot.dataStateAtDate, {
-                                                addSuffix: true,
-                                            })
-                                            : '-', ")"] }), _jsxs(TableBodyCell, { children: [snapshot.createdAt, " (", isValidDate(snapshot.createdAtDate)
-                                            ? formatDistanceToNowStrict(snapshot.createdAtDate, {
-                                                addSuffix: true,
-                                            })
-                                            : '-', ")"] }), _jsx(TableBodyCell, { children: (_a = snapshot.pool) !== null && _a !== void 0 ? _a : '-' }), _jsx(TableBodyCell, { children: (_b = snapshot.numClones) !== null && _b !== void 0 ? _b : '-' }), _jsx(TableBodyCell, { children: snapshot.logicalSize
+                                    ] }), _jsx(TableBodyCell, { children: formatDateWithDistance(snapshot.dataStateAt, snapshot.dataStateAtDate) }), _jsx(TableBodyCell, { children: formatDateWithDistance(snapshot.createdAt, snapshot.createdAtDate) }), _jsx(TableBodyCell, { children: (_a = snapshot.pool) !== null && _a !== void 0 ? _a : '-' }), _jsx(TableBodyCell, { children: (_b = snapshot.numClones) !== null && _b !== void 0 ? _b : '-' }), _jsx(TableBodyCell, { children: snapshot.logicalSize
                                         ? formatBytesIEC(snapshot.logicalSize)
                                         : '-' }), _jsx(TableBodyCell, { children: snapshot.physicalSize
                                         ? formatBytesIEC(snapshot.physicalSize)

package/pages/Instance/SnapshotsModal/index.js

@@ -7,7 +7,6 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
  */
 import { observer } from 'mobx-react-lite';
 import { makeStyles } from '@material-ui/core';
-import { formatDistanceToNowStrict } from 'date-fns';
 import copy from 'copy-to-clipboard';
 import { useStores } from '@postgres.ai/shared/pages/Instance/context';
 import { ArrowDropDownIcon } from '@postgres.ai/shared/icons/ArrowDropDown';
@@ -15,7 +14,7 @@ import { Modal as ModalBase } from '@postgres.ai/shared/components/Modal';
 import { HorizontalScrollContainer } from '@postgres.ai/shared/components/HorizontalScrollContainer';
 import { Table, TableHead, TableRow, TableBody, TableHeaderCell, TableBodyCell, TableBodyCellMenu, } from '@postgres.ai/shared/components/Table';
 import { formatBytesIEC } from '@postgres.ai/shared/utils/units';
-import { isSameDayUTC } from '@postgres.ai/shared/utils/date';
+import { isSameDayUTC, formatDateWithDistance } from '@postgres.ai/shared/utils/date';
 import { Tags } from '@postgres.ai/shared/pages/Instance/components/Tags';
 import { ModalReloadButton } from '@postgres.ai/shared/pages/Instance/components/ModalReloadButton';
 import { getTags } from '../Snapshots/components/SnapshotsModal/utils';
@@ -70,11 +69,7 @@ export const SnapshotsModal = observer(() => {
                                                         snapshotId: snapshot.id,
                                                     }),
                                                 },
-                                            ] }), _jsxs(TableBodyCell, { children: [snapshot.dataStateAt, " (", formatDistanceToNowStrict(snapshot.dataStateAtDate, {
-                                                    addSuffix: true,
-                                                }), ")"] }), _jsxs(TableBodyCell, { children: [snapshot.createdAt, " (", formatDistanceToNowStrict(snapshot.createdAtDate, {
-                                                    addSuffix: true,
-                                                }), ")"] }), _jsx(TableBodyCell, { children: (_a = snapshot.pool) !== null && _a !== void 0 ? _a : '-' }), _jsx(TableBodyCell, { children: snapshot.physicalSize
+                                            ] }), _jsx(TableBodyCell, { children: formatDateWithDistance(snapshot.dataStateAt, snapshot.dataStateAtDate) }), _jsx(TableBodyCell, { children: formatDateWithDistance(snapshot.createdAt, snapshot.createdAtDate) }), _jsx(TableBodyCell, { children: (_a = snapshot.pool) !== null && _a !== void 0 ? _a : '-' }), _jsx(TableBodyCell, { children: snapshot.physicalSize
                                                 ? formatBytesIEC(snapshot.physicalSize)
                                                 : '-' })] }, snapshot.id));
                             }) })] }) }))] }));

package/utils/date.d.ts

@@ -16,3 +16,5 @@ export declare const formatDateStd: (date: Date, options?: {
     withDistance?: boolean;
 }) => string;
 export declare const isValidDate: (dateObject: Date) => boolean;
+export declare const formatDateWithDistance: (dateString: string, dateObject: Date) => string;
+export declare const formatDistanceSafe: (dateObject: Date) => string;

package/utils/date.js

@@ -6,8 +6,22 @@
  */
 import { parse, startOfDay, isSameDay, startOfMonth, startOfWeek, endOfMonth, endOfWeek, differenceInDays, addDays, addMonths, isSameMonth, format, formatDistanceToNowStrict, } from 'date-fns';
 export const formatDateToISO = (dateString) => {
-    const parsedDate = parse(dateString, 'yyyyMMddHHmmss', new Date());
-    return format(parsedDate, "yyyy-MM-dd'T'HH:mm:ssXXX");
+    // Handle empty or invalid date strings
+    if (!dateString || dateString.trim() === '') {
+        return '';
+    }
+    try {
+        const parsedDate = parse(dateString, 'yyyyMMddHHmmss', new Date());
+        // Additional validation of parsed date
+        if (!isValidDate(parsedDate) || isNaN(parsedDate.getTime())) {
+            return '';
+        }
+        return format(parsedDate, "yyyy-MM-dd'T'HH:mm:ssXXX");
+    }
+    catch (error) {
+        // Return empty string for invalid date formats
+        return '';
+    }
 };
 // parseDate parses date of both format: '2006-01-02 15:04:05 UTC' and `2006-01-02T15:04:05Z` (RFC3339).
 export const parseDate = (dateStr) => parse(dateStr.replace(' UTC', 'Z').replace('T', ' '), 'yyyy-MM-dd HH:mm:ssX', new Date());
@@ -38,3 +52,27 @@ export const formatDateStd = (date, options) => `${formatUTC(date, 'yyyy-MM-dd H
 export const isValidDate = (dateObject) => {
     return new Date(dateObject).toString() !== 'Invalid Date';
 };
+// Safe date formatting with distance
+export const formatDateWithDistance = (dateString, dateObject) => {
+    if (!dateString || !isValidDate(dateObject))
+        return '-';
+    try {
+        return `${dateString} (${formatDistanceToNowStrict(dateObject, { addSuffix: true })})`;
+    }
+    catch (error) {
+        console.warn('Error formatting date distance:', error, 'date:', dateObject);
+        return '-';
+    }
+};
+// Safe distance formatting only
+export const formatDistanceSafe = (dateObject) => {
+    if (!isValidDate(dateObject))
+        return '-';
+    try {
+        return formatDistanceToNowStrict(dateObject, { addSuffix: true });
+    }
+    catch (error) {
+        console.warn('Error formatting distance:', error, 'date:', dateObject);
+        return '-';
+    }
+};