mantinedev/mantine · error · Error

[@mantine/schedule] DayView: Duplicated event ids found: ${e

Error message

[@mantine/schedule] DayView: Duplicated event ids found: ${event.id}

What it means

DayView in @mantine/schedule validates each event's id for uniqueness while splitting events into background and foreground lists. A repeated id throws this error at render time because the view relies on ids for DOM keys, drag/resize targets and event lookups.

Source

Thrown at packages/@mantine/schedule/src/components/DayView/get-day-view-events/get-day-view-events.ts:56

    const eventEnd = dayjs(event.end);
    const isOnDay = eventStart.isSame(dayStart, 'day');
    const spansIntoDay =
      !isOnDay &&
      event.display === 'background' &&
      eventStart.isBefore(dayEnd) &&
      eventEnd.isAfter(dayStart);

    if (isOnDay || spansIntoDay) {
      if (isOnDay && !isEventInTimeRange({ event, startTime, endTime })) {
        continue;
      }

      const validated = validateEvent(event);

      if (!ids.has(event.id)) {
        ids.add(event.id);
      } else {
        throw new Error(`[@mantine/schedule] DayView: Duplicated event ids found: ${event.id}`);
      }

      if (event.display === 'background') {
        backgroundFiltered.push(validated);
      } else {
        filteredEvents.push(validated);
      }
    }
  }

  const positionedEvents = getDayPositionedEvents({
    events: filteredEvents,
    startTime,
    endTime,
    intervalMinutes,
    date,
  });

View on GitHub (pinned to 8a284e2c2c)

Solutions

Generate unique ids for each occurrence: events.map((e, i) => ({ ...e, id: `${e.id}-${i}` })) or use nanoid
Deduplicate by id before rendering
Fix the recurrence expansion logic to assign per-occurrence ids

Example fix

// before
const events = occurrences.map(() => baseEvent); // same id repeated

// after
const events = occurrences.map((occ, i) => ({ ...baseEvent, id: `${baseEvent.id}-${occ.start}` }));

Defensive patterns

Strategy: validation

Validate before calling

const events = rawEvents.map((e, i) => ({
  ...e,
  id: `${e.id}-${i}-${e.start}`,
}));

<Schedule events={events} view="day" />;

Type guard

function hasUniqueEventIds(events: { id: string | number }[]): boolean {
  return new Set(events.map((e) => e.id)).size === events.length;
}

Prevention

Generate per-occurrence ids when expanding recurring events
Use nanoid for user-created events instead of copying source ids
Validate events after every fetch/transform step

When it happens

Trigger: Two events with the same id in the events prop passed to a Schedule rendering a day view; duplicated all-day events; events copied with spread but keeping the same id instead of generating new ids.

Common situations: Splitting one recurring event into instances without assigning unique ids per occurrence; merging event arrays from different sources; optimistic updates that append a copy of an existing event.

Related errors

AI-assisted analysis of mantinedev/mantine@8a284e2c2c (2026-08-28). Data as JSON: /api/errors/9b20efee66369d9c. Report an issue: GitHub.