Bump local twake-mui lockfile to 1.1.8.

Co-authored-by: Cursor <cursoragent@cursor.com>

src/components/Event/EventFormFields.tsx

@@ -5,6 +5,7 @@ import iconCamera from "@/static/images/icon-camera.svg";
 import {
   addVideoConferenceToDescription,
   generateMeetingLink,
+  removeVideoConferenceFromDescription,
 } from "@/utils/videoConferenceUtils";
 import {
   Box,
@@ -186,10 +187,6 @@ export default function EventFormFields({
   const [hasClickedCalendarSection, setHasClickedCalendarSection] =
     React.useState(false);
 
-  // Track if user has clicked on video meeting section in normal mode
-  const [hasClickedVideoMeetingSection, setHasClickedVideoMeetingSection] =
-    React.useState(false);
-
   // Reset hasEndDateChanged and hasClickedDateTimeSection when modal closes
   React.useEffect(() => {
     if (!isOpen) {
@@ -197,7 +194,6 @@ export default function EventFormFields({
       setHasClickedDateTimeSection(false);
       setHasClickedLocationSection(false);
       setHasClickedCalendarSection(false);
-      setHasClickedVideoMeetingSection(false);
     }
   }, [isOpen]);
 
@@ -428,9 +424,6 @@ export default function EventFormFields({
     if (showMore) {
       setShowDescription(true);
     }
-    if (!showMore) {
-      setHasClickedVideoMeetingSection(true);
-    }
   };
 
   const [openToast, setOpenToast] = React.useState(false);
@@ -447,11 +440,7 @@ export default function EventFormFields({
   };
 
   const handleDeleteVideoConference = () => {
-    const updatedDescription = description.replace(
-      /\nVisio: https?:\/\/[^\s]+/,
-      ""
-    );
-    setDescription(updatedDescription);
+    setDescription(removeVideoConferenceFromDescription(description));
     setHasVideoConference(false);
     setMeetingLink(null);
   };

src/components/Event/components/ClickableField.tsx

@@ -8,6 +8,7 @@ interface ClickableFieldProps {
   onClick: () => void;
   iconColor?: string;
   children?: React.ReactNode;
+  ariaLabel?: string;
 }
 
 export const ClickableField: React.FC<ClickableFieldProps> = ({
@@ -16,12 +17,22 @@ export const ClickableField: React.FC<ClickableFieldProps> = ({
   onClick,
   iconColor,
   children,
+  ariaLabel,
 }) => {
   const theme = useTheme();
 
   return (
     <Box
       onClick={onClick}
+      role="button"
+      tabIndex={0}
+      aria-label={ariaLabel ?? text}
+      onKeyDown={(e) => {
+        if (e.key === "Enter" || e.key === " ") {
+          e.preventDefault();
+          onClick();
+        }
+      }}
       sx={{
         display: "flex",
         alignItems: children ? "flex-start" : "center",
@@ -31,6 +42,10 @@ export const ClickableField: React.FC<ClickableFieldProps> = ({
         "&:hover": {
           backgroundColor: "action.hover",
         },
+        "&:focus-visible": {
+          outline: `2px solid ${theme.palette.primary.main}`,
+          outlineOffset: "2px",
+        },
       }}
     >
       <Box

src/components/Event/utils/eventUtils.tsx

@@ -65,9 +65,7 @@ export function renderAttendeeBadge(
           <Avatar {...stringAvatar(a.cn || a.cal_address)} />
         </Badge>
         <Box style={{ display: "flex", flexDirection: "column", minWidth: 0 }}>
-          <Typography noWrap>
-            {a.cn || a.cal_address}
-          </Typography>
+          <Typography noWrap>{a.cn || a.cal_address}</Typography>
           {isOrganizer && (
             <Typography variant="caption" color="text.secondary">
               {t("event.organizer")}