@tuturuuu/ui 0.37.2 → 0.39.0

package/src/components/ui/legacy/calendar/native-recurrence-pattern-model.test.ts

@@ -0,0 +1,205 @@
+import type { NativeCalendarSeries } from '@tuturuuu/internal-api/calendar-series';
+import type { CalendarEvent } from '@tuturuuu/types/primitives/calendar-event';
+import type { CalendarRecurrenceRule } from '@tuturuuu/types/primitives/calendar-recurrence';
+import {
+  toGoogleCalendarRecurrence,
+  toGraphCalendarRecurrence,
+} from '@tuturuuu/utils/calendar-recurrence-providers';
+import { describe, expect, it } from 'vitest';
+import {
+  recurrenceDraftPayload,
+  recurrenceEditDraft,
+  recurrenceMutation,
+} from './native-recurrence-model';
+
+const event: CalendarEvent = {
+  id: 'slot',
+  seriesId: 'series',
+  originalStartLocal: '2026-03-27T09:00:00',
+  start_at: '2026-03-27T13:00:00Z',
+  end_at: '2026-03-27T14:00:00Z',
+  title: 'Monthly review',
+};
+function series(
+  rule: Partial<CalendarRecurrenceRule>,
+  day = '27'
+): NativeCalendarSeries {
+  return {
+    id: 'series',
+    ws_id: 'ws',
+    revision: 3,
+    workspace_calendar_id: null,
+    rule: {
+      version: 1,
+      frequency: 'monthly',
+      interval: 1,
+      timeZone: 'America/New_York',
+      weekdays: ['FR'],
+      weekIndex: -1,
+      end: { type: 'count', count: 8 },
+      ...rule,
+    },
+    anchor: {
+      startLocal: `2026-03-${day}T09:00:00`,
+      endLocal: `2026-03-${day}T10:00:00`,
+      allDay: false,
+    },
+    payload: { title: 'Monthly review' },
+    exceptions: [],
+  };
+}
+describe('editable relative recurrence provider parity', () => {
+  it.each([
+    { index: 1, day: '06' },
+    { index: 2, day: '13' },
+    { index: 3, day: '20' },
+    { index: 4, day: '27' },
+    { index: -1, day: '27' },
+  ] as const)(
+    'retains ordinal $index through details edits and provider serialization',
+    ({ index, day }) => {
+      for (const frequency of ['monthly', 'yearly'] as const) {
+        const original = series(
+          {
+            frequency,
+            weekIndex: index,
+            ...(frequency === 'yearly' ? { month: 3 } : {}),
+          },
+          day
+        );
+        const draft = recurrenceEditDraft(original, event, 'all');
+        expect(draft.retainedRule).toBeUndefined();
+        expect(draft.monthPattern).toBe('weekday');
+        const payload = recurrenceDraftPayload({
+          ...draft,
+          title: 'Updated title',
+        });
+        expect(payload.rule).toEqual(original.rule);
+        expect(toGraphCalendarRecurrence(payload.rule, payload.anchor)).toEqual(
+          toGraphCalendarRecurrence(original.rule, original.anchor)
+        );
+        expect(
+          toGoogleCalendarRecurrence(payload.rule, payload.anchor)
+        ).toEqual(toGoogleCalendarRecurrence(original.rule, original.anchor));
+      }
+    }
+  );
+  it('retains multi-weekday earliest-slot semantics and inclusive until dates', () => {
+    const original = series(
+      {
+        weekdays: ['TH', 'FR'],
+        weekIndex: 1,
+        end: { type: 'until', date: '2026-12-31' },
+      },
+      '05'
+    );
+    const payload = recurrenceDraftPayload(
+      recurrenceEditDraft(original, event, 'all')
+    );
+    expect(payload.rule).toEqual(original.rule);
+    expect(
+      toGraphCalendarRecurrence(payload.rule, payload.anchor).pattern.daysOfWeek
+    ).toEqual(['thursday', 'friday']);
+    expect(toGoogleCalendarRecurrence(payload.rule, payload.anchor)).toEqual(
+      toGoogleCalendarRecurrence(original.rule, original.anchor)
+    );
+  });
+  it('preserves Sunday week boundaries on biweekly imported series', () => {
+    const original = series({
+      frequency: 'weekly',
+      interval: 2,
+      weekIndex: undefined,
+      weekdays: ['FR'],
+      weekStartsOn: 'SU',
+    });
+    const payload = recurrenceDraftPayload(
+      recurrenceEditDraft(original, event, 'all')
+    );
+    expect(payload.rule.weekStartsOn).toBe('SU');
+    expect(
+      toGraphCalendarRecurrence(payload.rule, payload.anchor).pattern
+        .firstDayOfWeek
+    ).toBe('sunday');
+  });
+  it('preserves explicit month-end clamping while editing details', () => {
+    const original = series(
+      {
+        weekIndex: undefined,
+        weekdays: undefined,
+        monthDay: 31,
+        monthDayOverflow: 'last-day',
+      },
+      '31'
+    );
+    const payload = recurrenceDraftPayload(
+      recurrenceEditDraft(original, event, 'all')
+    );
+    expect(payload.rule).toEqual(original.rule);
+    expect(
+      toGraphCalendarRecurrence(payload.rule, payload.anchor).pattern.dayOfMonth
+    ).toBe(31);
+  });
+  it('does not add optional normalization that could reset existing exceptions', () => {
+    const original = series({
+      weekIndex: undefined,
+      weekdays: undefined,
+      monthDay: 27,
+    });
+    expect(
+      recurrenceDraftPayload(recurrenceEditDraft(original, event, 'all')).rule
+    ).toEqual(original.rule);
+  });
+  it.each(['0', '5', 'invalid'])('rejects invalid ordinal %s', (weekIndex) => {
+    expect(() =>
+      recurrenceDraftPayload({
+        ...recurrenceEditDraft(series({}), event, 'all'),
+        weekIndex,
+      })
+    ).toThrow();
+  });
+  it('rejects empty weekdays, invalid yearly months and mismatched anchors', () => {
+    const draft = recurrenceEditDraft(series({}), event, 'all');
+    expect(() => recurrenceDraftPayload({ ...draft, weekdays: [] })).toThrow();
+    for (const month of ['0', '13'])
+      expect(() =>
+        recurrenceDraftPayload({ ...draft, frequency: 'yearly', month })
+      ).toThrow();
+    expect(() =>
+      recurrenceDraftPayload({ ...draft, weekIndex: '1' })
+    ).toThrow();
+  });
+  it('keeps occurrence edits independent of the series pattern', () => {
+    const original = series({});
+    const draft = recurrenceEditDraft(original, event, 'this');
+    expect(
+      recurrenceMutation(
+        { ...draft, weekIndex: 'invalid', month: '0' },
+        original,
+        event,
+        'this',
+        'request',
+        'update'
+      ).rule
+    ).toBeUndefined();
+  });
+  it('uses the remaining count for a future relative split', () => {
+    const original = series({});
+    const later = {
+      ...event,
+      originalStartLocal: '2026-04-24T09:00:00',
+      start_at: '2026-04-24T13:00:00Z',
+      end_at: '2026-04-24T14:00:00Z',
+    };
+    const payload = recurrenceMutation(
+      recurrenceEditDraft(original, later, 'future'),
+      original,
+      later,
+      'future',
+      'request',
+      'update'
+    );
+    expect(payload.rule?.end).toEqual({ type: 'count', count: 7 });
+    expect(payload.rule?.weekIndex).toBe(-1);
+    expect(payload.originalStartLocal).toBe(later.originalStartLocal);
+  });
+});

package/src/components/ui/legacy/calendar/native-recurrence-provider-routing.test.tsx

@@ -0,0 +1,255 @@
+import '@testing-library/jest-dom/vitest';
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
+import {
+  cleanup,
+  fireEvent,
+  render,
+  screen,
+  waitFor,
+} from '@testing-library/react';
+import type { PropsWithChildren } from 'react';
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
+
+const mocks = vi.hoisted(() => ({
+  getSeries: vi.fn(),
+  nativeMutate: vi.fn(),
+  nativeCreate: vi.fn(),
+  capabilities: vi.fn(),
+  providerSubmit: vi.fn(),
+  pending: false,
+  applied: (() => {}) as () => void,
+}));
+vi.mock('@tuturuuu/internal-api/calendar-series', () => ({
+  getNativeCalendarSeries: mocks.getSeries,
+  mutateNativeCalendarSeries: mocks.nativeMutate,
+  createNativeCalendarSeries: mocks.nativeCreate,
+}));
+vi.mock('@tuturuuu/internal-api/calendar-provider-series', () => ({
+  getCalendarProviderSeriesCapabilities: mocks.capabilities,
+}));
+vi.mock('next-intl', () => ({ useTranslations: () => (key: string) => key }));
+vi.mock('../../../../hooks/use-workspace-visibility', () => ({
+  useWorkspaceActor: () => ({ actorId: 'actor', assertActive: () => {} }),
+}));
+vi.mock('../../../../hooks/use-native-calendar-occurrences', () => ({
+  nativeOccurrencesKey: (wsId: string) => ['occurrences', wsId],
+}));
+vi.mock('./use-provider-recurrence-operation', () => ({
+  useProviderRecurrenceOperation: ({
+    onApplied,
+  }: {
+    onApplied: () => void;
+  }) => {
+    mocks.applied = onApplied;
+    return {
+      pending: mocks.pending,
+      submission: {
+        mutate: mocks.providerSubmit,
+        isPending: false,
+        isError: false,
+      },
+      retry: vi.fn(),
+    };
+  },
+}));
+vi.mock('../../dialog', () =>
+  Object.fromEntries(
+    [
+      'Dialog',
+      'DialogContent',
+      'DialogDescription',
+      'DialogFooter',
+      'DialogHeader',
+      'DialogTitle',
+    ].map((name) => [
+      name,
+      ({ children }: PropsWithChildren) => <div>{children}</div>,
+    ])
+  )
+);
+vi.mock('../../select', () =>
+  Object.fromEntries(
+    [
+      'Select',
+      'SelectContent',
+      'SelectItem',
+      'SelectTrigger',
+      'SelectValue',
+    ].map((name) => [
+      name,
+      ({ children }: PropsWithChildren) => <div>{children}</div>,
+    ])
+  )
+);
+vi.mock('../../label', () => ({
+  Label: ({ children }: PropsWithChildren) => <label>{children}</label>,
+}));
+
+import type { CalendarEvent } from '@tuturuuu/types/primitives/calendar-event';
+import { NativeRecurrenceDialog } from './native-recurrence-dialog';
+
+const series = {
+  id: 'series',
+  ws_id: 'workspace',
+  revision: 2,
+  workspace_calendar_id: null,
+  providerSource: { provider: 'google', connectionId: 'connection' },
+  rule: {
+    version: 1,
+    frequency: 'daily',
+    interval: 1,
+    timeZone: 'UTC',
+    end: { type: 'never' },
+  },
+  anchor: {
+    startLocal: '2026-10-06T09:00:00',
+    endLocal: '2026-10-06T10:00:00',
+    allDay: false,
+  },
+  payload: { title: 'Test series' },
+  exceptions: [],
+};
+const occurrence = {
+  id: 'instance',
+  seriesId: 'series',
+  originalStartLocal: '2026-10-06T09:00:00',
+  start_at: '2026-10-06T09:00:00Z',
+  end_at: '2026-10-06T10:00:00Z',
+  title: 'Test series',
+} as CalendarEvent;
+const clients: QueryClient[] = [];
+function mount() {
+  const client = new QueryClient({
+    defaultOptions: { queries: { retry: false } },
+  });
+  clients.push(client);
+  const view = render(
+    <QueryClientProvider client={client}>
+      <NativeRecurrenceDialog
+        wsId="workspace"
+        open
+        onOpenChange={vi.fn()}
+        occurrence={occurrence}
+      />
+    </QueryClientProvider>
+  );
+  return { ...view, client };
+}
+beforeEach(() => {
+  vi.clearAllMocks();
+  vi.stubGlobal(
+    'ResizeObserver',
+    class {
+      observe() {}
+      unobserve() {}
+      disconnect() {}
+    }
+  );
+  mocks.pending = false;
+  mocks.getSeries.mockResolvedValue(series);
+  mocks.capabilities.mockResolvedValue({
+    enabled: true,
+    sources: [
+      {
+        provider: 'google',
+        connectionId: 'connection',
+        label: 'Test Calendar',
+      },
+    ],
+  });
+});
+afterEach(() => {
+  cleanup();
+  vi.unstubAllGlobals();
+  for (const client of clients.splice(0)) client.clear();
+});
+describe('imported recurrence mutation routing', () => {
+  it('uses the provider operation contract and never the native mutation API', async () => {
+    mount();
+    await waitFor(() =>
+      expect(screen.getByRole('button', { name: 'save' })).not.toBeDisabled()
+    );
+    fireEvent.click(screen.getByRole('button', { name: 'save' }));
+    await waitFor(() => expect(mocks.providerSubmit).toHaveBeenCalledTimes(1));
+    expect(mocks.providerSubmit).toHaveBeenCalledWith(
+      expect.objectContaining({
+        action: 'update',
+        seriesId: 'series',
+        scope: 'this',
+        source: { provider: 'google', connectionId: 'connection' },
+      })
+    );
+    expect(mocks.nativeMutate).not.toHaveBeenCalled();
+    expect(mocks.nativeCreate).not.toHaveBeenCalled();
+    expect(screen.queryByText('nativeOnly')).not.toBeInTheDocument();
+  });
+  it.each([
+    { enabled: false, sources: [] },
+    { enabled: true, sources: [] },
+  ])(
+    'blocks imported writes when admission or actor-owned source is unavailable',
+    async (caps) => {
+      mocks.capabilities.mockResolvedValue(caps);
+      mount();
+      await waitFor(() =>
+        expect(screen.getByText('provider_disabled')).toBeInTheDocument()
+      );
+      expect(screen.queryByText('nativeOnly')).not.toBeInTheDocument();
+      expect(screen.getByRole('button', { name: 'save' })).toBeDisabled();
+      expect(screen.getByRole('button', { name: 'delete' })).toBeDisabled();
+      expect(mocks.providerSubmit).not.toHaveBeenCalled();
+      expect(mocks.nativeMutate).not.toHaveBeenCalled();
+    }
+  );
+  it('keeps edits frozen while an ambiguous or pending provider operation is retained', async () => {
+    mocks.pending = true;
+    mount();
+    await waitFor(() =>
+      expect(screen.getByText('provider_pending')).toBeInTheDocument()
+    );
+    expect(screen.getByRole('button', { name: 'saving' })).toBeDisabled();
+    expect(mocks.nativeMutate).not.toHaveBeenCalled();
+  });
+});
+
+it('revalidates all provider projections only after applied and only in the affected workspace', async () => {
+  const h = mount();
+  const ownKeys = [
+    ['databaseCalendarEvents', 'workspace', 'dates'],
+    ['googleCalendarEvents', 'workspace', 'dates'],
+  ];
+  const other = ['googleCalendarEvents', 'other-workspace', 'dates'];
+  for (const key of [...ownKeys, other])
+    h.client.setQueryData(key, [{ id: 'retained' }]);
+  await waitFor(() =>
+    expect(screen.getByRole('button', { name: 'save' })).not.toBeDisabled()
+  );
+  fireEvent.click(screen.getByRole('button', { name: 'save' }));
+  await waitFor(() => expect(mocks.providerSubmit).toHaveBeenCalled());
+  for (const key of ownKeys)
+    expect(h.client.getQueryState(key)?.isInvalidated).toBe(false);
+  mocks.applied();
+  for (const key of ownKeys)
+    expect(h.client.getQueryState(key)?.isInvalidated).toBe(true);
+  expect(h.client.getQueryState(other)?.isInvalidated).toBe(false);
+});
+
+it.each(['google', 'microsoft'])(
+  'does not claim native storage for an imported %s series',
+  async (provider) => {
+    mocks.getSeries.mockResolvedValue({
+      ...series,
+      providerSource: { provider, connectionId: 'connection' },
+    });
+    mocks.capabilities.mockResolvedValue({ enabled: false, sources: [] });
+    mount();
+    await screen.findByText('provider_disabled');
+    expect(screen.queryByText('nativeOnly')).not.toBeInTheDocument();
+  }
+);
+it('retains the native storage hint for canonical native events', async () => {
+  const { providerSource: _provider, ...nativeSeries } = series;
+  mocks.getSeries.mockResolvedValue(nativeSeries);
+  mount();
+  expect(await screen.findByText('nativeOnly')).toBeInTheDocument();
+});

package/src/components/ui/legacy/calendar/past-event-treatment.test.ts

@@ -0,0 +1,137 @@
+import { describe, expect, it } from 'vitest';
+import { calendarDayBoundary } from '../../../../lib/calendar-day';
+import { calculateAllDayEventLayout } from './all-day-event-layout';
+import { pastEventTreatment } from './past-event-treatment';
+
+const event = {
+  id: 'past',
+  start_at: '2026-01-01T00:00:00Z',
+  end_at: '2026-01-01T01:00:00Z',
+};
+const now = Date.parse('2026-01-02T00:00:00Z');
+describe('past calendar treatment', () => {
+  it('fades native events with an overlay above the opaque card', () => {
+    expect(pastEventTreatment(event, false, false, now)).toContain(
+      'after:bg-background/50'
+    );
+    expect(
+      pastEventTreatment({ ...event, provider: 'tuturuuu' }, false, false, now)
+    ).toContain('hover:after:opacity-0');
+  });
+  it('fades past events across imported providers', () => {
+    for (const value of [
+      { ...event, provider: 'google' as const },
+      { ...event, provider: 'microsoft' as const },
+      { ...event, google_event_id: 'synthetic-provider' },
+    ]) {
+      expect(pastEventTreatment(value, false, false, now)).toContain(
+        'after:bg-background/50'
+      );
+    }
+  });
+  it('preserves explicit adapters and interaction/preview states', () => {
+    expect(pastEventTreatment(event, true, false, now)).toBeUndefined();
+    expect(pastEventTreatment(event, false, true, now)).toBeUndefined();
+    for (const value of [
+      { ...event, _isPreview: true },
+      { ...event, _optimisticStatus: 'updating' },
+    ]) {
+      expect(pastEventTreatment(value, false, false, now)).toBeUndefined();
+    }
+    expect(
+      pastEventTreatment(event, false, false, Date.parse(event.end_at))
+    ).toBeUndefined();
+  });
+});
+
+it('all-day fading follows displayed exclusive civil end rather than legacy UTC midnight', () => {
+  const event = {
+    id: 'synthetic-date',
+    start_at: '2030-01-15T00:00:00Z',
+    end_at: '2030-01-17T00:00:00Z',
+  };
+  const civilEnd = calendarDayBoundary(
+    new Date(2030, 0, 17),
+    'America/Los_Angeles'
+  ).getTime();
+  expect(
+    pastEventTreatment(
+      event,
+      false,
+      false,
+      Date.parse('2030-01-17T04:00:00Z'),
+      civilEnd
+    )
+  ).toBeUndefined();
+  expect(
+    pastEventTreatment(event, false, false, civilEnd, civilEnd)
+  ).toBeUndefined();
+  expect(
+    pastEventTreatment(event, false, false, civilEnd + 1, civilEnd)
+  ).toContain('after:bg-background/50');
+});
+
+it.each([
+  ['2026-03-08T05:00:00Z', '2026-03-09T04:00:00Z', new Date(2026, 2, 8)],
+  ['2026-11-01T04:00:00Z', '2026-11-02T05:00:00Z', new Date(2026, 10, 1)],
+])(
+  'all-day DST fading respects the actual exclusive midnight (%s)',
+  (start_at, end_at, date) => {
+    const event = {
+      id: 'synthetic-dst',
+      start_at: start_at as string,
+      end_at: end_at as string,
+    };
+    const span = calculateAllDayEventLayout(
+      [event],
+      [date as Date],
+      'America/New_York',
+      []
+    ).spans[0]!;
+    const end = calendarDayBoundary(
+      span.actualEndDate.toDate(),
+      'America/New_York'
+    ).getTime();
+    expect(end).toBe(Date.parse(event.end_at));
+    expect(pastEventTreatment(event, false, false, end, end)).toBeUndefined();
+    expect(pastEventTreatment(event, false, false, end + 1, end)).toContain(
+      'after:bg-background/50'
+    );
+  }
+);
+it('merged all-day span stays unfaded through its last civil day', () => {
+  const events = [
+    {
+      id: 'first',
+      title: 'Synthetic merged',
+      start_at: '2030-01-15T00:00:00Z',
+      end_at: '2030-01-16T00:00:00Z',
+    },
+    {
+      id: 'second',
+      title: 'Synthetic merged',
+      start_at: '2030-01-16T00:00:00Z',
+      end_at: '2030-01-17T00:00:00Z',
+    },
+  ];
+  const span = calculateAllDayEventLayout(
+    events,
+    [new Date(2030, 0, 15), new Date(2030, 0, 16)],
+    'America/Los_Angeles',
+    []
+  ).spans[0]!;
+  expect(span.isMerged).toBe(true);
+  const end = calendarDayBoundary(
+    span.actualEndDate.toDate(),
+    'America/Los_Angeles'
+  ).getTime();
+  expect(
+    pastEventTreatment(
+      span.event,
+      false,
+      false,
+      Date.parse('2030-01-16T20:00:00Z'),
+      end
+    )
+  ).toBeUndefined();
+});

package/src/components/ui/legacy/calendar/past-event-treatment.ts

@@ -0,0 +1,25 @@
+import type { CalendarEvent } from '@tuturuuu/types/primitives/calendar-event';
+
+// Fade over an opaque fill, never through it: the grid beneath stays occluded.
+const PAST_EVENT_TREATMENT =
+  'isolate overflow-hidden after:pointer-events-none after:absolute after:inset-0 after:z-30 after:bg-background/50 after:transition-opacity after:duration-200 hover:after:opacity-0 focus-visible:after:opacity-0';
+
+export function pastEventTreatment(
+  event: CalendarEvent,
+  preserve = false,
+  interacting = false,
+  now = Date.now(),
+  displayEndAt = Date.parse(event.end_at)
+): string | undefined {
+  const status = (event as CalendarEvent & { _optimisticStatus?: string })
+    ._optimisticStatus;
+  if (
+    preserve ||
+    interacting ||
+    event._isPreview ||
+    status ||
+    !(displayEndAt < now)
+  )
+    return undefined;
+  return PAST_EVENT_TREATMENT;
+}