Commit 38bd6dd1 by Tushar Tripathi Committed by GitHub

Dashboard: Add Datetime local (No date if today) option in panel axes' units (#28011)

* Add Datetime local (No date if today) option

* Add more tests

* Revert to using function for local dateTime format
This is required as Intl api used to convert date to local format is not present in
node environments
parent f830d877
...@@ -5,6 +5,7 @@ import { ...@@ -5,6 +5,7 @@ import {
dateTimeAsUS, dateTimeAsUS,
dateTimeAsUSNoDateIfToday, dateTimeAsUSNoDateIfToday,
getDateTimeAsLocalFormat, getDateTimeAsLocalFormat,
getDateTimeAsLocalFormatNoDateIfToday,
dateTimeFromNow, dateTimeFromNow,
toClockMilliseconds, toClockMilliseconds,
toClockSeconds, toClockSeconds,
...@@ -186,6 +187,11 @@ export const getCategories = (): ValueFormatCategory[] => [ ...@@ -186,6 +187,11 @@ export const getCategories = (): ValueFormatCategory[] => [
{ name: 'Datetime US', id: 'dateTimeAsUS', fn: dateTimeAsUS }, { name: 'Datetime US', id: 'dateTimeAsUS', fn: dateTimeAsUS },
{ name: 'Datetime US (No date if today)', id: 'dateTimeAsUSNoDateIfToday', fn: dateTimeAsUSNoDateIfToday }, { name: 'Datetime US (No date if today)', id: 'dateTimeAsUSNoDateIfToday', fn: dateTimeAsUSNoDateIfToday },
{ name: 'Datetime local', id: 'dateTimeAsLocal', fn: getDateTimeAsLocalFormat() }, { name: 'Datetime local', id: 'dateTimeAsLocal', fn: getDateTimeAsLocalFormat() },
{
name: 'Datetime local (No date if today)',
id: 'dateTimeAsLocalNoDateIfToday',
fn: getDateTimeAsLocalFormatNoDateIfToday(),
},
{ name: 'Datetime default', id: 'dateTimeAsSystem', fn: dateTimeSystemFormatter }, { name: 'Datetime default', id: 'dateTimeAsSystem', fn: dateTimeSystemFormatter },
{ name: 'From Now', id: 'dateTimeFromNow', fn: dateTimeFromNow }, { name: 'From Now', id: 'dateTimeFromNow', fn: dateTimeFromNow },
], ],
......
...@@ -3,6 +3,8 @@ import { ...@@ -3,6 +3,8 @@ import {
dateTimeAsIsoNoDateIfToday, dateTimeAsIsoNoDateIfToday,
dateTimeAsUS, dateTimeAsUS,
dateTimeAsUSNoDateIfToday, dateTimeAsUSNoDateIfToday,
getDateTimeAsLocalFormat,
getDateTimeAsLocalFormatNoDateIfToday,
dateTimeFromNow, dateTimeFromNow,
Interval, Interval,
toClock, toClock,
...@@ -74,6 +76,36 @@ describe('date time formats', () => { ...@@ -74,6 +76,36 @@ describe('date time formats', () => {
expect(actual.text).toBe(expected); expect(actual.text).toBe(expected);
}); });
it('should format as local date', () => {
const dateTimeObject = browserTime.toDate();
const formattedDateText = getDateTimeAsLocalFormat()(epoch, 0, 0).text;
expect(formattedDateText).toContain(dateTimeObject.getFullYear());
expect(formattedDateText).toContain(dateTimeObject.getSeconds());
});
it('should format as local date and skip date when today', () => {
const now = dateTime();
const dateTimeObject = now.toDate();
const formattedDateText = getDateTimeAsLocalFormatNoDateIfToday()(now.valueOf(), 0, 0).text;
expect(formattedDateText).not.toContain(dateTimeObject.getFullYear());
expect(formattedDateText).toContain(dateTimeObject.getSeconds());
});
it('should format as local date (in UTC)', () => {
const dateTimeObject = utcTime.toDate();
const formattedDateText = getDateTimeAsLocalFormat()(epoch, 0, 0, 'utc').text;
expect(formattedDateText).toContain(dateTimeObject.getFullYear());
expect(formattedDateText).toContain(dateTimeObject.getSeconds());
});
it('should format as local date (in UTC) and skip date when today', () => {
const now = toUtc();
const dateTimeObject = now.toDate();
const formattedDateText = getDateTimeAsLocalFormatNoDateIfToday()(now.valueOf(), 0, 0, 'utc').text;
expect(formattedDateText).not.toContain(dateTimeObject.getFullYear());
expect(formattedDateText).toContain(dateTimeObject.getSeconds());
});
it('should format as from now with days', () => { it('should format as from now with days', () => {
const daysAgo = dateTime().add(-7, 'd'); const daysAgo = dateTime().add(-7, 'd');
const expected = '7 days ago'; const expected = '7 days ago';
......
...@@ -383,6 +383,24 @@ export function getDateTimeAsLocalFormat() { ...@@ -383,6 +383,24 @@ export function getDateTimeAsLocalFormat() {
); );
} }
export function getDateTimeAsLocalFormatNoDateIfToday() {
return toDateTimeValueFormatter(
localTimeFormat({
year: 'numeric',
month: '2-digit',
day: '2-digit',
hour: '2-digit',
minute: '2-digit',
second: '2-digit',
}),
localTimeFormat({
hour: '2-digit',
minute: '2-digit',
second: '2-digit',
})
);
}
export function dateTimeSystemFormatter( export function dateTimeSystemFormatter(
value: number, value: number,
decimals: DecimalCount, decimals: DecimalCount,
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment