diff --git a/ui/src/app/applications/components/application-node-info/application-node-info.tsx b/ui/src/app/applications/components/application-node-info/application-node-info.tsx index d449a6cecdc19..69194e3094a34 100644 --- a/ui/src/app/applications/components/application-node-info/application-node-info.tsx +++ b/ui/src/app/applications/components/application-node-info/application-node-info.tsx @@ -7,7 +7,7 @@ import {YamlEditor} from '../../../shared/components'; import * as models from '../../../shared/models'; import {services} from '../../../shared/services'; import {ApplicationResourcesDiff} from '../application-resources-diff/application-resources-diff'; -import {ComparisonStatusIcon, getPodStateReason, HealthStatusIcon} from '../utils'; +import {ComparisonStatusIcon, formatCreationTimestamp, getPodStateReason, HealthStatusIcon} from '../utils'; require('./application-node-info.scss'); @@ -25,10 +25,7 @@ export const ApplicationNodeInfo = (props: { if (props.node.createdAt) { attributes.push({ title: 'CREATED_AT', - value: moment - .utc(props.node.createdAt) - .local() - .format('MM/DD/YYYY HH:mm:ss') + value: formatCreationTimestamp(props.node.createdAt) }); } if ((props.node.images || []).length) { diff --git a/ui/src/app/applications/components/application-summary/application-summary.tsx b/ui/src/app/applications/components/application-summary/application-summary.tsx index 84255b598b47c..72d2d5f34ec4c 100644 --- a/ui/src/app/applications/components/application-summary/application-summary.tsx +++ b/ui/src/app/applications/components/application-summary/application-summary.tsx @@ -19,10 +19,9 @@ import {Consumer, ContextApis} from '../../../shared/context'; import * as models from '../../../shared/models'; import {services} from '../../../shared/services'; -import * as moment from 'moment'; -import {ApplicationSyncOptionsField, REPLACE_WARNING} from '../application-sync-options/application-sync-options'; +import {ApplicationSyncOptionsField} from '../application-sync-options/application-sync-options'; import {RevisionFormField} from '../revision-form-field/revision-form-field'; -import {ComparisonStatusIcon, HealthStatusIcon, syncStatusMessage, urlPattern} from '../utils'; +import {ComparisonStatusIcon, HealthStatusIcon, syncStatusMessage, urlPattern, formatCreationTimestamp} from '../utils'; import {ApplicationRetryOptions} from '../application-retry-options/application-retry-options'; import {ApplicationRetryView} from '../application-retry-view/application-retry-view'; import {Link} from 'react-router-dom'; @@ -137,10 +136,7 @@ export const ApplicationSummary = (props: {app: models.Application; updateApp: ( }, { title: 'CREATED_AT', - view: moment - .utc(app.metadata.creationTimestamp) - .local() - .format('MM/DD/YYYY HH:mm:ss') + view: formatCreationTimestamp(app.metadata.creationTimestamp) }, { title: 'REPO URL', diff --git a/ui/src/app/applications/components/utils.tsx b/ui/src/app/applications/components/utils.tsx index 11d160f52f1c0..fe0b6d6303f51 100644 --- a/ui/src/app/applications/components/utils.tsx +++ b/ui/src/app/applications/components/utils.tsx @@ -1120,3 +1120,20 @@ export function appQualifiedName(app: appModels.Application): string { export function appInstanceName(app: appModels.Application): string { return app.metadata.namespace + '_' + app.metadata.name; } + +export function formatCreationTimestamp(creationTimestamp: string) { + const createdAt = moment + .utc(creationTimestamp) + .local() + .format('MM/DD/YYYY HH:mm:ss'); + const fromNow = moment + .utc(creationTimestamp) + .local() + .fromNow(); + return ( + + {createdAt} + ({fromNow}) + + ); +}