feat: Update event modal UI with header icons and improved actions layout

- Add expand and close icons to ResponsiveDialog header in normal mode
- Change 'Show More' button to 'More options' with Add icon
- Hide Cancel button in normal mode, show only in extended mode
- Add showHeaderActions prop to ResponsiveDialog for UI control
- Preserve EventDisplayPreview modal with old UI (no header icons)
- Update all affected test cases to match new UI behavior

__test__/components/DuplicateEvent.test.tsx

@@ -95,6 +95,9 @@ describe("EventDuplication", () => {
 
     fireEvent.click(screen.getByText("Duplicate event"));
 
+    // Cancel button only appears in expanded mode
+    fireEvent.click(screen.getByText("More options"));
+
     fireEvent.click(screen.getByRole("button", { name: /Cancel/i }));
 
     expect(handleClose).toHaveBeenCalled();

__test__/components/RepeatEvent.test.tsx

@@ -102,8 +102,8 @@ async function setupEventPopover(
   const titleInput = screen.getByLabelText("Title");
   fireEvent.change(titleInput, { target: { value: "Meeting" } });
 
-  // Click Show More to expand the dialog
-  const showMoreButton = screen.getByText("Show More");
+  // Click More options to expand the dialog
+  const showMoreButton = screen.getByText("More options");
   fireEvent.click(showMoreButton);
 
   // Check Repeat checkbox to show repeat options

__test__/components/ResponsiveDialog.test.tsx

@@ -295,4 +295,80 @@ describe("ResponsiveDialog", () => {
     expect(screen.getByText("Extended Content")).toBeInTheDocument();
     expect(screen.getByLabelText("show less")).toBeInTheDocument();
   });
+
+  it("renders expand and close icons in normal mode when showHeaderActions is true", () => {
+    render(
+      <ResponsiveDialog
+        open={true}
+        onClose={mockOnClose}
+        title="Test"
+        isExpanded={false}
+        onExpandToggle={mockOnExpandToggle}
+        showHeaderActions={true}
+      >
+        <div>Content</div>
+      </ResponsiveDialog>
+    );
+
+    expect(screen.getByLabelText("expand")).toBeInTheDocument();
+    expect(screen.getByLabelText("close")).toBeInTheDocument();
+  });
+
+  it("does not render header icons when showHeaderActions is false", () => {
+    render(
+      <ResponsiveDialog
+        open={true}
+        onClose={mockOnClose}
+        title="Test Title"
+        isExpanded={false}
+        onExpandToggle={mockOnExpandToggle}
+        showHeaderActions={false}
+      >
+        <div>Content</div>
+      </ResponsiveDialog>
+    );
+
+    expect(screen.queryByLabelText("expand")).not.toBeInTheDocument();
+    expect(screen.queryByLabelText("close")).not.toBeInTheDocument();
+    expect(screen.getByText("Test Title")).toBeInTheDocument();
+  });
+
+  it("calls onClose when close icon is clicked", () => {
+    render(
+      <ResponsiveDialog
+        open={true}
+        onClose={mockOnClose}
+        title="Test"
+        isExpanded={false}
+        showHeaderActions={true}
+      >
+        <div>Content</div>
+      </ResponsiveDialog>
+    );
+
+    const closeButton = screen.getByLabelText("close");
+    fireEvent.click(closeButton);
+
+    expect(mockOnClose).toHaveBeenCalledTimes(1);
+  });
+
+  it("calls onExpandToggle when expand icon is clicked", () => {
+    render(
+      <ResponsiveDialog
+        open={true}
+        onClose={mockOnClose}
+        title="Test"
+        isExpanded={false}
+        onExpandToggle={mockOnExpandToggle}
+        showHeaderActions={true}
+      >
+        <div>Content</div>
+      </ResponsiveDialog>
+    );
+
+    const expandButton = screen.getByLabelText("expand");
+    fireEvent.click(expandButton);
+
+    expect(mockOnExpandToggle).toHaveBeenCalledTimes(1);
+  });
 });

__test__/features/Calendars/CalendarModal.test.tsx

@@ -325,9 +325,12 @@ describe("CalendarPopover - Tabs Scenarios", () => {
     const input = screen.getByLabelText(/CalDAV access/i);
     expect(input).toHaveValue("https://cal.example.org/calendars/user1/cal1");
 
-    // Click copy button
-    const copyButton = screen.getAllByRole("button")[0];
-    fireEvent.click(copyButton);
+    // Click copy button (find button containing ContentCopyIcon)
+    const copyIcon = screen.getByTestId("ContentCopyIcon");
+    const copyButton = copyIcon.closest("button");
+    if (copyButton) {
+      fireEvent.click(copyButton);
+    }
 
     expect(navigator.clipboard.writeText).toHaveBeenCalledWith(
       "https://cal.example.org/calendars/user1/cal1"

__test__/features/Events/EventModal.test.tsx

@@ -124,10 +124,10 @@ describe("EventPopover", () => {
     expect(calendarSelect).toBeInTheDocument();
 
     // Check button
-    expect(screen.getByText("Show More")).toBeInTheDocument();
+    expect(screen.getByText("More options")).toBeInTheDocument();
 
     // Extended mode
-    fireEvent.click(screen.getByText("Show More"));
+    fireEvent.click(screen.getByText("More options"));
 
     // Back button appears
     expect(screen.getByLabelText("show less")).toBeInTheDocument();
@@ -330,6 +330,9 @@ describe("EventPopover", () => {
   it("calls onClose when Cancel clicked", () => {
     renderPopover();
 
+    // Cancel button only appears in expanded mode
+    fireEvent.click(screen.getByText("More options"));
+
     fireEvent.click(screen.getByText("Cancel"));
 
     expect(mockOnClose).toHaveBeenCalledWith({}, "backdropClick");