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

[#265] prefills title + trad + test (#293)

Browse Source 
Co-authored-by: Camille Moussu <cmoussu@linagora.com>
This commit is contained in:
Camille Moussu
2025-11-12 20:42:05 +01:00
committed by GitHub
parent 991cb6e56e
commit f886846a2b
10 changed files with 188 additions and 179 deletions
Download Patch File Download Diff File Expand all files Collapse all files
__test__/features/Events/EventDisplay.test.tsx
+21
View File
@@ -82,6 +82,13 @@ describe("Event Preview Display", () => {
end: day.toISOString(),
organizer: { cn: "test", cal_address: "test@test.com" },
},
event3: {
uid: "event3",
calId: "667037022b752d0026472254/cal1",
start: day.toISOString(),
end: day.toISOString(),
organizer: { cn: "test", cal_address: "test@test.com" },
},
},
ownerEmails: ["test@test.com"],
},
@@ -797,7 +804,21 @@ describe("Event Preview Display", () => {
}).not.toThrow();
});
});
it("renders correctly event data event with empty title", () => {
renderWithProviders(
<EventPreviewModal
open={true}
onClose={mockOnClose}
calId={"667037022b752d0026472254/cal1"}
eventId={"event3"}
/>,
preloadedState
);
expect(screen.getByText("event.untitled")).toBeInTheDocument();
expect(screen.getByText("Calendar")).toBeInTheDocument();
});
describe("BUGFIX", () => {
it("doesnt render anything next to date of all day preview", () => {
const allDayState = {
__test__/features/Events/EventModal.test.tsx
-2
View File
@@ -1,11 +1,9 @@
import { DateSelectArg } from "@fullcalendar/core";
import { act, fireEvent, screen, waitFor } from "@testing-library/react";
import userEvent from "@testing-library/user-event";
import preview from "jest-preview";
import * as eventThunks from "../../../src/features/Calendars/CalendarSlice";
import EventPopover from "../../../src/features/Events/EventModal";
import { api } from "../../../src/utils/apiUtils";
import { formatDateToYYYYMMDDTHHMMSS } from "../../../src/utils/dateUtils";
import { renderWithProviders } from "../../utils/Renderwithproviders";
jest.mock("../../../src/utils/apiUtils");
src/components/Calendar/utils/calendarUtils.ts
+14 -2
View File
@@ -6,6 +6,7 @@ import { SlotLabelContentArg } from "@fullcalendar/core";
import moment from "moment-timezone";
import { refreshSingularCalendar } from "../../Event/utils/eventUtils";
import { ThunkDispatch } from "@reduxjs/toolkit";
import { useI18n } from "cozy-ui/transpiled/react/providers/I18n";
export const updateSlotLabelVisibility = (
currentTime: Date,
@@ -58,13 +59,24 @@ export const eventToFullCalendarFormat = (
filteredTempEvents: CalendarEvent[],
userId: string | undefined
) => {
const { t } = useI18n();
return filteredEvents
.concat(filteredTempEvents.map((e) => ({ ...e, temp: true })))
.map((e) => {
if (e.calId.split("/")[0] === userId) {
return { ...e, colors: e.color, editable: true };
return {
...e,
title: e.title ? e.title : t("event.untitled"),
colors: e.color,
editable: true,
};
}
return { ...e, colors: e.color, editable: false };
return {
...e,
title: e.title ? e.title : t("event.untitled"),
colors: e.color,
editable: false,
};
});
};
src/components/Event/EventFormFields.tsx
+1 -11
View File
@@ -323,7 +323,6 @@ export default function EventFormFields({
// Validation logic
const validateForm = React.useCallback(() => {
return validateEventForm({
title,
startDate,
startTime,
endDate,
@@ -410,14 +409,7 @@ export default function EventFormFields({
return (
<>
<FieldWithLabel
label={
<>
{t("event.form.title")} <span style={{ color: "red" }}>*</span>
</>
}
isExpanded={showMore}
>
<FieldWithLabel label={t("event.form.title")} isExpanded={showMore}>
<TextField
fullWidth
label={!showMore ? t("event.form.title") : ""}
@@ -426,8 +418,6 @@ export default function EventFormFields({
onChange={(e) => {
setTitle(e.target.value);
}}
error={!!validation.errors.title}
helperText={validation.errors.title}
size="small"
margin="dense"
inputRef={titleInputRef}
src/components/Event/utils/formValidation.ts
+1 -8
View File
@@ -4,7 +4,6 @@ import { combineDateTime } from "./dateTimeHelpers";
* Validation parameters for event form
*/
export interface ValidationParams {
title: string;
startDate: string;
startTime: string;
endDate: string;
@@ -21,7 +20,6 @@ export interface ValidationParams {
export interface ValidationResult {
isValid: boolean;
errors: {
title: string;
dateTime: string;
};
}
@@ -33,7 +31,6 @@ export interface ValidationResult {
*/
export function validateEventForm(params: ValidationParams): ValidationResult {
const {
title,
startDate,
startTime,
endDate,
@@ -44,9 +41,6 @@ export function validateEventForm(params: ValidationParams): ValidationResult {
showMore = false,
} = params;
const isTitleValid = title.trim().length > 0;
const shouldShowTitleError = showValidationErrors && !isTitleValid;
let isDateTimeValid = true;
let dateTimeError = "";
@@ -154,12 +148,11 @@ export function validateEventForm(params: ValidationParams): ValidationResult {
}
}
const isValid = isTitleValid && isDateTimeValid;
const isValid = isDateTimeValid;
return {
isValid,
errors: {
title: shouldShowTitleError ? "Title is required" : "",
dateTime: showValidationErrors ? dateTimeError : "",
},
};
src/components/Menubar/Menubar.tsx
+1
View File
@@ -254,6 +254,7 @@ export function Menubar({
value={lang}
onChange={(e) => {
dispatch(setLanguage(e.target.value));
handleLangClose();
}}
variant="outlined"
aria-label={t("menubar.languageSelector")}
src/features/Events/EventDisplayPreview.tsx
+147 -153
View File
@@ -141,175 +141,169 @@ export default function EventPreviewModal({
actionsJustifyContent="center"
style={{ overflow: "auto" }}
title={
event.title && (
<>
<DialogActions>
<Box>
{(window as any).DEBUG && (
<IconButton
onClick={async () => {
const icsContent = await dlEvent(event);
const blob = new Blob([icsContent], {
type: "text/calendar",
});
const url = URL.createObjectURL(blob);
<>
<DialogActions>
<Box>
{(window as any).DEBUG && (
<IconButton
onClick={async () => {
const icsContent = await dlEvent(event);
const blob = new Blob([icsContent], {
type: "text/calendar",
});
const url = URL.createObjectURL(blob);
const link = document.createElement("a");
link.href = url;
link.download = `${eventId}.ics`;
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
URL.revokeObjectURL(url);
}}
>
<FileDownloadOutlinedIcon />
</IconButton>
)}
{user.userData.email === event.organizer?.cal_address &&
calendar.ownerEmails?.includes(user.userData.email) && (
<IconButton
size="small"
onClick={() => {
if (isRecurring) {
setAfterChoiceFunc(() => () => {
setHidePreview(true);
setOpenUpdateModal(true);
});
setOpenEditModePopup("edit");
} else {
setHidePreview(true);
setOpenUpdateModal(true);
}
}}
>
<EditIcon />
</IconButton>
)}
{((event.class !== "PRIVATE" && !isOwn) || isOwn) && (
const link = document.createElement("a");
link.href = url;
link.download = `${eventId}.ics`;
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
URL.revokeObjectURL(url);
}}
>
<FileDownloadOutlinedIcon />
</IconButton>
)}
{user.userData.email === event.organizer?.cal_address &&
calendar.ownerEmails?.includes(user.userData.email) && (
<IconButton
size="small"
onClick={(e) => setToggleActionMenu(e.currentTarget)}
onClick={() => {
if (isRecurring) {
setAfterChoiceFunc(() => () => {
setHidePreview(true);
setOpenUpdateModal(true);
});
setOpenEditModePopup("edit");
} else {
setHidePreview(true);
setOpenUpdateModal(true);
}
}}
>
<MoreVertIcon />
<EditIcon />
</IconButton>
)}
<Menu
open={Boolean(toggleActionMenu)}
onClose={() => setToggleActionMenu(null)}
anchorEl={toggleActionMenu}
>
{mailSpaUrl && attendees.length > 0 && (
<MenuItem
onClick={() =>
window.open(
`${mailSpaUrl}/mailto/?uri=mailto:${event.attendee
.map((a) => a.cal_address)
.filter((mail) => mail !== user.userData.email)
.join(",")}?subject=${event.title}`
)
}
>
{t("eventPreview.emailAttendees")}
</MenuItem>
)}
<EventDuplication
event={event}
onClose={() => setToggleActionMenu(null)}
onOpenDuplicate={() => {
setToggleActionMenu(null);
setHidePreview(true);
setOpenDuplicateModal(true);
}}
/>
{user.userData.email === event.organizer?.cal_address && (
<MenuItem
onClick={async () => {
if (isRecurring) {
setAfterChoiceFunc(
() =>
(typeOfAction?: "solo" | "all" | undefined) =>
handleDelete(
isRecurring,
typeOfAction,
onClose,
dispatch,
calendar,
event,
calId,
eventId
)
);
setOpenEditModePopup("edit");
} else {
onClose({}, "backdropClick");
await dispatch(
deleteEventAsync({
calId,
eventId,
eventURL: event.URL,
})
);
}
updateTempList();
}}
>
{t("eventPreview.deleteEvent")}
</MenuItem>
)}
</Menu>
{((event.class !== "PRIVATE" && !isOwn) || isOwn) && (
<IconButton
size="small"
onClick={() => onClose({}, "backdropClick")}
onClick={(e) => setToggleActionMenu(e.currentTarget)}
>
<CloseIcon />
<MoreVertIcon />
</IconButton>
</Box>
</DialogActions>
<Box display="flex" flexDirection="row">
{event.class === "PRIVATE" &&
(isOwn ? (
<Tooltip
title={t("eventPreview.privateEvent.tooltipOwn")}
placement="top"
>
<LockOutlineIcon />
</Tooltip>
) : (
<LockOutlineIcon />
))}
<Typography
variant="h5"
sx={{
fontSize: "24px",
fontWeight: 600,
wordBreak: "break-word",
fontFamily: "Inter, sans-serif",
}}
gutterBottom
)}
<Menu
open={Boolean(toggleActionMenu)}
onClose={() => setToggleActionMenu(null)}
anchorEl={toggleActionMenu}
>
{event.title}
</Typography>
{event.transp === "TRANSPARENT" && (
{mailSpaUrl && attendees.length > 0 && (
<MenuItem
onClick={() =>
window.open(
`${mailSpaUrl}/mailto/?uri=mailto:${event.attendee
.map((a) => a.cal_address)
.filter((mail) => mail !== user.userData.email)
.join(",")}?subject=${event.title}`
)
}
>
{t("eventPreview.emailAttendees")}
</MenuItem>
)}
<EventDuplication
event={event}
onClose={() => setToggleActionMenu(null)}
onOpenDuplicate={() => {
setToggleActionMenu(null);
setHidePreview(true);
setOpenDuplicateModal(true);
}}
/>
{user.userData.email === event.organizer?.cal_address && (
<MenuItem
onClick={async () => {
if (isRecurring) {
setAfterChoiceFunc(
() => (typeOfAction?: "solo" | "all" | undefined) =>
handleDelete(
isRecurring,
typeOfAction,
onClose,
dispatch,
calendar,
event,
calId,
eventId
)
);
setOpenEditModePopup("edit");
} else {
onClose({}, "backdropClick");
await dispatch(
deleteEventAsync({
calId,
eventId,
eventURL: event.URL,
})
);
}
updateTempList();
}}
>
{t("eventPreview.deleteEvent")}
</MenuItem>
)}
</Menu>
<IconButton
size="small"
onClick={() => onClose({}, "backdropClick")}
>
<CloseIcon />
</IconButton>
</Box>
</DialogActions>
<Box display="flex" flexDirection="row">
{event.class === "PRIVATE" &&
(isOwn ? (
<Tooltip
title={t("eventPreview.free.tooltip")}
title={t("eventPreview.privateEvent.tooltipOwn")}
placement="top"
>
<Chip
icon={<CircleIcon color="success" fontSize="small" />}
label={t("eventPreview.free.label")}
/>
<LockOutlineIcon />
</Tooltip>
)}
</Box>
<Typography color="text.secondaryContainer" gutterBottom>
{formatDate(event.start, t, event.allday)}
{event.end &&
formatEnd(event.start, event.end, t, event.allday) &&
` – ${formatEnd(event.start, event.end, t, event.allday)} ${!event.allday ? getTimezoneOffset(timezone) : ""}`}
) : (
<LockOutlineIcon />
))}
<Typography
variant="h5"
sx={{
fontSize: "24px",
fontWeight: 600,
wordBreak: "break-word",
fontFamily: "Inter, sans-serif",
}}
gutterBottom
>
{event.title ? event.title : t("event.untitled")}
</Typography>
</>
)
{event.transp === "TRANSPARENT" && (
<Tooltip title={t("eventPreview.free.tooltip")} placement="top">
<Chip
icon={<CircleIcon color="success" fontSize="small" />}
label={t("eventPreview.free.label")}
/>
</Tooltip>
)}
</Box>
<Typography color="text.secondaryContainer" gutterBottom>
{formatDate(event.start, t, event.allday)}
{event.end &&
formatEnd(event.start, event.end, t, event.allday) &&
` – ${formatEnd(event.start, event.end, t, event.allday)} ${!event.allday ? getTimezoneOffset(timezone) : ""}`}
</Typography>
</>
}
actions={
currentUserAttendee &&
src/features/Events/EventModal.tsx
+1 -3
View File
@@ -33,7 +33,6 @@ import { addDays } from "../../components/Event/utils/dateRules";
import { useI18n } from "cozy-ui/transpiled/react/providers/I18n";
function EventPopover({
anchorEl,
open,
onClose,
selectedRange,
@@ -50,6 +49,7 @@ function EventPopover({
event?: CalendarEvent;
}) {
const dispatch = useAppDispatch();
const { t, lang } = useI18n();
const organizer = useAppSelector((state) => state.user.organiserData);
const userId =
@@ -673,8 +673,6 @@ function EventPopover({
await updateTempCalendar(tempList, newEvent, dispatch, calendarRange);
}
};
const { t } = useI18n();
const dialogActions = (
<Box display="flex" justifyContent="space-between" width="100%" px={2}>
{!showMore && (
src/locales/en.json
+1
View File
@@ -65,6 +65,7 @@
"createEvent": "Create Event",
"updateEvent": "Update Event",
"organizer": "Organizer",
"untitled": "Untitled",
"repeat": {
"repeatEvery": "Repeat every",
"frequency": {
src/locales/fr.json
+1
View File
@@ -65,6 +65,7 @@
"createEvent": "Créer un événement",
"updateEvent": "Mettre à jour un événement",
"organizer": "Organisateur",
"untitled": "Sans titre",
"repeat": {
"repeatEvery": "Répéter tous les",
"frequency": {