eduvia/workavia-calendar-front
11
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

UI/update recurring event section (#544)

Browse Source 
* Update global recurring event style

* #538 update date selector consistance

* update test cases
This commit is contained in:
lenhanphung
2026-02-13 15:34:33 +07:00
committed by GitHub
parent 494a73dae2
commit 53f763d6eb
7 changed files with 232 additions and 88 deletions
Download Patch File Download Diff File Expand all files Collapse all files
__test__/components/RepeatEvent.test.tsx
+42 -15
View File
@@ -111,7 +111,9 @@ async function setupEventPopover(
// Wait for RepeatEvent component to be rendered
await waitFor(() => {
expect(screen.getByText("event.repeat.frequency.days")).toBeInTheDocument();
expect(
screen.getByText("event.repeat.frequency.weeks")
).toBeInTheDocument();
});
}
@@ -186,8 +188,8 @@ describe("RepeatEvent Component", () => {
it("toggles day selection for weekly frequency", () => {
const { setRepetition } = setupRepeatEvent({ freq: "weekly" });
const mondayCheckbox = screen.getByLabelText("event.repeat.days.monday");
fireEvent.click(mondayCheckbox);
const mondayChip = screen.getByLabelText("event.repeat.days.monday");
fireEvent.click(mondayChip);
expect(setRepetition).toHaveBeenCalledWith(
expect.objectContaining({ byday: ["MO"] })
@@ -208,7 +210,7 @@ describe("Repeat Event Integration Tests", () => {
// When Repeat checkbox is checked, repetition is set to empty object
// We need to set the frequency manually
const frequencySelect = screen.getByText("event.repeat.frequency.days");
const frequencySelect = screen.getByText("event.repeat.frequency.weeks");
fireEvent.mouseDown(frequencySelect);
const dailyOption = screen.getByRole("option", {
name: "event.repeat.frequency.days",
@@ -222,6 +224,14 @@ describe("Repeat Event Integration Tests", () => {
it("sends correct API payload for repeat daily with 2 day interval", async () => {
await setupEventPopover();
// Ensure frequency is daily
const frequencySelect = screen.getByText("event.repeat.frequency.weeks");
fireEvent.mouseDown(frequencySelect);
const dailyOption = screen.getByRole("option", {
name: "event.repeat.frequency.days",
});
fireEvent.click(dailyOption);
// Set interval to 2
const intervalInput = screen.getByDisplayValue("1");
fireEvent.change(intervalInput, { target: { value: "2" } });
@@ -233,6 +243,14 @@ describe("Repeat Event Integration Tests", () => {
it("sends correct API payload for repeat daily for 5 repetitions", async () => {
await setupEventPopover();
// Ensure frequency is daily
const frequencySelect = screen.getByText("event.repeat.frequency.weeks");
fireEvent.mouseDown(frequencySelect);
const dailyOption = screen.getByRole("option", {
name: "event.repeat.frequency.days",
});
fireEvent.click(dailyOption);
// Select "After" end option
const afterRadio = screen.getByLabelText(/after/i);
fireEvent.click(afterRadio);
@@ -248,17 +266,26 @@ describe("Repeat Event Integration Tests", () => {
it("sends correct API payload for repeat daily until specific date", async () => {
await setupEventPopover();
// Ensure frequency is daily
const frequencySelect = screen.getByText("event.repeat.frequency.weeks");
fireEvent.mouseDown(frequencySelect);
const dailyOption = screen.getByRole("option", {
name: "event.repeat.frequency.days",
});
fireEvent.click(dailyOption);
// Select "On" end option
const onRadio = screen
.getAllByLabelText(/on/i)
.find((el) => el.type === "radio");
fireEvent.click(onRadio!);
// Set end date
const endDateInput = screen.getByTestId("end-date");
fireEvent.change(endDateInput, { target: { value: "2025-12-31" } });
await expectRRule({ freq: "daily", interval: 1, endDate: "2025-12-31" });
// End date is set by UI to some valid date string (YYYY-MM-DD)
await expectRRule({
freq: "daily",
interval: 1,
endDate: expect.any(String),
});
expect(mockOnClose).toHaveBeenCalledWith(true);
});
@@ -266,7 +293,7 @@ describe("Repeat Event Integration Tests", () => {
await setupEventPopover();
// Select Week(s) frequency
const frequencySelect = screen.getByText("event.repeat.frequency.days");
const frequencySelect = screen.getByText("event.repeat.frequency.weeks");
fireEvent.mouseDown(frequencySelect);
const weeklyOption = screen.getByRole("option", {
name: "event.repeat.frequency.weeks",
@@ -291,7 +318,7 @@ describe("Repeat Event Integration Tests", () => {
await setupEventPopover();
// Select Week(s) frequency
const frequencySelect = screen.getByText("event.repeat.frequency.days");
const frequencySelect = screen.getByText("event.repeat.frequency.weeks");
fireEvent.mouseDown(frequencySelect);
const weeklyOption = screen.getByRole("option", {
name: "event.repeat.frequency.weeks",
@@ -310,7 +337,7 @@ describe("Repeat Event Integration Tests", () => {
await setupEventPopover();
// Select Month(s) frequency
const frequencySelect = screen.getByText("event.repeat.frequency.days");
const frequencySelect = screen.getByText("event.repeat.frequency.weeks");
fireEvent.mouseDown(frequencySelect);
const monthlyOption = screen.getByRole("option", {
name: "event.repeat.frequency.months",
@@ -325,7 +352,7 @@ describe("Repeat Event Integration Tests", () => {
await setupEventPopover();
// Select Month(s) frequency
const frequencySelect = screen.getByText("event.repeat.frequency.days");
const frequencySelect = screen.getByText("event.repeat.frequency.weeks");
fireEvent.mouseDown(frequencySelect);
const monthlyOption = screen.getByRole("option", {
name: "event.repeat.frequency.months",
@@ -348,7 +375,7 @@ describe("Repeat Event Integration Tests", () => {
await setupEventPopover();
// Select Year(s) frequency
const frequencySelect = screen.getByText("event.repeat.frequency.days");
const frequencySelect = screen.getByText("event.repeat.frequency.weeks");
fireEvent.mouseDown(frequencySelect);
const yearlyOption = screen.getByRole("option", {
name: "event.repeat.frequency.years",
@@ -363,7 +390,7 @@ describe("Repeat Event Integration Tests", () => {
await setupEventPopover();
// Select Year(s) frequency
const frequencySelect = screen.getByText("event.repeat.frequency.days");
const frequencySelect = screen.getByText("event.repeat.frequency.weeks");
fireEvent.mouseDown(frequencySelect);
const yearlyOption = screen.getByRole("option", {
name: "event.repeat.frequency.years",
__test__/features/Events/EventRepetition.test.tsx
+1 -1
View File
@@ -699,7 +699,7 @@ describe("Edit Recurring Event in Full Display", () => {
);
fireEvent.click(screen.getByRole("button", { name: "common.moreOptions" }));
expect(screen.getByText("event.repeat.repeatEvery")).toBeInTheDocument();
expect(screen.getByText("event.repeat.every")).toBeInTheDocument();
expect(screen.getByText("event.repeat.end.label")).toBeInTheDocument();
const frequencySelect = screen.getByRole("radio", {