Merge pull request #12037 from kyoto/sdk-expose-datetime

Move some datetime functions to @openshift-console/plugin-shared

frontend/__tests__/components/utils/datetime.spec.ts

@@ -1,9 +1,8 @@
 import {
   formatPrometheusDuration,
-  getDuration,
-  isValid,
   parsePrometheusDuration,
-} from '../../../public/components/utils/datetime';
+} from '@openshift-console/plugin-shared/src/datetime/prometheus';
+import { getDuration, isValid } from '../../../public/components/utils/datetime';
 
 describe('isValid', () => {
   it('rejects non-dates', () => {

frontend/packages/ceph-storage-plugin/src/components/dashboards/object-service/activity-card/data-resiliency-activity/data-resiliency-activity.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { useTranslation } from 'react-i18next';
 import { PrometheusResponse } from '@console/internal/components/graphs';
-import { formatPrometheusDuration } from '@console/internal/components/utils/datetime';
+import { formatPrometheusDuration } from '@openshift-console/plugin-shared/src/datetime/prometheus';
 import { DataResiliency } from '../../../common/data-resiliency/data-resiliency-activity';
 import { getGaugeValue } from '../../../../../utils';
 import './data-resiliency-activity.scss';

frontend/packages/console-plugin-shared/src/datetime/index.ts

@@ -0,0 +1 @@
+export * from './prometheus';

frontend/packages/console-plugin-shared/src/datetime/prometheus.ts

@@ -0,0 +1,56 @@
+import * as _ from 'lodash';
+
+// Conversions between units and milliseconds
+const s = 1000;
+const m = s * 60;
+const h = m * 60;
+const d = h * 24;
+const w = d * 7;
+const units = { w, d, h, m, s };
+
+/**
+ * Converts a duration in milliseconds to a Prometheus time duration string like "1h 10m"
+ * @param {number} ms - Time duration in milliseconds
+ * @returns {string} The duration converted to a Prometheus time duration string
+ * @example
+ * ```
+ * formatPrometheusDuration(65000) // Returns "1m 5s"
+ * ```
+ */
+export const formatPrometheusDuration = (ms: number) => {
+  if (!_.isFinite(ms) || ms < 0) {
+    return '';
+  }
+  let remaining = ms;
+  let str = '';
+  _.each(units, (factor, unit) => {
+    const n = Math.floor(remaining / factor);
+    if (n > 0) {
+      str += `${n}${unit} `;
+      remaining -= n * factor;
+    }
+  });
+  return _.trim(str);
+};
+
+/**
+ * Converts a Prometheus time duration like "1h 10m 23s" to milliseconds
+ * @param {string} duration - Prometheus time duration string
+ * @returns {number} The duration converted to a Prometheus time duration string or 0 if the duration could not be parsed
+ * @example
+ * ```
+ * parsePrometheusDuration("1m 5s") // Returns 65000
+ * ```
+ */
+export const parsePrometheusDuration = (duration: string): number => {
+  try {
+    const parts = duration
+      .trim()
+      .split(/\s+/)
+      .map((p) => p.match(/^(\d+)([wdhms])$/));
+    return _.sumBy(parts, (p) => parseInt(p[1], 10) * units[p[2]]);
+  } catch (ignored) {
+    // Invalid duration format
+    return 0;
+  }
+};

frontend/packages/console-plugin-shared/src/index.ts

@@ -1 +1,2 @@
 export * from './components';
+export * from './datetime';

frontend/packages/dev-console/src/components/monitoring/alerts/SilenceDurationDropdown.tsx

@@ -1,4 +1,5 @@
 import * as React from 'react';
+import { parsePrometheusDuration } from '@openshift-console/plugin-shared/src/datetime/prometheus';
 import * as _ from 'lodash';
 import { useTranslation } from 'react-i18next';
 // FIXME upgrading redux types is causing many errors at this time
@@ -18,7 +19,6 @@ import { coFetchJSON } from '@console/internal/co-fetch';
 import { ALERTMANAGER_TENANCY_BASE_PATH } from '@console/internal/components/graphs';
 import { isSilenced } from '@console/internal/components/monitoring/utils';
 import { Dropdown, LoadingInline } from '@console/internal/components/utils';
-import { parsePrometheusDuration } from '@console/internal/components/utils/datetime';
 import { RootState } from '@console/internal/redux';
 import './SilenceDurationDropdown.scss';
 

frontend/packages/pipelines-plugin/src/components/pipelines/pipeline-metrics/PipelineMetrics.tsx

@@ -1,4 +1,5 @@
 import * as React from 'react';
+import { parsePrometheusDuration } from '@openshift-console/plugin-shared/src/datetime/prometheus';
 import {
   Flex,
   FlexItem,
@@ -12,7 +13,6 @@ import {
   CardTitle,
 } from '@patternfly/react-core';
 import { useTranslation } from 'react-i18next';
-import { parsePrometheusDuration } from '@console/internal/components/utils/datetime';
 import { PipelineMetricsLevel } from '../const';
 import { PipelineDetailsTabProps } from '../detail-page-tabs/types';
 import { useLatestPipelineRun } from '../hooks';

frontend/packages/pipelines-plugin/src/components/pipelines/pipeline-metrics/PipelineMetricsTimeRangeDropdown.tsx

@@ -1,11 +1,11 @@
 import * as React from 'react';
+import {
+  formatPrometheusDuration,
+  parsePrometheusDuration,
+} from '@openshift-console/plugin-shared/src/datetime/prometheus';
 import { Dropdown, DropdownItem, DropdownToggle } from '@patternfly/react-core';
 import { map } from 'lodash';
 import { useTranslation } from 'react-i18next';
-import {
-  parsePrometheusDuration,
-  formatPrometheusDuration,
-} from '@console/internal/components/utils/datetime';
 import { PipelineMetricsTimeRangeOptions } from './pipeline-metrics-utils';
 
 interface PipelineMetricsTimeRangeDropdownProps {

frontend/packages/pipelines-plugin/src/components/pipelines/pipeline-metrics/PipelineRunDurationGraph.tsx

@@ -1,11 +1,11 @@
 import * as React from 'react';
+import { formatPrometheusDuration } from '@openshift-console/plugin-shared/src/datetime/prometheus';
 import { ChartThemeColor, ChartVoronoiContainer } from '@patternfly/react-charts';
 import { Bullseye, Flex, FlexItem, Grid, GridItem } from '@patternfly/react-core';
 import { useTranslation } from 'react-i18next';
 import Measure from 'react-measure';
 import { GraphEmpty } from '@console/internal/components/graphs/graph-empty';
 import { LoadingInline, truncateMiddle } from '@console/internal/components/utils';
-import { formatPrometheusDuration } from '@console/internal/components/utils/datetime';
 import { DEFAULT_LEGEND_CHART_HEIGHT } from '../const';
 import { usePipelineRunDurationPoll } from '../hooks';
 import { LineChart } from './charts/lineChart';

frontend/packages/pipelines-plugin/src/components/pipelines/pipeline-metrics/PipelineRunTaskRunGraph.tsx

@@ -1,4 +1,5 @@
 import * as React from 'react';
+import { formatPrometheusDuration } from '@openshift-console/plugin-shared/src/datetime/prometheus';
 import {
   ChartLegend,
   getInteractiveLegendEvents,
@@ -11,7 +12,6 @@ import Measure from 'react-measure';
 import { CursorVoronoiContainer } from '@console/internal/components/graphs';
 import { GraphEmpty } from '@console/internal/components/graphs/graph-empty';
 import { LoadingInline, truncateMiddle } from '@console/internal/components/utils';
-import { formatPrometheusDuration } from '@console/internal/components/utils/datetime';
 import { PipelineTask } from '../../../types';
 import { DEFAULT_CHART_HEIGHT, DEFAULT_LEGEND_CHART_HEIGHT } from '../const';
 import { usePipelineRunTaskRunPoll } from '../hooks';

frontend/packages/pipelines-plugin/src/components/pipelines/pipeline-metrics/__tests__/PipelineRunCount.spec.tsx

@@ -1,9 +1,9 @@
 import * as React from 'react';
+import { parsePrometheusDuration } from '@openshift-console/plugin-shared/src/datetime/prometheus';
 import { shallow } from 'enzyme';
 import { DEFAULT_PROMETHEUS_TIMESPAN } from '@console/internal/components/graphs';
 import { GraphEmpty } from '@console/internal/components/graphs/graph-empty';
 import { LoadingInline } from '@console/internal/components/utils';
-import { parsePrometheusDuration } from '@console/internal/components/utils/datetime';
 import { PipelineExampleNames, pipelineTestData } from '../../../../test-data/pipeline-data';
 import { DEFAULT_REFRESH_INTERVAL, PipelineMetricsLevel } from '../../const';
 import * as hookUtils from '../../hooks';

frontend/packages/pipelines-plugin/src/components/pipelines/pipeline-metrics/__tests__/PipelineRunDuration.spec.tsx

@@ -1,10 +1,10 @@
 import * as React from 'react';
+import { parsePrometheusDuration } from '@openshift-console/plugin-shared/src/datetime/prometheus';
 import { shallow } from 'enzyme';
 import Measure from 'react-measure';
 import { DEFAULT_PROMETHEUS_TIMESPAN } from '@console/internal/components/graphs';
 import { GraphEmpty } from '@console/internal/components/graphs/graph-empty';
 import { LoadingInline } from '@console/internal/components/utils';
-import { parsePrometheusDuration } from '@console/internal/components/utils/datetime';
 import { PipelineExampleNames, pipelineTestData } from '../../../../test-data/pipeline-data';
 import { DEFAULT_REFRESH_INTERVAL, PipelineMetricsLevel } from '../../const';
 import * as hookUtils from '../../hooks';

frontend/packages/pipelines-plugin/src/components/pipelines/pipeline-metrics/__tests__/PipelineRunTaskRunGraph.spec.tsx

@@ -1,10 +1,10 @@
 import * as React from 'react';
+import { parsePrometheusDuration } from '@openshift-console/plugin-shared/src/datetime/prometheus';
 import { shallow } from 'enzyme';
 import Measure from 'react-measure';
 import { DEFAULT_PROMETHEUS_TIMESPAN } from '@console/internal/components/graphs';
 import { GraphEmpty } from '@console/internal/components/graphs/graph-empty';
 import { LoadingInline } from '@console/internal/components/utils';
-import { parsePrometheusDuration } from '@console/internal/components/utils/datetime';
 import { PipelineExampleNames, pipelineTestData } from '../../../../test-data/pipeline-data';
 import { DEFAULT_REFRESH_INTERVAL, PipelineMetricsLevel } from '../../const';
 import * as hookUtils from '../../hooks';

frontend/packages/pipelines-plugin/src/components/pipelines/pipeline-metrics/__tests__/PipelineSuccessRatioDonut.spec.tsx

@@ -1,10 +1,10 @@
 import * as React from 'react';
+import { parsePrometheusDuration } from '@openshift-console/plugin-shared/src/datetime/prometheus';
 import { shallow } from 'enzyme';
 import Measure from 'react-measure';
 import { DEFAULT_PROMETHEUS_TIMESPAN } from '@console/internal/components/graphs';
 import { GraphEmpty } from '@console/internal/components/graphs/graph-empty';
 import { LoadingInline } from '@console/internal/components/utils';
-import { parsePrometheusDuration } from '@console/internal/components/utils/datetime';
 import { PipelineExampleNames, pipelineTestData } from '../../../../test-data/pipeline-data';
 import { DEFAULT_REFRESH_INTERVAL, PipelineMetricsLevel } from '../../const';
 import * as hookUtils from '../../hooks';

frontend/packages/pipelines-plugin/src/components/pipelines/pipeline-metrics/charts/TimeSeriesChart.tsx

@@ -1,4 +1,5 @@
 import * as React from 'react';
+import { parsePrometheusDuration } from '@openshift-console/plugin-shared/src/datetime/prometheus';
 import {
   Chart,
   ChartAxis,
@@ -13,7 +14,6 @@ import {
 } from '@patternfly/react-charts';
 import * as _ from 'lodash';
 import { DomainPropType } from 'victory-core';
-import { parsePrometheusDuration } from '@console/internal/components/utils/datetime';
 import { DEFAULT_CHART_HEIGHT } from '../../const';
 import { formatDate, formatValue, getXaxisValues } from '../pipeline-metrics-utils';
 

frontend/packages/pipelines-plugin/src/components/pipelines/pipeline-metrics/pipeline-metrics-utils.ts

@@ -1,3 +1,4 @@
+import { parsePrometheusDuration } from '@openshift-console/plugin-shared/src/datetime/prometheus';
 import i18next from 'i18next';
 import * as _ from 'lodash';
 import {
@@ -6,10 +7,7 @@ import {
   PrometheusResult,
 } from '@console/internal/components/graphs';
 import { humanizeNumberSI } from '@console/internal/components/utils';
-import {
-  dateFormatterNoYear,
-  parsePrometheusDuration,
-} from '@console/internal/components/utils/datetime';
+import { dateFormatterNoYear } from '@console/internal/components/utils/datetime';
 import { PipelineKind } from '../../../types';
 import { PipelineMetricsLevel } from '../const';
 

frontend/packages/pipelines-plugin/src/utils/pipeline-utils.ts

@@ -1,3 +1,4 @@
+import { formatPrometheusDuration } from '@openshift-console/plugin-shared/src/datetime/prometheus';
 import i18next from 'i18next';
 import * as _ from 'lodash';
 import { errorModal } from '@console/internal/components/modals/error-modal';
@@ -7,7 +8,6 @@ import {
   LOG_SOURCE_RUNNING,
   LOG_SOURCE_TERMINATED,
 } from '@console/internal/components/utils';
-import { formatPrometheusDuration } from '@console/internal/components/utils/datetime';
 import { ServiceAccountModel } from '@console/internal/models';
 import {
   ContainerStatus,

frontend/public/components/cluster-settings/oauth.tsx

@@ -1,6 +1,8 @@
 import * as React from 'react';
 import * as _ from 'lodash-es';
 import { useTranslation } from 'react-i18next';
+
+import { formatPrometheusDuration } from '@openshift-console/plugin-shared/src/datetime/prometheus';
 import { Alert, Dropdown, DropdownItem, DropdownToggle } from '@patternfly/react-core';
 import { CaretDownIcon } from '@patternfly/react-icons';
 import { Link } from 'react-router-dom';
@@ -18,7 +20,6 @@ import {
   ResourceSummary,
   SectionHeading,
 } from '../utils';
-import { formatPrometheusDuration } from '../utils/datetime';
 
 const { common } = Kebab.factory;
 const menuActions = [...Kebab.getExtensionsActionsForKind(OAuthModel), ...common];

frontend/public/components/monitoring/alerting.tsx

@@ -16,6 +16,7 @@ import {
   useActivePerspective,
   YellowExclamationTriangleIcon,
 } from '@console/dynamic-plugin-sdk';
+import { formatPrometheusDuration } from '@openshift-console/plugin-shared/src/datetime/prometheus';
 import {
   Alert as PFAlert,
   Button,
@@ -75,7 +76,6 @@ import { FilterToolbar } from '../filter-toolbar';
 import { getPrometheusURL, PrometheusEndpoint } from '../graphs/helpers';
 import { confirmModal } from '../modals';
 import { refreshNotificationPollers } from '../notification-drawer';
-import { formatPrometheusDuration } from '../utils/datetime';
 import { ActionsMenu } from '../utils/dropdown';
 import { Firehose } from '../utils/firehose';
 import { ActionButtons, BreadCrumbs, SectionHeading } from '../utils/headings';

frontend/public/components/monitoring/dashboards/timespan-dropdown.tsx

@@ -1,4 +1,8 @@
 import * as _ from 'lodash';
+import {
+  formatPrometheusDuration,
+  parsePrometheusDuration,
+} from '@openshift-console/plugin-shared/src/datetime/prometheus';
 import { Dropdown, DropdownToggle, DropdownItem } from '@patternfly/react-core';
 import * as React from 'react';
 import { useTranslation } from 'react-i18next';
@@ -9,7 +13,6 @@ import { useDispatch, useSelector } from 'react-redux';
 import { dashboardsSetEndTime, dashboardsSetTimespan } from '../../../actions/observe';
 import { RootState } from '../../../redux';
 import { getQueryArgument, removeQueryArgument, setQueryArgument } from '../../utils';
-import { formatPrometheusDuration, parsePrometheusDuration } from '../../utils/datetime';
 import { useBoolean } from '../hooks/useBoolean';
 import customTimeRangeModal from './custom-time-range-modal';
 import { TimeDropdownsProps } from './types';

frontend/public/components/monitoring/poll-interval-dropdown.tsx

@@ -1,9 +1,12 @@
 import * as _ from 'lodash';
 import * as React from 'react';
 import { useTranslation } from 'react-i18next';
+import {
+  formatPrometheusDuration,
+  parsePrometheusDuration,
+} from '@openshift-console/plugin-shared/src/datetime/prometheus';
 import { Dropdown, DropdownToggle, DropdownItem } from '@patternfly/react-core';
 
-import { formatPrometheusDuration, parsePrometheusDuration } from '../utils/datetime';
 import { useBoolean } from './hooks/useBoolean';
 
 const OFF_KEY = 'OFF_KEY';

frontend/public/components/monitoring/query-browser.tsx

@@ -8,6 +8,10 @@ import {
   PrometheusResult,
   PrometheusValue,
 } from '@console/dynamic-plugin-sdk';
+import {
+  formatPrometheusDuration,
+  parsePrometheusDuration,
+} from '@openshift-console/plugin-shared/src/datetime/prometheus';
 import {
   Chart,
   ChartArea,
@@ -57,8 +61,6 @@ import {
 import {
   dateFormatterNoYear,
   dateTimeFormatterWithSeconds,
-  formatPrometheusDuration,
-  parsePrometheusDuration,
   timeFormatter,
   timeFormatterWithSeconds,
 } from '../utils/datetime';

frontend/public/components/monitoring/silence-form.tsx

@@ -1,4 +1,8 @@
 import * as _ from 'lodash-es';
+import {
+  formatPrometheusDuration,
+  parsePrometheusDuration,
+} from '@openshift-console/plugin-shared/src/datetime/prometheus';
 import { Alert, ActionGroup, Button, TextArea, TextInput, Tooltip } from '@patternfly/react-core';
 import { MinusCircleIcon, PlusCircleIcon } from '@patternfly/react-icons';
 import * as React from 'react';
@@ -14,7 +18,6 @@ import { coFetchJSON } from '../../co-fetch';
 import { RootState } from '../../redux';
 import { refreshNotificationPollers } from '../notification-drawer';
 import { ButtonBar } from '../utils/button-bar';
-import { formatPrometheusDuration, parsePrometheusDuration } from '../utils/datetime';
 import { Dropdown } from '../utils/dropdown';
 import { PageHeading, SectionHeading } from '../utils/headings';
 import { ExternalLink, getURLSearchParams } from '../utils/link';

frontend/public/components/utils/datetime.ts

@@ -136,46 +136,6 @@ export const fromNow = (dateTime: string | Date, now?: Date, options?) => {
 
 export const isValid = (dateTime: Date) => dateTime instanceof Date && !_.isNaN(dateTime.valueOf());
 
-// Conversions between units and milliseconds
-const s = 1000;
-const m = s * 60;
-const h = m * 60;
-const d = h * 24;
-const w = d * 7;
-const units = { w, d, h, m, s };
-
-// Formats a duration in milliseconds like "1h 10m"
-export const formatPrometheusDuration = (ms: number) => {
-  if (!_.isFinite(ms) || ms < 0) {
-    return '';
-  }
-  let remaining = ms;
-  let str = '';
-  _.each(units, (factor, unit) => {
-    const n = Math.floor(remaining / factor);
-    if (n > 0) {
-      str += `${n}${unit} `;
-      remaining -= n * factor;
-    }
-  });
-  return _.trim(str);
-};
-
-// Converts a duration like "1h 10m 23s" to milliseconds or returns 0 if the duration could not be
-// parsed
-export const parsePrometheusDuration = (duration: string): number => {
-  try {
-    const parts = duration
-      .trim()
-      .split(/\s+/)
-      .map((p) => p.match(/^(\d+)([wdhms])$/));
-    return _.sumBy(parts, (p) => parseInt(p[1], 10) * units[p[2]]);
-  } catch (ignored) {
-    // Invalid duration format
-    return 0;
-  }
-};
-
 const zeroPad = (number: number) => (number < 10 ? `0${number}` : number);
 
 export const twentyFourHourTime = (date: Date, showSeconds?: boolean): string => {