FEATURE: local dates range on click (#14355)

This PR is introducing 2 changes.
1. Date popup is displayed on click instead on hover
2. If the range is given then the whole range is always displayed for both startDate and endDate
3. For range, short time is displayed for end if the range is < 24 hours
This commit is contained in:
Krzysztof Kotlarek
2021-09-20 09:23:18 +10:00
committed by GitHub
parent e316467169
commit 82b7e34f30
3 changed files with 139 additions and 27 deletions

View File

@ -446,6 +446,38 @@ test("previews", function (assert) {
);
});
freezeTime({ date: "2020-03-22", timezone: PARIS }, () => {
assert.buildsCorrectDate(
{ duration: 90, timezone: PARIS, timezones: [PARIS] },
{
previews: [
{
current: true,
formated:
'Sunday, March 22, 2020 <br /><svg class=\'fa d-icon d-icon-clock svg-icon svg-string\' xmlns="http://www.w3.org/2000/svg"><use xlink:href="#clock" /></svg> 12:00 AM → 1:30 AM',
timezone: "Paris",
},
],
}
);
});
freezeTime({ date: "2020-03-22", timezone: PARIS }, () => {
assert.buildsCorrectDate(
{ duration: 1440, timezone: PARIS, timezones: [PARIS] },
{
previews: [
{
current: true,
formated:
"Sunday, March 22, 2020 12:00 AM → Monday, March 23, 2020 12:00 AM",
timezone: "Paris",
},
],
}
);
});
freezeTime({ date: "2020-03-22", timezone: PARIS }, () => {
assert.buildsCorrectDate(
{ time: "11:34", timezone: PARIS, timezones: [PARIS] },
@ -453,7 +485,8 @@ test("previews", function (assert) {
previews: [
{
current: true,
formated: "March 22, 2020 11:34 AM",
formated:
'Sunday, March 22, 2020 <br /><svg class=\'fa d-icon d-icon-clock svg-icon svg-string\' xmlns="http://www.w3.org/2000/svg"><use xlink:href="#clock" /></svg> 11:34 AM',
timezone: "Paris",
},
],
@ -508,19 +541,23 @@ test("previews", function (assert) {
previews: [
{
current: true,
formated: "April 7, 2020 2:54 PM",
formated:
'Tuesday, April 7, 2020 <br /><svg class=\'fa d-icon d-icon-clock svg-icon svg-string\' xmlns="http://www.w3.org/2000/svg"><use xlink:href="#clock" /></svg> 2:54 PM',
timezone: "Paris",
},
{
formated: "April 7, 2020 1:54 PM",
formated:
'Tuesday, April 7, 2020 <br /><svg class=\'fa d-icon d-icon-clock svg-icon svg-string\' xmlns="http://www.w3.org/2000/svg"><use xlink:href="#clock" /></svg> 1:54 PM',
timezone: "London",
},
{
formated: "April 7, 2020 1:54 PM",
formated:
'Tuesday, April 7, 2020 <br /><svg class=\'fa d-icon d-icon-clock svg-icon svg-string\' xmlns="http://www.w3.org/2000/svg"><use xlink:href="#clock" /></svg> 1:54 PM',
timezone: "Lagos",
},
{
formated: "April 7, 2020 10:54 PM",
formated:
'Tuesday, April 7, 2020 <br /><svg class=\'fa d-icon d-icon-clock svg-icon svg-string\' xmlns="http://www.w3.org/2000/svg"><use xlink:href="#clock" /></svg> 10:54 PM',
timezone: "Sydney",
},
],
@ -539,11 +576,13 @@ test("previews", function (assert) {
previews: [
{
current: true,
formated: "May 13, 2020 11:00 AM",
formated:
'Wednesday, May 13, 2020 <br /><svg class=\'fa d-icon d-icon-clock svg-icon svg-string\' xmlns="http://www.w3.org/2000/svg"><use xlink:href="#clock" /></svg> 11:00 AM',
timezone: "Los Angeles",
},
{
formated: "May 13, 2020 6:00 PM",
formated:
'Wednesday, May 13, 2020 <br /><svg class=\'fa d-icon d-icon-clock svg-icon svg-string\' xmlns="http://www.w3.org/2000/svg"><use xlink:href="#clock" /></svg> 6:00 PM',
timezone: "UTC",
},
],