mirror of
https://github.com/OneUptime/oneuptime.git
synced 2026-04-06 00:32:12 +02:00
feat: Update date formatting to user-friendly display in various components
This commit is contained in:
@@ -201,12 +201,13 @@ export default class OneUptimeDate {
|
||||
return this.secondsToFormattedFriendlyTimeString(seconds);
|
||||
}
|
||||
|
||||
public static toTimeString(date: Date | string): string {
|
||||
public static toTimeString(date: Date | string, use12HourFormat?: boolean): string {
|
||||
if (typeof date === "string") {
|
||||
date = this.fromString(date);
|
||||
}
|
||||
|
||||
return moment(date).format("HH:mm");
|
||||
const format = use12HourFormat || this.getUserPrefers12HourFormat() ? "hh:mm A" : "HH:mm";
|
||||
return moment(date).format(format);
|
||||
}
|
||||
|
||||
public static isSame(date1: Date, date2: Date): boolean {
|
||||
|
||||
@@ -178,7 +178,7 @@ const Detail: DetailFunction = <T extends GenericObject>(
|
||||
|
||||
if (field.fieldType === FieldType.Date) {
|
||||
if (data) {
|
||||
data = OneUptimeDate.getDateAsLocalFormattedString(
|
||||
data = OneUptimeDate.getDateAsUserFriendlyLocalFormattedString(
|
||||
data as string,
|
||||
true,
|
||||
);
|
||||
|
||||
@@ -55,7 +55,7 @@ const EventHistoryDayList: FunctionComponent<ComponentProps> = (
|
||||
width: isMobile ? "100%" : "15%",
|
||||
}}
|
||||
>
|
||||
{OneUptimeDate.getDateAsLocalFormattedString(props.date, true)}
|
||||
{OneUptimeDate.getDateAsUserFriendlyLocalFormattedString(props.date, true)}
|
||||
</div>
|
||||
<div
|
||||
style={{
|
||||
|
||||
@@ -144,7 +144,7 @@ const LogItem: FunctionComponent<ComponentProps> = (
|
||||
DATE TIME:
|
||||
</div>
|
||||
<div className="text-slate-500 courier-prime">
|
||||
{OneUptimeDate.getDateAsFormattedString(props.log.time)} {" "}
|
||||
{OneUptimeDate.getDateAsUserFriendlyFormattedString(props.log.time)} {" "}
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
@@ -192,7 +192,7 @@ const TableRow: TableRowFunction = <T extends GenericObject>(
|
||||
column.key && !column.getElement ? (
|
||||
column.type === FieldType.Date ? (
|
||||
props.item[column.key] ? (
|
||||
OneUptimeDate.getDateAsLocalFormattedString(
|
||||
OneUptimeDate.getDateAsUserFriendlyLocalFormattedString(
|
||||
props.item[column.key] as string,
|
||||
true,
|
||||
)
|
||||
@@ -367,7 +367,7 @@ const TableRow: TableRowFunction = <T extends GenericObject>(
|
||||
{column.key && !column.getElement ? (
|
||||
column.type === FieldType.Date ? (
|
||||
props.item[column.key] ? (
|
||||
OneUptimeDate.getDateAsLocalFormattedString(
|
||||
OneUptimeDate.getDateAsUserFriendlyLocalFormattedString(
|
||||
props.item[column.key] as string,
|
||||
true,
|
||||
)
|
||||
|
||||
@@ -20,7 +20,7 @@ const CopilotLastRunAt: FunctionComponent<ComponentProps> = (
|
||||
<Alert
|
||||
type={AlertType.INFO}
|
||||
strongTitle="Data Updated At"
|
||||
title={`Copilot ran at ${OneUptimeDate.getDateAsLocalFormattedString(props.lastRunAt)}. Please run copilot again to update data.`}
|
||||
title={`Copilot ran at ${OneUptimeDate.getDateAsUserFriendlyLocalFormattedString(props.lastRunAt)}. Please run copilot again to update data.`}
|
||||
/>
|
||||
)}
|
||||
|
||||
|
||||
@@ -88,7 +88,7 @@ const CustomMonitorSummaryView: FunctionComponent<ComponentProps> = (
|
||||
title="Monitored At"
|
||||
value={
|
||||
props.monitoredAt
|
||||
? OneUptimeDate.getDateAsLocalFormattedString(props.monitoredAt)
|
||||
? OneUptimeDate.getDateAsUserFriendlyLocalFormattedString(props.monitoredAt)
|
||||
: "-"
|
||||
}
|
||||
/>
|
||||
|
||||
@@ -48,7 +48,7 @@ const PingMonitorView: FunctionComponent<ComponentProps> = (
|
||||
title="Monitored At"
|
||||
value={
|
||||
props.probeMonitorResponse?.monitoredAt
|
||||
? OneUptimeDate.getDateAsLocalFormattedString(
|
||||
? OneUptimeDate.getDateAsUserFriendlyLocalFormattedString(
|
||||
props.probeMonitorResponse.monitoredAt,
|
||||
)
|
||||
: "-"
|
||||
|
||||
@@ -48,7 +48,7 @@ const SSLCertificateMonitorView: FunctionComponent<ComponentProps> = (
|
||||
title="Issued At"
|
||||
value={
|
||||
sslResponse.createdAt
|
||||
? OneUptimeDate.getDateAsLocalFormattedString(
|
||||
? OneUptimeDate.getDateAsUserFriendlyLocalFormattedString(
|
||||
sslResponse.createdAt,
|
||||
)
|
||||
: "-"
|
||||
@@ -60,7 +60,7 @@ const SSLCertificateMonitorView: FunctionComponent<ComponentProps> = (
|
||||
title="Expires At"
|
||||
value={
|
||||
sslResponse.expiresAt
|
||||
? OneUptimeDate.getDateAsLocalFormattedString(
|
||||
? OneUptimeDate.getDateAsUserFriendlyLocalFormattedString(
|
||||
sslResponse.expiresAt,
|
||||
)
|
||||
: "-"
|
||||
|
||||
@@ -169,7 +169,7 @@ const ServerMonitorSummaryView: FunctionComponent<ComponentProps> = (
|
||||
title="Last Ping At"
|
||||
value={
|
||||
props.serverMonitorResponse?.requestReceivedAt
|
||||
? OneUptimeDate.getDateAsLocalFormattedString(
|
||||
? OneUptimeDate.getDateAsUserFriendlyLocalFormattedString(
|
||||
props.serverMonitorResponse.requestReceivedAt,
|
||||
)
|
||||
: "-"
|
||||
|
||||
@@ -175,7 +175,7 @@ const TraceExplorer: FunctionComponent<ComponentProps> = (
|
||||
</div>
|
||||
<div className="">
|
||||
<div className="font-semibold">Seen at:</div>{" "}
|
||||
<div>{OneUptimeDate.getDateAsFormattedString(span.startTime!)}</div>
|
||||
<div>{OneUptimeDate.getDateAsUserFriendlyFormattedString(span.startTime!)}</div>
|
||||
</div>
|
||||
<div className="">
|
||||
<div className="font-semibold">Start:</div>{" "}
|
||||
|
||||
@@ -65,7 +65,7 @@ export const getAnnouncementEventItem: GetAnnouncementEventItemFunction = (
|
||||
eventTypeColor: Blue500,
|
||||
eventSecondDescription: announcement.showAnnouncementAt!
|
||||
? "Announced at " +
|
||||
OneUptimeDate.getDateAsLocalFormattedString(
|
||||
OneUptimeDate.getDateAsUserFriendlyLocalFormattedString(
|
||||
announcement.showAnnouncementAt!,
|
||||
)
|
||||
: "",
|
||||
|
||||
@@ -209,7 +209,7 @@ export const getIncidentEventItem: GetIncidentEventItemFunction = (
|
||||
anotherStatus: incident.incidentSeverity?.name,
|
||||
eventSecondDescription: incident.createdAt
|
||||
? "Created at " +
|
||||
OneUptimeDate.getDateAsLocalFormattedString(incident.createdAt!)
|
||||
OneUptimeDate.getDateAsUserFriendlyLocalFormattedString(incident.createdAt!)
|
||||
: "",
|
||||
eventTypeColor: Red,
|
||||
labels:
|
||||
|
||||
@@ -19,7 +19,7 @@ RunCron(
|
||||
async () => {
|
||||
logger.debug(
|
||||
"Checking IncomingRequestMonitor:CheckHeartbeat at " +
|
||||
OneUptimeDate.getDateAsLocalFormattedString(
|
||||
OneUptimeDate.getDateAsUserFriendlyLocalFormattedString(
|
||||
OneUptimeDate.getCurrentDate(),
|
||||
),
|
||||
);
|
||||
|
||||
@@ -419,7 +419,7 @@ RunCron(
|
||||
})
|
||||
.join(", ") || "",
|
||||
|
||||
scheduledAt: OneUptimeDate.getDateAsFormattedString(
|
||||
scheduledAt: OneUptimeDate.getDateAsUserFriendlyFormattedString(
|
||||
event.startsAt!,
|
||||
),
|
||||
eventTitle: event.title || "",
|
||||
|
||||
@@ -381,7 +381,7 @@ RunCron(
|
||||
scheduledEventStateTimeline.scheduledMaintenanceState
|
||||
?.name || "",
|
||||
|
||||
scheduledAt: OneUptimeDate.getDateAsFormattedString(
|
||||
scheduledAt: OneUptimeDate.getDateAsUserFriendlyFormattedString(
|
||||
event.startsAt!,
|
||||
),
|
||||
eventTitle: event.title || "",
|
||||
|
||||
Reference in New Issue
Block a user