github/karma
1
0
Fork 0
mirror of https://github.com/prymitive/karma synced 2026-05-21 04:33:07 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(ui): fix end tab start day

Browse Source
This commit is contained in:
Łukasz Mierzwa
2026-05-17 19:22:38 +01:00
committed by Łukasz Mierzwa
parent 97a5b247c9
commit 088b43bc52
4 changed files with 49 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
CHANGELOG.md
View File

@@ -1,10 +1,16 @@
# Changelog
## v0.131
### Fixed
- Calendar `Ends` tab now uses Monday as the first day of the week - #6715.
## v0.130
### Fixed
- Calendar now uses Monday as the first day of the wek - #6715.
- Calendar now uses Monday as the first day of the week - #6715.
## v0.129

69
ui/src/Components/SilenceModal/DateTimeSelect/__snapshots__/index.test.tsx.snap
View File

@@ -379,6 +379,7 @@ exports[`<DateTimeSelect /> 'Ends' tab matches snapshot 1`] = `
<nav
aria-label="Navigation bar"
class="rdp-nav"
data-animated-nav="true"
>
<button
aria-label="Go to the Previous Month"
@@ -415,9 +416,11 @@ exports[`<DateTimeSelect /> 'Ends' tab matches snapshot 1`] = `
</nav>
<div
class="rdp-month"
data-animated-month="true"
>
<div
class="rdp-month_caption"
data-animated-caption="true"
>
<span
aria-live="polite"
@@ -438,14 +441,8 @@ exports[`<DateTimeSelect /> 'Ends' tab matches snapshot 1`] = `
>
<tr
class="rdp-weekdays"
data-animated-weekdays="true"
>
<th
aria-label="Sunday"
class="rdp-weekday"
scope="col"
>
Su
</th>
<th
aria-label="Monday"
class="rdp-weekday"
@@ -488,24 +485,22 @@ exports[`<DateTimeSelect /> 'Ends' tab matches snapshot 1`] = `
>
Sa
</th>
<th
aria-label="Sunday"
class="rdp-weekday"
scope="col"
>
Su
</th>
</tr>
</thead>
<tbody
class="rdp-weeks"
data-animated-weeks="true"
>
<tr
class="rdp-week"
>
<td
aria-selected="true"
class="rdp-day rdp-hidden rdp-outside rdp-selected rdp-range_middle"
data-day="2061-01-30"
data-hidden="true"
data-month="2061-01"
data-outside="true"
data-selected="true"
role="gridcell"
/>
<td
aria-selected="true"
class="rdp-day rdp-hidden rdp-outside rdp-selected rdp-range_middle"
@@ -588,10 +583,6 @@ exports[`<DateTimeSelect /> 'Ends' tab matches snapshot 1`] = `
5
</button>
</td>
</tr>
<tr
class="rdp-week"
>
<td
class="rdp-day"
data-day="2061-02-06"
@@ -606,6 +597,10 @@ exports[`<DateTimeSelect /> 'Ends' tab matches snapshot 1`] = `
6
</button>
</td>
</tr>
<tr
class="rdp-week"
>
<td
class="rdp-day"
data-day="2061-02-07"
@@ -690,10 +685,6 @@ exports[`<DateTimeSelect /> 'Ends' tab matches snapshot 1`] = `
12
</button>
</td>
</tr>
<tr
class="rdp-week"
>
<td
class="rdp-day"
data-day="2061-02-13"
@@ -708,6 +699,10 @@ exports[`<DateTimeSelect /> 'Ends' tab matches snapshot 1`] = `
13
</button>
</td>
</tr>
<tr
class="rdp-week"
>
<td
class="rdp-day"
data-day="2061-02-14"
@@ -792,10 +787,6 @@ exports[`<DateTimeSelect /> 'Ends' tab matches snapshot 1`] = `
19
</button>
</td>
</tr>
<tr
class="rdp-week"
>
<td
class="rdp-day"
data-day="2061-02-20"
@@ -810,6 +801,10 @@ exports[`<DateTimeSelect /> 'Ends' tab matches snapshot 1`] = `
20
</button>
</td>
</tr>
<tr
class="rdp-week"
>
<td
class="rdp-day"
data-day="2061-02-21"
@@ -894,10 +889,6 @@ exports[`<DateTimeSelect /> 'Ends' tab matches snapshot 1`] = `
26
</button>
</td>
</tr>
<tr
class="rdp-week"
>
<td
class="rdp-day"
data-day="2061-02-27"
@@ -912,6 +903,10 @@ exports[`<DateTimeSelect /> 'Ends' tab matches snapshot 1`] = `
27
</button>
</td>
</tr>
<tr
class="rdp-week"
>
<td
class="rdp-day"
data-day="2061-02-28"
@@ -966,6 +961,14 @@ exports[`<DateTimeSelect /> 'Ends' tab matches snapshot 1`] = `
data-outside="true"
role="gridcell"
/>
<td
class="rdp-day rdp-hidden rdp-outside"
data-day="2061-03-06"
data-hidden="true"
data-month="2061-03"
data-outside="true"
role="gridcell"
/>
</tr>
</tbody>
</table>

6
ui/src/Components/SilenceModal/DateTimeSelect/index.test.tsx
View File

@@ -382,11 +382,13 @@ describe("<TabContentEnd />", () => {
"February 2061",
);
fireEvent.click(container.querySelector("button.rdp-button_next")!);
expect(container.querySelector(".rdp-month_caption")?.textContent).toBe(
const captionsAfterNext = container.querySelectorAll(".rdp-month_caption");
expect(captionsAfterNext[captionsAfterNext.length - 1].textContent).toBe(
"March 2061",
);
fireEvent.click(container.querySelector("button.btn.btn-light.btn-sm")!);
expect(container.querySelector(".rdp-month_caption")?.textContent).toBe(
const captionsAfterToday = container.querySelectorAll(".rdp-month_caption");
expect(captionsAfterToday[captionsAfterToday.length - 1].textContent).toBe(
format(new Date(), "LLLL yyyy"),
);
});

2
ui/src/Components/SilenceModal/DateTimeSelect/index.tsx
View File

@@ -166,6 +166,8 @@ const TabContentEnd: FC<{ silenceFormStore: SilenceFormStore }> = observer(
start: silenceFormStore.data.startsAt,
end: silenceFormStore.data.endsAt,
}}
weekStartsOn={1}
animate
/>
</div>
<HourMinute