diff --git a/src/components/Calendar/CalendarName.tsx b/src/components/Calendar/CalendarName.tsx index 8c81105..0fc82c8 100644 --- a/src/components/Calendar/CalendarName.tsx +++ b/src/components/Calendar/CalendarName.tsx @@ -1,23 +1,28 @@ +import { useAppSelector } from "@/app/hooks"; import { Calendar } from "@/features/Calendars/CalendarTypes"; -import { Box, Typography } from "@linagora/twake-mui"; -import SquareRoundedIcon from "@mui/icons-material/SquareRounded"; import { defaultColors } from "@/utils/defaultColors"; import { makeDisplayName } from "@/utils/makeDisplayName"; +import { renameDefault } from "@/utils/renameDefault"; +import { Box, Typography } from "@linagora/twake-mui"; +import SquareRoundedIcon from "@mui/icons-material/SquareRounded"; +import { useI18n } from "twake-i18n"; import { OwnerCaption } from "./OwnerCaption"; -import { useAppSelector } from "@/app/hooks"; export function CalendarName({ calendar }: { calendar: Calendar }) { const userData = useAppSelector((state) => state.user.userData); - const showCaption = - calendar.name !== "#default" && - userData.openpaasId !== calendar.id.split("/")[0]; + const { t } = useI18n(); + + const ownerId = calendar.id.split("/")[0]; + const ownerDisplayName = makeDisplayName(calendar) ?? ""; + const isOwnCalendar = userData.openpaasId === ownerId; + const showCaption = calendar.name !== "#default" && !isOwnCalendar; return ( @@ -30,11 +35,11 @@ export function CalendarName({ calendar }: { calendar: Calendar }) { /> - {calendar.name} + {renameDefault(calendar.name, ownerDisplayName, t, isOwnCalendar)} diff --git a/src/components/Event/EventFormFields.tsx b/src/components/Event/EventFormFields.tsx index f4f59d5..334c66e 100644 --- a/src/components/Event/EventFormFields.tsx +++ b/src/components/Event/EventFormFields.tsx @@ -4,6 +4,7 @@ import { userAttendee } from "@/features/User/models/attendee"; import iconCamera from "@/static/images/icon-camera.svg"; import { defaultColors } from "@/utils/defaultColors"; import { makeDisplayName } from "@/utils/makeDisplayName"; +import { renameDefault } from "@/utils/renameDefault"; import { addVideoConferenceToDescription, generateMeetingLink, @@ -193,6 +194,13 @@ export default function EventFormFields({ const personalCalendars = userPersonalCalendars.filter( (cal) => !cal.delegated ); + const selectedCalendar = userPersonalCalendars.find( + (cal) => cal.id === calendarid + ); + const selectedOwnerDisplayName = selectedCalendar + ? (makeDisplayName(selectedCalendar) ?? "") + : ""; + const isSelectedDelegated = !!selectedCalendar?.delegated; // Reset hasEndDateChanged and hasClickedDateTimeSection when modal closes React.useEffect(() => { @@ -786,29 +794,21 @@ export default function EventFormFields({ } onClick={() => setHasClickedCalendarSection(true)} > - {userPersonalCalendars.find((cal) => cal.id === calendarid) - ?.name ? ( + {selectedCalendar?.name ? ( - { - userPersonalCalendars.find((cal) => cal.id === calendarid) - ?.name - } + {renameDefault( + selectedCalendar.name, + selectedOwnerDisplayName, + t, + !isSelectedDelegated + )} cal.id === calendarid) !== - undefined && - userPersonalCalendars.find((cal) => cal.id === calendarid) - ?.name !== "#default" - } - ownerDisplayName={ - makeDisplayName( - userPersonalCalendars.find( - (cal) => cal.id === calendarid - ) ?? ({} as Calendar) - ) ?? "" + isSelectedDelegated && selectedCalendar.name !== "#default" } + ownerDisplayName={selectedOwnerDisplayName} /> ) : ( diff --git a/src/features/Events/EventDisplayPreview.tsx b/src/features/Events/EventDisplayPreview.tsx index f18be04..3461fdb 100644 --- a/src/features/Events/EventDisplayPreview.tsx +++ b/src/features/Events/EventDisplayPreview.tsx @@ -24,7 +24,6 @@ import { Typography, useTheme, } from "@linagora/twake-mui"; -import CalendarTodayIcon from "@mui/icons-material/CalendarToday"; import CircleIcon from "@mui/icons-material/Circle"; import CloseIcon from "@mui/icons-material/Close"; import EditIcon from "@mui/icons-material/Edit"; @@ -728,9 +727,6 @@ export default function EventPreviewModal({ mb: 2, }} > - - -