feat: add calendar drag-and-drop rescheduling and iCalendar import

- Drag events in week/day views to reschedule (15-min snap intervals)
- Drag events in month view to change date (preserves time)
- Visual snap indicators with time labels during drag
- iCalendar (.ics) file import via JMAP CalendarEvent/parse
- Import modal with file upload, event preview, calendar selector
- File validation (5MB max), bulk import with progress tracking

README.md

@@ -65,6 +65,8 @@ This webmail client is designed to work seamlessly with [**Stalwart Mail Server*
 - Mini-calendar sidebar with calendar visibility toggles
 - Locale-aware date formatting (respects user's language)
 - Settings for first day of week, time format (12h/24h), and default view
+- Drag-and-drop rescheduling (week/day time snap, month date move)
+- iCalendar (.ics) file import with event preview and bulk create
 - Real-time updates via JMAP push notifications
 - Keyboard shortcuts: m/w/d/a (views), t (today), n (new event), arrows (navigate)
 

ROADMAP.md

@@ -141,6 +141,8 @@ This document tracks the development status and planned features for JMAP Webmai
 - [x] Mobile touch targets (44px minimum)
 - [x] Calendar keyboard shortcuts (m/w/d/a views, t today, n new event)
 - [x] i18n support with ICU pluralization (all 8 languages)
+- [x] Drag-and-drop event rescheduling (week/day time snap, month date move)
+- [x] iCalendar (.ics) file import via CalendarEvent/parse with preview and bulk create
 
 ### Email Display
 - [x] Proper email layout without horizontal scroll or clipping
@@ -170,11 +172,10 @@ This document tracks the development status and planned features for JMAP Webmai
 
 ### Advanced Features
 - [ ] Email filters and rules
-- [ ] Calendar event drag-and-drop rescheduling
 - [ ] Participant scheduling with iTIP invitations
 - [ ] Free/busy queries (Principal/getAvailability)
-- [ ] iCalendar import via CalendarEvent/parse
 - [ ] Calendar sharing UI (JMAP Sharing RFC 9670)
+- [ ] Calendar event notifications display
 - [ ] Email templates
 - [ ] Email encryption (PGP/GPG)
 - [ ] OAuth2/OIDC authentication (opt-in, Basic Auth remains default)

app/[locale]/calendar/page.tsx

@@ -21,6 +21,7 @@ import { CalendarAgendaView } from "@/components/calendar/calendar-agenda-view";
 import { MiniCalendar } from "@/components/calendar/mini-calendar";
 import { CalendarSidebarPanel } from "@/components/calendar/calendar-sidebar-panel";
 import { EventModal } from "@/components/calendar/event-modal";
+import { ICalImportModal } from "@/components/calendar/ical-import-modal";
 import type { CalendarEvent } from "@/lib/jmap/types";
 
 export default function CalendarPage() {
@@ -37,6 +38,7 @@ export default function CalendarPage() {
   const { firstDayOfWeek, timeFormat } = useSettingsStore();
 
   const [showEventModal, setShowEventModal] = useState(false);
+  const [showImportModal, setShowImportModal] = useState(false);
   const [editEvent, setEditEvent] = useState<CalendarEvent | null>(null);
   const [defaultModalDate, setDefaultModalDate] = useState<Date | undefined>();
   const [miniMonth, setMiniMonth] = useState(new Date());
@@ -295,6 +297,7 @@ export default function CalendarPage() {
         onToday={goToToday}
         onViewModeChange={setViewMode}
         onCreateEvent={() => openCreateModal()}
+        onImport={() => setShowImportModal(true)}
         isMobile={isMobile}
       />
 
@@ -330,6 +333,14 @@ export default function CalendarPage() {
           onClose={() => { setShowEventModal(false); setEditEvent(null); }}
         />
       )}
+
+      {showImportModal && client && (
+        <ICalImportModal
+          calendars={calendars}
+          client={client}
+          onClose={() => setShowImportModal(false)}
+        />
+      )}
     </div>
   );
 }

components/calendar/calendar-day-view.tsx

@@ -1,11 +1,14 @@
 "use client";
 
-import { useMemo, useEffect, useRef, useState } from "react";
+import { useMemo, useEffect, useRef, useState, useCallback, type DragEvent } from "react";
 import { useTranslations, useFormatter } from "next-intl";
 import { format, isToday, parseISO } from "date-fns";
 import { cn } from "@/lib/utils";
 import { EventCard, parseDuration } from "./event-card";
 import type { CalendarEvent, Calendar } from "@/lib/jmap/types";
+import { useAuthStore } from "@/stores/auth-store";
+import { useCalendarStore } from "@/stores/calendar-store";
+import { toast } from "@/stores/toast-store";
 
 interface CalendarDayViewProps {
   selectedDate: Date;
@@ -132,6 +135,57 @@ export function CalendarDayView({
 
   const layouted = useMemo(() => layoutOverlappingEvents(timedEvents), [timedEvents]);
 
+  const [dropMinutes, setDropMinutes] = useState<number | null>(null);
+
+  const snapMinutes = useCallback((e: DragEvent<HTMLDivElement>): number => {
+    const rect = e.currentTarget.getBoundingClientRect();
+    const y = e.clientY - rect.top;
+    const raw = (y / HOUR_HEIGHT) * 60;
+    return Math.max(0, Math.min(1425, Math.round(raw / 15) * 15));
+  }, []);
+
+  const formatSnapTime = useCallback((minutes: number): string => {
+    const h = Math.floor(minutes / 60);
+    const m = minutes % 60;
+    if (timeFormat === "12h") {
+      return `${h % 12 || 12}:${String(m).padStart(2, "0")} ${h < 12 ? "AM" : "PM"}`;
+    }
+    return `${String(h).padStart(2, "0")}:${String(m).padStart(2, "0")}`;
+  }, [timeFormat]);
+
+  const handleDayDragOver = useCallback((e: DragEvent<HTMLDivElement>) => {
+    if (!e.dataTransfer.types.includes("application/x-calendar-event")) return;
+    e.preventDefault();
+    e.dataTransfer.dropEffect = "move";
+    const minutes = snapMinutes(e);
+    setDropMinutes((prev) => prev === minutes ? prev : minutes);
+  }, [snapMinutes]);
+
+  const handleDayDragLeave = useCallback((e: DragEvent<HTMLDivElement>) => {
+    const related = e.relatedTarget as Node | null;
+    if (!e.currentTarget.contains(related)) setDropMinutes(null);
+  }, []);
+
+  const handleDayDrop = useCallback(async (e: DragEvent<HTMLDivElement>) => {
+    e.preventDefault();
+    setDropMinutes(null);
+    const json = e.dataTransfer.getData("application/x-calendar-event");
+    if (!json) return;
+    try {
+      const data = JSON.parse(json);
+      const minutes = snapMinutes(e);
+      const newStart = new Date(selectedDate);
+      newStart.setHours(Math.floor(minutes / 60), minutes % 60, 0, 0);
+      const newStartISO = format(newStart, "yyyy-MM-dd'T'HH:mm:ss");
+      if (newStartISO === data.originalStart) return;
+      const client = useAuthStore.getState().client;
+      if (!client) return;
+      await useCalendarStore.getState().updateEvent(client, data.eventId, { start: newStartISO });
+    } catch {
+      toast.error(t("notifications.event_move_error"));
+    }
+  }, [snapMinutes, selectedDate, t]);
+
   return (
     <div className="flex flex-col flex-1 overflow-hidden" role="grid" aria-label={intlFormatter.dateTime(selectedDate, { weekday: "long", month: "long", day: "numeric", year: "numeric" })}>
       <div className="px-4 py-3 border-b border-border">
@@ -174,7 +228,14 @@ export function CalendarDayView({
             ))}
           </div>
 
-          <div className="flex-1 relative border-l border-border" role="row">
+          <div
+            className="flex-1 relative border-l border-border"
+            role="row"
+            aria-label={t("views.day")}
+            onDragOver={handleDayDragOver}
+            onDragLeave={handleDayDragLeave}
+            onDrop={handleDayDrop}
+          >
             {HOURS.map((h) => (
               <div
                 key={h}
@@ -211,6 +272,7 @@ export function CalendarDayView({
                     calendar={calendarMap.get(calId)}
                     variant="block"
                     onClick={() => onSelectEvent(ev)}
+                    draggable
                   />
                 </div>
               );
@@ -227,6 +289,21 @@ export function CalendarDayView({
                 </div>
               </div>
             )}
+
+            {dropMinutes !== null && (
+              <div
+                className="absolute left-0 right-0 z-30 pointer-events-none"
+                style={{ top: (dropMinutes / 60) * HOUR_HEIGHT }}
+              >
+                <div className="flex items-center">
+                  <div className="w-2.5 h-2.5 rounded-full bg-primary -ml-1" />
+                  <div className="flex-1 h-0.5 bg-primary rounded-full" />
+                </div>
+                <div className="absolute -top-4 left-2 text-[10px] font-medium text-primary bg-background/90 px-1 rounded shadow-sm">
+                  {formatSnapTime(dropMinutes)}
+                </div>
+              </div>
+            )}
           </div>
         </div>
       </div>

components/calendar/calendar-month-view.tsx

@@ -1,14 +1,17 @@
 "use client";
 
-import { useMemo } from "react";
+import { useMemo, useState, useCallback, type DragEvent } from "react";
 import { useTranslations, useFormatter } from "next-intl";
 import {
   startOfMonth, endOfMonth, startOfWeek, endOfWeek,
-  eachDayOfInterval, isSameDay, isSameMonth, isToday, format,
+  eachDayOfInterval, isSameDay, isSameMonth, isToday, format, parseISO,
 } from "date-fns";
 import { cn } from "@/lib/utils";
 import { EventCard } from "./event-card";
 import type { CalendarEvent, Calendar } from "@/lib/jmap/types";
+import { useAuthStore } from "@/stores/auth-store";
+import { useCalendarStore } from "@/stores/calendar-store";
+import { toast } from "@/stores/toast-store";
 
 interface CalendarMonthViewProps {
   selectedDate: Date;
@@ -92,6 +95,40 @@ export function CalendarMonthView({
     return result;
   }, [days]);
 
+  const [dropDayKey, setDropDayKey] = useState<string | null>(null);
+
+  const handleCellDragOver = useCallback((e: DragEvent<HTMLDivElement>, dayKey: string) => {
+    if (!e.dataTransfer.types.includes("application/x-calendar-event")) return;
+    e.preventDefault();
+    e.dataTransfer.dropEffect = "move";
+    setDropDayKey((prev) => prev === dayKey ? prev : dayKey);
+  }, []);
+
+  const handleCellDragLeave = useCallback((e: DragEvent<HTMLDivElement>) => {
+    const related = e.relatedTarget as Node | null;
+    if (!e.currentTarget.contains(related)) setDropDayKey(null);
+  }, []);
+
+  const handleCellDrop = useCallback(async (e: DragEvent<HTMLDivElement>, day: Date) => {
+    e.preventDefault();
+    setDropDayKey(null);
+    const json = e.dataTransfer.getData("application/x-calendar-event");
+    if (!json) return;
+    try {
+      const data = JSON.parse(json);
+      const originalStart = parseISO(data.originalStart);
+      const newStart = new Date(day);
+      newStart.setHours(originalStart.getHours(), originalStart.getMinutes(), originalStart.getSeconds(), 0);
+      const newStartISO = format(newStart, "yyyy-MM-dd'T'HH:mm:ss");
+      if (newStartISO === data.originalStart) return;
+      const client = useAuthStore.getState().client;
+      if (!client) return;
+      await useCalendarStore.getState().updateEvent(client, data.eventId, { start: newStartISO });
+    } catch {
+      toast.error(t("notifications.event_move_error"));
+    }
+  }, [t]);
+
   return (
     <div className="flex flex-col flex-1 overflow-hidden" role="grid" aria-label={intlFormatter.dateTime(selectedDate, { month: "long", year: "numeric" })}>
       <div className="grid grid-cols-7 border-b border-border" role="row">
@@ -121,10 +158,14 @@ export function CalendarMonthView({
                   aria-selected={selected}
                   aria-label={fullDateLabel}
                   onClick={() => onSelectDate(day)}
+                  onDragOver={(e) => handleCellDragOver(e, key)}
+                  onDragLeave={handleCellDragLeave}
+                  onDrop={(e) => handleCellDrop(e, day)}
                   className={cn(
                     "border-r border-border last:border-r-0 p-1 cursor-pointer transition-colors",
                     !inMonth && "bg-muted/30",
-                    "hover:bg-muted/50"
+                    "hover:bg-muted/50",
+                    dropDayKey === key && "ring-2 ring-inset ring-primary bg-primary/10"
                   )}
                 >
                   <div className="flex items-center justify-center mb-0.5">
@@ -150,6 +191,7 @@ export function CalendarMonthView({
                           calendar={calendarMap.get(calId)}
                           variant="chip"
                           onClick={() => onSelectEvent(ev)}
+                          draggable
                         />
                       );
                     })}

components/calendar/calendar-toolbar.tsx

@@ -2,7 +2,7 @@
 
 import { useTranslations, useFormatter } from "next-intl";
 import { Button } from "@/components/ui/button";
-import { ArrowLeft, ChevronLeft, ChevronRight, Plus } from "lucide-react";
+import { ArrowLeft, ChevronLeft, ChevronRight, Plus, Upload } from "lucide-react";
 import { addDays, startOfWeek } from "date-fns";
 import { cn } from "@/lib/utils";
 import type { CalendarViewMode } from "@/stores/calendar-store";
@@ -16,6 +16,7 @@ interface CalendarToolbarProps {
   onToday: () => void;
   onViewModeChange: (mode: CalendarViewMode) => void;
   onCreateEvent: () => void;
+  onImport?: () => void;
   isMobile?: boolean;
   firstDayOfWeek?: number;
 }
@@ -29,6 +30,7 @@ export function CalendarToolbar({
   onToday,
   onViewModeChange,
   onCreateEvent,
+  onImport,
   isMobile,
   firstDayOfWeek = 1,
 }: CalendarToolbarProps) {
@@ -100,6 +102,13 @@ export function CalendarToolbar({
         </div>
       )}
 
+      {onImport && (
+        <Button variant="outline" size="sm" onClick={onImport}>
+          <Upload className="w-4 h-4 mr-1" />
+          {!isMobile && t("import.title")}
+        </Button>
+      )}
+
       <Button size="sm" onClick={onCreateEvent}>
         <Plus className="w-4 h-4 mr-1" />
         {!isMobile && t("events.create")}

components/calendar/calendar-week-view.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import { useMemo, useEffect, useRef, useState } from "react";
+import { useMemo, useEffect, useRef, useState, useCallback, type DragEvent } from "react";
 import { useTranslations, useFormatter } from "next-intl";
 import {
   startOfWeek, addDays, format, isSameDay, isToday, parseISO,
@@ -8,6 +8,9 @@ import {
 import { cn } from "@/lib/utils";
 import { EventCard, parseDuration } from "./event-card";
 import type { CalendarEvent, Calendar } from "@/lib/jmap/types";
+import { useAuthStore } from "@/stores/auth-store";
+import { useCalendarStore } from "@/stores/calendar-store";
+import { toast } from "@/stores/toast-store";
 
 interface CalendarWeekViewProps {
   selectedDate: Date;
@@ -164,6 +167,59 @@ export function CalendarWeekView({
     return format(new Date(2000, 0, 1, h), "HH:mm");
   };
 
+  const [dropTarget, setDropTarget] = useState<{ dayKey: string; minutes: number } | null>(null);
+
+  const snapMinutes = useCallback((e: DragEvent<HTMLDivElement>): number => {
+    const rect = e.currentTarget.getBoundingClientRect();
+    const y = e.clientY - rect.top;
+    const raw = (y / HOUR_HEIGHT) * 60;
+    return Math.max(0, Math.min(1425, Math.round(raw / 15) * 15));
+  }, []);
+
+  const formatSnapTime = useCallback((minutes: number): string => {
+    const h = Math.floor(minutes / 60);
+    const m = minutes % 60;
+    if (timeFormat === "12h") {
+      return `${h % 12 || 12}:${String(m).padStart(2, "0")} ${h < 12 ? "AM" : "PM"}`;
+    }
+    return `${String(h).padStart(2, "0")}:${String(m).padStart(2, "0")}`;
+  }, [timeFormat]);
+
+  const handleColumnDragOver = useCallback((e: DragEvent<HTMLDivElement>, dayKey: string) => {
+    if (!e.dataTransfer.types.includes("application/x-calendar-event")) return;
+    e.preventDefault();
+    e.dataTransfer.dropEffect = "move";
+    const minutes = snapMinutes(e);
+    setDropTarget((prev) =>
+      prev?.dayKey === dayKey && prev?.minutes === minutes ? prev : { dayKey, minutes }
+    );
+  }, [snapMinutes]);
+
+  const handleColumnDragLeave = useCallback((e: DragEvent<HTMLDivElement>) => {
+    const related = e.relatedTarget as Node | null;
+    if (!e.currentTarget.contains(related)) setDropTarget(null);
+  }, []);
+
+  const handleColumnDrop = useCallback(async (e: DragEvent<HTMLDivElement>, day: Date) => {
+    e.preventDefault();
+    setDropTarget(null);
+    const json = e.dataTransfer.getData("application/x-calendar-event");
+    if (!json) return;
+    try {
+      const data = JSON.parse(json);
+      const minutes = snapMinutes(e);
+      const newStart = new Date(day);
+      newStart.setHours(Math.floor(minutes / 60), minutes % 60, 0, 0);
+      const newStartISO = format(newStart, "yyyy-MM-dd'T'HH:mm:ss");
+      if (newStartISO === data.originalStart) return;
+      const client = useAuthStore.getState().client;
+      if (!client) return;
+      await useCalendarStore.getState().updateEvent(client, data.eventId, { start: newStartISO });
+    } catch {
+      toast.error(t("notifications.event_move_error"));
+    }
+  }, [snapMinutes, t]);
+
   return (
     <div className="flex flex-col flex-1 overflow-hidden" role="grid" aria-label={t("views.week")}>
       {hasAllDay && (
@@ -253,7 +309,15 @@ export function CalendarWeekView({
               const layouted = layoutOverlappingEvents(dayEvents);
 
               return (
-                <div key={key} className="relative border-r border-border last:border-r-0" role="row">
+                <div
+                  key={key}
+                  className="relative border-r border-border last:border-r-0"
+                  role="row"
+                  aria-label={intlFormatter.dateTime(day, { weekday: "long", month: "long", day: "numeric" })}
+                  onDragOver={(e) => handleColumnDragOver(e, key)}
+                  onDragLeave={handleColumnDragLeave}
+                  onDrop={(e) => handleColumnDrop(e, day)}
+                >
                   {HOURS.map((h) => (
                     <div
                       key={h}
@@ -286,6 +350,7 @@ export function CalendarWeekView({
                           calendar={calendarMap.get(calId)}
                           variant="block"
                           onClick={() => onSelectEvent(ev)}
+                          draggable
                         />
                       </div>
                     );
@@ -302,6 +367,21 @@ export function CalendarWeekView({
                       </div>
                     </div>
                   )}
+
+                  {dropTarget?.dayKey === key && (
+                    <div
+                      className="absolute left-0 right-0 z-30 pointer-events-none"
+                      style={{ top: (dropTarget.minutes / 60) * HOUR_HEIGHT }}
+                    >
+                      <div className="flex items-center">
+                        <div className="w-2 h-2 rounded-full bg-primary -ml-1" />
+                        <div className="flex-1 h-0.5 bg-primary rounded-full" />
+                      </div>
+                      <div className="absolute -top-4 left-2 text-[10px] font-medium text-primary bg-background/90 px-1 rounded shadow-sm">
+                        {formatSnapTime(dropTarget.minutes)}
+                      </div>
+                    </div>
+                  )}
                 </div>
               );
             })}

components/calendar/event-card.tsx

@@ -1,5 +1,6 @@
 "use client";
 
+import { useCallback, useState, type DragEvent } from "react";
 import { useTranslations } from "next-intl";
 import { cn } from "@/lib/utils";
 import type { CalendarEvent, Calendar } from "@/lib/jmap/types";
@@ -11,6 +12,7 @@ interface EventCardProps {
   variant: "chip" | "block";
   onClick?: () => void;
   isSelected?: boolean;
+  draggable?: boolean;
 }
 
 function sanitizeColor(color: string | null | undefined, fallback = "#3b82f6"): string {
@@ -37,8 +39,24 @@ function parseDuration(duration: string): number {
   return totalMinutes;
 }
 
-export function EventCard({ event, calendar, variant, onClick, isSelected }: EventCardProps) {
+function createEventDragPreview(title: string, color: string): HTMLElement {
+  const el = document.createElement("div");
+  el.style.cssText = `
+    position: fixed; top: -9999px; left: 0;
+    padding: 6px 12px; border-radius: 6px;
+    background: ${color}40; border-left: 3px solid ${color};
+    color: ${color}; font-size: 12px; font-weight: 500;
+    max-width: 200px; white-space: nowrap; overflow: hidden;
+    text-overflow: ellipsis; pointer-events: none; z-index: 9999;
+  `;
+  el.textContent = title;
+  document.body.appendChild(el);
+  return el;
+}
+
+export function EventCard({ event, calendar, variant, onClick, isSelected, draggable: isDraggable }: EventCardProps) {
   const t = useTranslations("calendar");
+  const [isBeingDragged, setIsBeingDragged] = useState(false);
   const color = getEventColor(event, calendar);
   const startDate = parseISO(event.start);
 
@@ -48,16 +66,47 @@ export function EventCard({ event, calendar, variant, onClick, isSelected }: Eve
   const timeString = `${format(startDate, "HH:mm")} – ${format(endTime, "HH:mm")}`;
   const ariaLabel = `${event.title || t("events.no_title")}, ${timeString}${calendarName ? `, ${calendarName}` : ""}`;
 
+  const handleDragStart = useCallback((e: DragEvent) => {
+    e.stopPropagation();
+    e.dataTransfer.effectAllowed = "move";
+    e.dataTransfer.setData("application/x-calendar-event", JSON.stringify({
+      type: "calendar-event",
+      eventId: event.id,
+      originalStart: event.start,
+      duration: event.duration,
+      durationMinutes,
+    }));
+    const displayTitle = event.title || t("events.no_title");
+    e.dataTransfer.setData("text/plain", displayTitle);
+    const preview = createEventDragPreview(displayTitle, color);
+    e.dataTransfer.setDragImage(preview, 0, 0);
+    requestAnimationFrame(() => preview.remove());
+    setIsBeingDragged(true);
+  }, [event, color, t, durationMinutes]);
+
+  const handleDragEnd = useCallback(() => {
+    setIsBeingDragged(false);
+  }, []);
+
+  const dragProps = isDraggable ? {
+    draggable: true as const,
+    onDragStart: handleDragStart,
+    onDragEnd: handleDragEnd,
+    "aria-roledescription": "draggable event",
+  } : {};
+
   if (variant === "chip") {
     return (
       <button
         onClick={(e) => { e.stopPropagation(); onClick?.(); }}
         aria-label={ariaLabel}
+        {...dragProps}
         className={cn(
           "flex items-center gap-1 w-full text-left text-xs px-1 py-0.5 rounded truncate",
           "min-h-[44px] sm:min-h-0",
           "hover:opacity-80 transition-opacity",
-          isSelected && "ring-2 ring-primary"
+          isSelected && "ring-2 ring-primary",
+          isBeingDragged && "opacity-50"
         )}
         style={{ backgroundColor: `${color}20`, color }}
       >
@@ -74,10 +123,12 @@ export function EventCard({ event, calendar, variant, onClick, isSelected }: Eve
     <button
       onClick={(e) => { e.stopPropagation(); onClick?.(); }}
       aria-label={ariaLabel}
+      {...dragProps}
       className={cn(
         "w-full text-left rounded px-1.5 py-0.5 text-xs overflow-hidden",
         "hover:opacity-90 transition-opacity cursor-pointer",
-        isSelected && "ring-2 ring-primary"
+        isSelected && "ring-2 ring-primary",
+        isBeingDragged && "opacity-50"
       )}
       style={{ backgroundColor: `${color}30`, borderLeft: `3px solid ${color}`, color }}
     >

components/calendar/ical-import-modal.tsx

@@ -0,0 +1,339 @@
+"use client";
+
+import { useState, useCallback, useRef, useEffect } from "react";
+import { useTranslations } from "next-intl";
+import { Button } from "@/components/ui/button";
+import { X, Upload, Check, Loader2, RefreshCw } from "lucide-react";
+import { format, parseISO } from "date-fns";
+import type { CalendarEvent, Calendar } from "@/lib/jmap/types";
+import type { JMAPClient } from "@/lib/jmap/client";
+import { useCalendarStore } from "@/stores/calendar-store";
+import { toast } from "@/stores/toast-store";
+
+interface ICalImportModalProps {
+  calendars: Calendar[];
+  client: JMAPClient;
+  onClose: () => void;
+}
+
+const MAX_FILE_SIZE = 5 * 1024 * 1024; // 5MB
+const ACCEPTED_EXTENSIONS = [".ics", ".ical"];
+
+type ImportStep = "select" | "preview" | "importing";
+
+export function ICalImportModal({ calendars, client, onClose }: ICalImportModalProps) {
+  const t = useTranslations("calendar.import");
+  const tCal = useTranslations("calendar");
+  const tCommon = useTranslations("common");
+  const tForm = useTranslations("calendar.form");
+  const importEvents = useCalendarStore((s) => s.importEvents);
+
+  const [step, setStep] = useState<ImportStep>("select");
+  const [parsedEvents, setParsedEvents] = useState<Partial<CalendarEvent>[]>([]);
+  const [selectedIndices, setSelectedIndices] = useState<Set<number>>(new Set());
+  const [calendarId, setCalendarId] = useState<string>(() => {
+    const defaultCal = calendars.find((c) => c.isDefault);
+    return defaultCal?.id || calendars[0]?.id || "";
+  });
+  const [isParsing, setIsParsing] = useState(false);
+  const [isDragging, setIsDragging] = useState(false);
+  const [error, setError] = useState<string | null>(null);
+  const fileInputRef = useRef<HTMLInputElement>(null);
+  const modalRef = useRef<HTMLDivElement>(null);
+
+  const validateFile = useCallback((file: File): string | null => {
+    if (file.size > MAX_FILE_SIZE) return t("file_too_large");
+    const ext = file.name.toLowerCase().slice(file.name.lastIndexOf("."));
+    if (!ACCEPTED_EXTENSIONS.includes(ext)) return t("invalid_format");
+    return null;
+  }, [t]);
+
+  const handleFile = useCallback(async (file: File) => {
+    const validationError = validateFile(file);
+    if (validationError) {
+      setError(validationError);
+      return;
+    }
+
+    setError(null);
+    setIsParsing(true);
+    setStep("select");
+
+    try {
+      const blob = new File([file], file.name, { type: "text/calendar" });
+      const uploaded = await client.uploadBlob(blob);
+      const accountId = client.getCalendarsAccountId();
+      const events = await client.parseCalendarEvents(accountId, uploaded.blobId);
+
+      if (events.length === 0) {
+        setError(t("no_events"));
+        setIsParsing(false);
+        return;
+      }
+
+      setParsedEvents(events);
+      setSelectedIndices(new Set(events.map((_, i) => i)));
+      setStep("preview");
+    } catch {
+      setError(t("invalid_format"));
+    } finally {
+      setIsParsing(false);
+    }
+  }, [client, validateFile, t]);
+
+  const handleFileChange = useCallback((e: React.ChangeEvent<HTMLInputElement>) => {
+    const file = e.target.files?.[0];
+    if (file) handleFile(file);
+  }, [handleFile]);
+
+  const handleDragOver = useCallback((e: React.DragEvent) => {
+    e.preventDefault();
+    setIsDragging(true);
+  }, []);
+
+  const handleDragLeave = useCallback((e: React.DragEvent) => {
+    e.preventDefault();
+    setIsDragging(false);
+  }, []);
+
+  const handleDrop = useCallback((e: React.DragEvent) => {
+    e.preventDefault();
+    setIsDragging(false);
+    const file = e.dataTransfer.files[0];
+    if (file) handleFile(file);
+  }, [handleFile]);
+
+  const toggleEvent = useCallback((index: number) => {
+    setSelectedIndices((prev) => {
+      const next = new Set(prev);
+      if (next.has(index)) next.delete(index);
+      else next.add(index);
+      return next;
+    });
+  }, []);
+
+  const toggleAll = useCallback(() => {
+    if (selectedIndices.size === parsedEvents.length) {
+      setSelectedIndices(new Set());
+    } else {
+      setSelectedIndices(new Set(parsedEvents.map((_, i) => i)));
+    }
+  }, [selectedIndices.size, parsedEvents]);
+
+  const handleImport = useCallback(async () => {
+    const eventsToImport = parsedEvents.filter((_, i) => selectedIndices.has(i));
+    if (eventsToImport.length === 0) return;
+
+    setStep("importing");
+    try {
+      const count = await importEvents(client, eventsToImport, calendarId);
+      toast.success(t("success", { count }));
+      onClose();
+    } catch {
+      toast.error(t("error"));
+      setStep("preview");
+    }
+  }, [parsedEvents, selectedIndices, importEvents, client, calendarId, t, onClose]);
+
+  const formatEventDate = (event: Partial<CalendarEvent>): string => {
+    if (!event.start) return "";
+    try {
+      const date = parseISO(event.start);
+      return event.showWithoutTime
+        ? format(date, "MMM d, yyyy")
+        : format(date, "MMM d, yyyy HH:mm");
+    } catch {
+      return event.start;
+    }
+  };
+
+  useEffect(() => {
+    const handleKey = (e: KeyboardEvent) => {
+      if (e.key === "Escape") onClose();
+    };
+    window.addEventListener("keydown", handleKey);
+    return () => window.removeEventListener("keydown", handleKey);
+  }, [onClose]);
+
+  useEffect(() => {
+    const modal = modalRef.current;
+    if (!modal) return;
+    const focusableEls = modal.querySelectorAll<HTMLElement>(
+      'input, select, textarea, button, [tabindex]:not([tabindex="-1"])'
+    );
+    const firstEl = focusableEls[0];
+    const lastEl = focusableEls[focusableEls.length - 1];
+
+    const handler = (e: KeyboardEvent) => {
+      if (e.key !== "Tab") return;
+      if (e.shiftKey && document.activeElement === firstEl) {
+        e.preventDefault();
+        lastEl?.focus();
+      } else if (!e.shiftKey && document.activeElement === lastEl) {
+        e.preventDefault();
+        firstEl?.focus();
+      }
+    };
+    modal.addEventListener("keydown", handler);
+    firstEl?.focus();
+    return () => modal.removeEventListener("keydown", handler);
+  }, [step]);
+
+  return (
+    <div className="fixed inset-0 z-50 flex items-center justify-center">
+      <div className="absolute inset-0 bg-black/50" onClick={onClose} aria-hidden="true" />
+      <div
+        ref={modalRef}
+        role="dialog"
+        aria-modal="true"
+        aria-label={t("title")}
+        className="relative bg-background border border-border rounded-lg shadow-xl w-full max-w-lg mx-4 max-h-[90vh] overflow-y-auto"
+      >
+        <div className="flex items-center justify-between px-5 py-4 border-b border-border">
+          <h2 className="text-lg font-semibold">{t("title")}</h2>
+          <button
+            onClick={onClose}
+            className="p-1 rounded hover:bg-muted transition-colors"
+            aria-label={tCommon("close")}
+          >
+            <X className="w-5 h-5" />
+          </button>
+        </div>
+
+        <div className="px-5 py-4 space-y-4">
+          {step === "select" && !isParsing && (
+            <div
+              onClick={() => fileInputRef.current?.click()}
+              onDragOver={handleDragOver}
+              onDragLeave={handleDragLeave}
+              onDrop={handleDrop}
+              className={`flex flex-col items-center justify-center border-2 border-dashed rounded-lg p-8 cursor-pointer transition-colors ${
+                isDragging
+                  ? "border-primary bg-primary/5"
+                  : "border-border hover:border-primary/50 hover:bg-muted/50"
+              }`}
+            >
+              <Upload className="w-8 h-8 text-muted-foreground mb-3" />
+              <p className="text-sm font-medium">{t("select_file")}</p>
+              <p className="text-xs text-muted-foreground mt-1">{t("drop_file")}</p>
+              <p className="text-xs text-muted-foreground mt-2">{t("supported_formats")}</p>
+              <input
+                ref={fileInputRef}
+                type="file"
+                accept=".ics,.ical"
+                onChange={handleFileChange}
+                className="hidden"
+              />
+            </div>
+          )}
+
+          {isParsing && (
+            <div className="flex flex-col items-center justify-center py-8">
+              <Loader2 className="w-6 h-6 animate-spin text-primary mb-3" />
+              <p className="text-sm text-muted-foreground">{t("parsing")}</p>
+            </div>
+          )}
+
+          {error && (
+            <div className="text-sm text-red-600 dark:text-red-400 bg-red-50 dark:bg-red-950/30 rounded-md px-3 py-2">
+              {error}
+            </div>
+          )}
+
+          {step === "preview" && parsedEvents.length > 0 && (
+            <>
+              <div className="flex items-center justify-between">
+                <p className="text-sm text-muted-foreground">
+                  {t("parsed_events", { count: parsedEvents.length })}
+                </p>
+                <button
+                  onClick={toggleAll}
+                  className="text-xs text-primary hover:underline"
+                >
+                  {selectedIndices.size === parsedEvents.length
+                    ? t("deselect_all")
+                    : t("select_all")}
+                </button>
+              </div>
+
+              <div className="max-h-[300px] overflow-y-auto border border-border rounded-md divide-y divide-border">
+                {parsedEvents.map((event, index) => (
+                  <label
+                    key={index}
+                    className="flex items-start gap-3 px-3 py-2.5 hover:bg-muted/50 cursor-pointer"
+                  >
+                    <input
+                      type="checkbox"
+                      checked={selectedIndices.has(index)}
+                      onChange={() => toggleEvent(index)}
+                      className="mt-0.5 rounded border-input"
+                    />
+                    <div className="flex-1 min-w-0">
+                      <p className="text-sm font-medium truncate">
+                        {event.title || tCal("events.no_title")}
+                      </p>
+                      <div className="flex items-center gap-2 mt-0.5">
+                        <span className="text-xs text-muted-foreground">
+                          {formatEventDate(event)}
+                        </span>
+                        {event.recurrenceRules && event.recurrenceRules.length > 0 && (
+                          <span className="inline-flex items-center gap-0.5 text-xs text-muted-foreground bg-muted px-1.5 py-0.5 rounded">
+                            <RefreshCw className="w-3 h-3" />
+                            {event.recurrenceRules[0].frequency}
+                          </span>
+                        )}
+                      </div>
+                    </div>
+                  </label>
+                ))}
+              </div>
+
+              {calendars.length > 1 && (
+                <div>
+                  <label className="text-sm font-medium mb-1 block">
+                    {t("target_calendar")}
+                  </label>
+                  <select
+                    value={calendarId}
+                    onChange={(e) => setCalendarId(e.target.value)}
+                    className="w-full rounded-md border border-input bg-background px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-ring"
+                  >
+                    {calendars.map((cal) => (
+                      <option key={cal.id} value={cal.id}>
+                        {cal.name}
+                      </option>
+                    ))}
+                  </select>
+                </div>
+              )}
+            </>
+          )}
+
+          {step === "importing" && (
+            <div className="flex flex-col items-center justify-center py-8">
+              <Loader2 className="w-6 h-6 animate-spin text-primary mb-3" />
+              <p className="text-sm text-muted-foreground">{t("importing")}</p>
+            </div>
+          )}
+        </div>
+
+        {step !== "importing" && (
+          <div className="flex items-center justify-end gap-2 px-5 py-4 border-t border-border">
+            <Button variant="outline" onClick={onClose}>
+              {tForm("cancel")}
+            </Button>
+            {step === "preview" && (
+              <Button
+                onClick={handleImport}
+                disabled={selectedIndices.size === 0}
+              >
+                <Check className="w-4 h-4 mr-1" />
+                {t("import_button")} ({selectedIndices.size})
+              </Button>
+            )}
+          </div>
+        )}
+      </div>
+    </div>
+  );
+}

lib/jmap/client.ts

@@ -2059,6 +2059,36 @@ export class JMAPClient {
     throw new Error("Failed to update calendar event");
   }
 
+  async parseCalendarEvents(accountId: string, blobId: string): Promise<Partial<CalendarEvent>[]> {
+    const response = await this.request([
+      ["CalendarEvent/parse", {
+        accountId,
+        blobIds: [blobId],
+      }, "0"]
+    ], this.calendarUsing());
+
+    if (response.methodResponses?.[0]?.[0] === "CalendarEvent/parse") {
+      const result = response.methodResponses[0][1];
+
+      if (result.notParsable && result.notParsable.includes(blobId)) {
+        throw new Error("Invalid calendar file format");
+      }
+
+      if (result.notFound && result.notFound.includes(blobId)) {
+        throw new Error("Uploaded file not found");
+      }
+
+      const parsed = result.parsed?.[blobId];
+      if (parsed) {
+        return Array.isArray(parsed) ? parsed : [parsed];
+      }
+
+      return [];
+    }
+
+    throw new Error("Failed to parse calendar file");
+  }
+
   async deleteCalendarEvent(eventId: string, sendSchedulingMessages?: boolean): Promise<void> {
     const accountId = this.getCalendarsAccountId();
 

locales/de/common.json

@@ -1004,14 +1004,33 @@
       "event_updated": "Termin aktualisiert",
       "event_deleted": "Termin gelöscht",
       "calendar_created": "Kalender erstellt",
-      "calendar_deleted": "Kalender gelöscht"
+      "calendar_deleted": "Kalender gelöscht",
+      "event_move_error": "Termin konnte nicht verschoben werden"
     },
     "status": {
       "loading_calendars": "Kalender werden geladen...",
       "loading_events": "Termine werden geladen..."
     },
     "nav_prev": "Zurück",
-    "nav_next": "Weiter"
+    "nav_next": "Weiter",
+    "import": {
+      "title": "Kalender importieren",
+      "select_file": ".ics-Datei auswählen",
+      "drop_file": "oder Datei hier ablegen",
+      "supported_formats": "iCalendar (.ics) Dateien werden unterstützt",
+      "parsing": "Kalenderdatei wird analysiert...",
+      "parsed_events": "{count} Termine gefunden",
+      "no_events": "Keine Termine in der Datei gefunden",
+      "select_all": "Alle auswählen",
+      "deselect_all": "Alle abwählen",
+      "target_calendar": "In Kalender importieren",
+      "import_button": "Auswahl importieren",
+      "importing": "Termine werden importiert...",
+      "success": "{count} Termine erfolgreich importiert",
+      "error": "Kalender konnte nicht importiert werden",
+      "file_too_large": "Datei überschreitet das 5-MB-Limit",
+      "invalid_format": "Ungültiges Kalenderdateiformat"
+    }
   },
   "advanced_search": {
     "title": "Erweiterte Suche",

locales/en/common.json

@@ -1004,14 +1004,33 @@
       "event_updated": "Event updated",
       "event_deleted": "Event deleted",
       "calendar_created": "Calendar created",
-      "calendar_deleted": "Calendar deleted"
+      "calendar_deleted": "Calendar deleted",
+      "event_move_error": "Failed to move event"
     },
     "status": {
       "loading_calendars": "Loading calendars...",
       "loading_events": "Loading events..."
     },
     "nav_prev": "Previous",
-    "nav_next": "Next"
+    "nav_next": "Next",
+    "import": {
+      "title": "Import Calendar",
+      "select_file": "Select .ics file",
+      "drop_file": "or drop file here",
+      "supported_formats": "Supports iCalendar (.ics) files",
+      "parsing": "Parsing calendar file...",
+      "parsed_events": "{count} events found",
+      "no_events": "No events found in file",
+      "select_all": "Select all",
+      "deselect_all": "Deselect all",
+      "target_calendar": "Import to calendar",
+      "import_button": "Import selected",
+      "importing": "Importing events...",
+      "success": "{count} events imported successfully",
+      "error": "Failed to import calendar",
+      "file_too_large": "File exceeds 5MB limit",
+      "invalid_format": "Invalid calendar file format"
+    }
   },
   "advanced_search": {
     "title": "Advanced Search",

locales/es/common.json

@@ -1004,14 +1004,33 @@
       "event_updated": "Evento actualizado",
       "event_deleted": "Evento eliminado",
       "calendar_created": "Calendario creado",
-      "calendar_deleted": "Calendario eliminado"
+      "calendar_deleted": "Calendario eliminado",
+      "event_move_error": "Error al mover el evento"
     },
     "status": {
       "loading_calendars": "Cargando calendarios...",
       "loading_events": "Cargando eventos..."
     },
     "nav_prev": "Anterior",
-    "nav_next": "Siguiente"
+    "nav_next": "Siguiente",
+    "import": {
+      "title": "Importar calendario",
+      "select_file": "Seleccionar archivo .ics",
+      "drop_file": "o arrastra el archivo aquí",
+      "supported_formats": "Archivos iCalendar (.ics) compatibles",
+      "parsing": "Analizando archivo de calendario...",
+      "parsed_events": "{count} eventos encontrados",
+      "no_events": "No se encontraron eventos en el archivo",
+      "select_all": "Seleccionar todo",
+      "deselect_all": "Deseleccionar todo",
+      "target_calendar": "Importar al calendario",
+      "import_button": "Importar selección",
+      "importing": "Importando eventos...",
+      "success": "{count} eventos importados correctamente",
+      "error": "Error al importar el calendario",
+      "file_too_large": "El archivo supera el límite de 5 MB",
+      "invalid_format": "Formato de archivo de calendario no válido"
+    }
   },
   "advanced_search": {
     "title": "Búsqueda avanzada",

locales/fr/common.json

@@ -1004,14 +1004,33 @@
       "event_updated": "Événement mis à jour",
       "event_deleted": "Événement supprimé",
       "calendar_created": "Calendrier créé",
-      "calendar_deleted": "Calendrier supprimé"
+      "calendar_deleted": "Calendrier supprimé",
+      "event_move_error": "Échec du déplacement de l'événement"
     },
     "status": {
       "loading_calendars": "Chargement des calendriers...",
       "loading_events": "Chargement des événements..."
     },
     "nav_prev": "Précédent",
-    "nav_next": "Suivant"
+    "nav_next": "Suivant",
+    "import": {
+      "title": "Importer un calendrier",
+      "select_file": "Sélectionner un fichier .ics",
+      "drop_file": "ou déposez le fichier ici",
+      "supported_formats": "Fichiers iCalendar (.ics) supportés",
+      "parsing": "Analyse du fichier en cours...",
+      "parsed_events": "{count} événements trouvés",
+      "no_events": "Aucun événement trouvé dans le fichier",
+      "select_all": "Tout sélectionner",
+      "deselect_all": "Tout désélectionner",
+      "target_calendar": "Importer dans le calendrier",
+      "import_button": "Importer la sélection",
+      "importing": "Importation en cours...",
+      "success": "{count} événements importés avec succès",
+      "error": "Échec de l'importation du calendrier",
+      "file_too_large": "Le fichier dépasse la limite de 5 Mo",
+      "invalid_format": "Format de fichier calendrier invalide"
+    }
   },
   "advanced_search": {
     "title": "Recherche avancée",

locales/it/common.json

@@ -1004,14 +1004,33 @@
       "event_updated": "Evento aggiornato",
       "event_deleted": "Evento eliminato",
       "calendar_created": "Calendario creato",
-      "calendar_deleted": "Calendario eliminato"
+      "calendar_deleted": "Calendario eliminato",
+      "event_move_error": "Spostamento dell'evento non riuscito"
     },
     "status": {
       "loading_calendars": "Caricamento calendari...",
       "loading_events": "Caricamento eventi..."
     },
     "nav_prev": "Precedente",
-    "nav_next": "Successivo"
+    "nav_next": "Successivo",
+    "import": {
+      "title": "Importa calendario",
+      "select_file": "Seleziona file .ics",
+      "drop_file": "o trascina il file qui",
+      "supported_formats": "File iCalendar (.ics) supportati",
+      "parsing": "Analisi del file in corso...",
+      "parsed_events": "{count} eventi trovati",
+      "no_events": "Nessun evento trovato nel file",
+      "select_all": "Seleziona tutto",
+      "deselect_all": "Deseleziona tutto",
+      "target_calendar": "Importa nel calendario",
+      "import_button": "Importa selezionati",
+      "importing": "Importazione eventi...",
+      "success": "{count} eventi importati con successo",
+      "error": "Importazione del calendario fallita",
+      "file_too_large": "Il file supera il limite di 5 MB",
+      "invalid_format": "Formato del file calendario non valido"
+    }
   },
   "advanced_search": {
     "title": "Ricerca avanzata",

locales/ja/common.json

@@ -1004,14 +1004,33 @@
       "event_updated": "予定を更新しました",
       "event_deleted": "予定を削除しました",
       "calendar_created": "カレンダーを作成しました",
-      "calendar_deleted": "カレンダーを削除しました"
+      "calendar_deleted": "カレンダーを削除しました",
+      "event_move_error": "イベントの移動に失敗しました"
     },
     "status": {
       "loading_calendars": "カレンダーを読み込み中...",
       "loading_events": "予定を読み込み中..."
     },
     "nav_prev": "前へ",
-    "nav_next": "次へ"
+    "nav_next": "次へ",
+    "import": {
+      "title": "カレンダーをインポート",
+      "select_file": ".icsファイルを選択",
+      "drop_file": "またはファイルをここにドロップ",
+      "supported_formats": "iCalendar (.ics) ファイルに対応",
+      "parsing": "カレンダーファイルを解析中...",
+      "parsed_events": "{count}件のイベントが見つかりました",
+      "no_events": "ファイルにイベントが見つかりません",
+      "select_all": "すべて選択",
+      "deselect_all": "すべて解除",
+      "target_calendar": "インポート先のカレンダー",
+      "import_button": "選択をインポート",
+      "importing": "イベントをインポート中...",
+      "success": "{count}件のイベントをインポートしました",
+      "error": "カレンダーのインポートに失敗しました",
+      "file_too_large": "ファイルサイズが5MBを超えています",
+      "invalid_format": "無効なカレンダーファイル形式"
+    }
   },
   "advanced_search": {
     "title": "詳細検索",

locales/nl/common.json

@@ -1004,14 +1004,33 @@
       "event_updated": "Evenement bijgewerkt",
       "event_deleted": "Evenement verwijderd",
       "calendar_created": "Agenda aangemaakt",
-      "calendar_deleted": "Agenda verwijderd"
+      "calendar_deleted": "Agenda verwijderd",
+      "event_move_error": "Evenement verplaatsen mislukt"
     },
     "status": {
       "loading_calendars": "Agenda's laden...",
       "loading_events": "Evenementen laden..."
     },
     "nav_prev": "Vorige",
-    "nav_next": "Volgende"
+    "nav_next": "Volgende",
+    "import": {
+      "title": "Agenda importeren",
+      "select_file": "Selecteer .ics-bestand",
+      "drop_file": "of sleep het bestand hierheen",
+      "supported_formats": "iCalendar (.ics) bestanden worden ondersteund",
+      "parsing": "Agendabestand wordt verwerkt...",
+      "parsed_events": "{count} evenementen gevonden",
+      "no_events": "Geen evenementen gevonden in bestand",
+      "select_all": "Alles selecteren",
+      "deselect_all": "Alles deselecteren",
+      "target_calendar": "Importeren in agenda",
+      "import_button": "Selectie importeren",
+      "importing": "Evenementen importeren...",
+      "success": "{count} evenementen succesvol geïmporteerd",
+      "error": "Agenda importeren mislukt",
+      "file_too_large": "Bestand overschrijdt de limiet van 5 MB",
+      "invalid_format": "Ongeldig agendabestandsformaat"
+    }
   },
   "advanced_search": {
     "title": "Geavanceerd zoeken",

locales/pt/common.json

@@ -1004,14 +1004,33 @@
       "event_updated": "Evento atualizado",
       "event_deleted": "Evento excluído",
       "calendar_created": "Calendário criado",
-      "calendar_deleted": "Calendário excluído"
+      "calendar_deleted": "Calendário excluído",
+      "event_move_error": "Falha ao mover o evento"
     },
     "status": {
       "loading_calendars": "Carregando calendários...",
       "loading_events": "Carregando eventos..."
     },
     "nav_prev": "Anterior",
-    "nav_next": "Próximo"
+    "nav_next": "Próximo",
+    "import": {
+      "title": "Importar calendário",
+      "select_file": "Selecionar arquivo .ics",
+      "drop_file": "ou arraste o arquivo aqui",
+      "supported_formats": "Arquivos iCalendar (.ics) suportados",
+      "parsing": "Analisando arquivo de calendário...",
+      "parsed_events": "{count} eventos encontrados",
+      "no_events": "Nenhum evento encontrado no arquivo",
+      "select_all": "Selecionar tudo",
+      "deselect_all": "Desmarcar tudo",
+      "target_calendar": "Importar para o calendário",
+      "import_button": "Importar selecionados",
+      "importing": "Importando eventos...",
+      "success": "{count} eventos importados com sucesso",
+      "error": "Falha ao importar calendário",
+      "file_too_large": "Arquivo excede o limite de 5 MB",
+      "invalid_format": "Formato de arquivo de calendário inválido"
+    }
   },
   "advanced_search": {
     "title": "Pesquisa avançada",

stores/calendar-store.ts

@@ -25,6 +25,7 @@ interface CalendarStore {
   createEvent: (client: JMAPClient, event: Partial<CalendarEvent>) => Promise<CalendarEvent | null>;
   updateEvent: (client: JMAPClient, id: string, updates: Partial<CalendarEvent>) => Promise<void>;
   deleteEvent: (client: JMAPClient, id: string) => Promise<void>;
+  importEvents: (client: JMAPClient, events: Partial<CalendarEvent>[], calendarId: string) => Promise<number>;
   setSelectedDate: (date: Date) => void;
   setViewMode: (mode: CalendarViewMode) => void;
   toggleCalendarVisibility: (calendarId: string) => void;
@@ -114,6 +115,24 @@ export const useCalendarStore = create<CalendarStore>()(
         }
       },
 
+      importEvents: async (client, events, calendarId) => {
+        let imported = 0;
+        for (const event of events) {
+          try {
+            const data: Partial<CalendarEvent> = {
+              ...event,
+              calendarIds: { [calendarId]: true },
+            };
+            const created = await client.createCalendarEvent(data);
+            set((state) => ({ events: [...state.events, created] }));
+            imported++;
+          } catch (error) {
+            debug.error('Failed to import event:', event.title, error);
+          }
+        }
+        return imported;
+      },
+
       deleteEvent: async (client, id) => {
         set({ error: null });
         try {