@tuturuuu/ui 0.38.0 → 0.39.1

package/src/hooks/__tests__/use-native-calendar-occurrences.test.tsx

@@ -0,0 +1,140 @@
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
+import { act, renderHook, waitFor } from '@testing-library/react';
+import { InternalApiError } from '@tuturuuu/internal-api/client';
+import type { CalendarEvent } from '@tuturuuu/types/primitives/calendar-event';
+import type { ReactNode } from 'react';
+import { beforeEach, describe, expect, it, vi } from 'vitest';
+
+const mock = vi.hoisted(() => ({
+  list: vi.fn(),
+  actor: { actorId: 'actor', assertActive: vi.fn() },
+}));
+vi.mock('@tuturuuu/internal-api/calendar-series', () => ({
+  listNativeCalendarOccurrences: mock.list,
+}));
+vi.mock('../use-workspace-visibility', () => ({
+  useWorkspaceActor: () => mock.actor,
+}));
+
+import {
+  EMPTY_NATIVE_OCCURRENCES,
+  nativeOccurrencesKey,
+  useNativeCalendarOccurrences,
+  visibleNativeOccurrences,
+} from '../use-native-calendar-occurrences';
+
+const event: CalendarEvent = {
+  id: 'event',
+  seriesId: 'series',
+  start_at: '2026-10-05T09:00:00Z',
+  end_at: '2026-10-05T10:00:00Z',
+};
+const dates = [new Date(2026, 9, 5)];
+function setup() {
+  const client = new QueryClient({
+    defaultOptions: { queries: { retry: false } },
+  });
+  return {
+    client,
+    wrapper: ({ children }: { children: ReactNode }) => (
+      <QueryClientProvider client={client}>{children}</QueryClientProvider>
+    ),
+  };
+}
+beforeEach(() => {
+  mock.list.mockReset();
+  mock.actor.actorId = 'actor';
+  mock.actor.assertActive.mockReset();
+  mock.list.mockResolvedValue({ data: [event] });
+});
+describe('native occurrence SWR feed', () => {
+  it('uses one stable empty reference before data and for denied/external feeds', () => {
+    expect(visibleNativeOccurrences(undefined, null)).toBe(
+      EMPTY_NATIVE_OCCURRENCES
+    );
+    expect(
+      visibleNativeOccurrences([event], new InternalApiError('denied', 403))
+    ).toBe(EMPTY_NATIVE_OCCURRENCES);
+  });
+  it.each([
+    new TypeError('Failed to fetch'),
+    new InternalApiError('busy', 429),
+    new InternalApiError('failed', 503),
+    new InternalApiError('verify', 403, 'MFA_REQUIRED'),
+  ])('retains authorized rows for recoverable failure %o', (error) => {
+    const data = [event];
+    expect(visibleNativeOccurrences(data, error)).toBe(data);
+  });
+  it('loads the requested workspace range using an actor-scoped key', async () => {
+    const { client, wrapper } = setup();
+    const { result } = renderHook(
+      () => useNativeCalendarOccurrences('ws', dates, 'UTC', false),
+      { wrapper }
+    );
+    await waitFor(() => expect(result.current.data).toEqual([event]));
+    expect(mock.list).toHaveBeenCalledWith(
+      'ws',
+      { from: '2026-10-05T00:00:00.000Z', to: '2026-10-06T00:00:00.000Z' },
+      expect.objectContaining({ signal: expect.any(AbortSignal) })
+    );
+    expect(client.getQueryCache().getAll()[0]?.queryKey).toContain('actor');
+  });
+  it('retains cached rows while a transient refresh fails', async () => {
+    const { wrapper } = setup();
+    const { result } = renderHook(
+      () => useNativeCalendarOccurrences('ws', dates, 'UTC', false),
+      { wrapper }
+    );
+    await waitFor(() => expect(result.current.data).toEqual([event]));
+    mock.list.mockRejectedValue(new InternalApiError('busy', 429));
+    await act(async () => {
+      await result.current.refetch();
+    });
+    expect(result.current.data).toEqual([event]);
+    await waitFor(() => expect(result.current.isError).toBe(true));
+  });
+  it.each([401, 403, 404])(
+    'clears retained and durable rows after definitive status %s',
+    async (status) => {
+      const { client, wrapper } = setup();
+      const { result } = renderHook(
+        () => useNativeCalendarOccurrences('ws', dates, 'UTC', false),
+        { wrapper }
+      );
+      await waitFor(() => expect(result.current.data).toEqual([event]));
+      mock.list.mockRejectedValue(new InternalApiError('denied', status));
+      await act(async () => {
+        await result.current.refetch();
+      });
+      await waitFor(() =>
+        expect(result.current.data).toBe(EMPTY_NATIVE_OCCURRENCES)
+      );
+      expect(
+        client.getQueriesData({ queryKey: nativeOccurrencesKey('ws') })[0]?.[1]
+      ).toEqual([]);
+    }
+  );
+  it('does not read native data for externally supplied calendars or empty dates', () => {
+    const { wrapper } = setup();
+    const { result, rerender } = renderHook(
+      ({ external, range }) =>
+        useNativeCalendarOccurrences('ws', range, 'UTC', external),
+      { wrapper, initialProps: { external: true, range: dates } }
+    );
+    expect(result.current.data).toBe(EMPTY_NATIVE_OCCURRENCES);
+    rerender({ external: false, range: [] });
+    expect(mock.list).not.toHaveBeenCalled();
+  });
+  it('does not carry a previous actor snapshot into another account', async () => {
+    const { wrapper } = setup();
+    const { result, rerender } = renderHook(
+      () => useNativeCalendarOccurrences('ws', dates, 'UTC', false),
+      { wrapper }
+    );
+    await waitFor(() => expect(result.current.data).toEqual([event]));
+    mock.actor.actorId = 'other';
+    mock.list.mockImplementation(() => new Promise(() => {}));
+    rerender();
+    expect(result.current.data).toBe(EMPTY_NATIVE_OCCURRENCES);
+  });
+});

package/src/hooks/__tests__/use-yjs-collaboration.test.tsx

@@ -16,6 +16,7 @@ vi.mock('@tuturuuu/ui/hooks/supabase-provider', () => ({
   default: class {
     id: number;
     destroyed = false;
+    hydrated = false;
     awareness: { destroy: () => void };
     private listeners = new Map<string, (value: unknown) => void>();
     constructor(
@@ -31,6 +32,7 @@ vi.mock('@tuturuuu/ui/hooks/supabase-provider', () => ({
       this.listeners.set(event, callback);
     }
     emit(event: string, value: unknown) {
+      if (event === 'hydrated') this.hydrated = true;
       this.listeners.get(event)?.(value);
     }
     destroy() {
@@ -105,4 +107,41 @@ describe('collaboration hook lifecycle', () => {
     expect(second.destroyed).toBe(true);
     expect(vi.getTimerCount()).toBe(0);
   });
+  it('publishes durable hydration independently and fences an old document', async () => {
+    const { result, rerender, unmount } = renderHook(
+      (id) =>
+        useYjsCollaboration({ ...config, id, channel: `task-editor-${id}` }),
+      { wrapper, initialProps: 'one' }
+    );
+    const first = instances[0]!;
+    act(() => first.emit('hydrated', undefined));
+    expect(result.current.hydrated).toBe(true);
+    expect(result.current.connected).toBe(false);
+    rerender('two');
+    expect(result.current.hydrated).toBe(false);
+    act(() => first.emit('hydrated', undefined));
+    expect(result.current.hydrated).toBe(false);
+    unmount();
+    await act(() => vi.advanceTimersByTimeAsync(100));
+  });
+  it('reports a durable read failure until a successful hydration', async () => {
+    const { result, unmount } = renderHook(() => useYjsCollaboration(config), {
+      wrapper,
+    });
+    const provider = instances[0]!;
+    act(() =>
+      provider.emit('error', {
+        message: 'Unable to load',
+        status: 'DOCUMENT_ERROR',
+        channel: config.channel,
+      })
+    );
+    expect(result.current.hydrationFailed).toBe(true);
+    expect(result.current.hydrated).toBe(false);
+    act(() => provider.emit('hydrated', undefined));
+    expect(result.current.hydrationFailed).toBe(false);
+    expect(result.current.hydrated).toBe(true);
+    unmount();
+    await act(() => vi.advanceTimersByTimeAsync(100));
+  });
 });

package/src/hooks/calendar-connection-types.ts

@@ -0,0 +1,49 @@
+import type { CalendarEvent } from '@tuturuuu/types/primitives/calendar-event';
+// Type for calendar connection
+export type CalendarConnection = {
+  id: string;
+  ws_id: string;
+  calendar_id: string;
+  calendar_name: string;
+  is_enabled: boolean;
+  color: string | null;
+  provider?: 'google' | 'microsoft' | string;
+  auth_token_id?: string | null;
+  workspace_calendar_id?: string | null;
+  access_role?: string | null;
+  created_at: string;
+  updated_at: string;
+};
+
+export type CalendarSyncStatus = {
+  state: 'idle' | 'syncing' | 'success' | 'error';
+  message?: string;
+  lastSyncTime?: Date;
+  direction?: 'google-to-tuturuuu' | 'tuturuuu-to-google' | 'both';
+};
+export type CalendarOptimisticStatus =
+  | 'creating'
+  | 'updating'
+  | 'deleting'
+  | 'error';
+
+export type OptimisticCalendarSyncEvent = Partial<
+  Omit<CalendarEvent, 'color' | 'description' | 'location'>
+> &
+  Pick<CalendarEvent, 'id'> & {
+    color?: CalendarEvent['color'] | string | null;
+    description?: string | null;
+    location?: string | null;
+    _optimisticStatus?: CalendarOptimisticStatus;
+  };
+
+export type OptimisticCalendarPatchOptions = {
+  removeIds?: string[];
+  clearIds?: string[];
+  status?: CalendarOptimisticStatus;
+};
+
+export type OptimisticCalendarState = {
+  events: Record<string, OptimisticCalendarSyncEvent>;
+  removedIds: string[];
+};

package/src/hooks/calendar-event-update-queue-types.ts

@@ -0,0 +1,12 @@
+import type { CalendarEvent } from '@tuturuuu/types/primitives/calendar-event';
+
+export interface PendingEventUpdate extends Partial<CalendarEvent> {
+  _updateId?: string;
+  _timestamp: number;
+  _eventId: string;
+  _previousEvent?: CalendarEvent;
+  _resolvers?: Array<{
+    resolve: (value: CalendarEvent) => void;
+    reject: (reason: unknown) => void;
+  }>;
+}

package/src/hooks/calendar-event-write-payload.ts

@@ -1,5 +1,6 @@
 import type { WorkspaceCalendarEventUpdatePayload } from '@tuturuuu/internal-api';
 import type { CalendarEvent } from '@tuturuuu/types/primitives/calendar-event';
+import { isProviderRecurrenceReadonly } from '@tuturuuu/utils/calendar-provider-readonly';
 
 export function calendarEventUpdatePayload(
   input: Partial<CalendarEvent>
@@ -22,3 +23,35 @@ export function calendarEventUpdatePayload(
     payload.color = input.color;
   return payload;
 }
+
+export function cleanCalendarEventUpdates(input: Partial<CalendarEvent>) {
+  const result: Partial<CalendarEvent> = {};
+  for (const field of [
+    'title',
+    'description',
+    'start_at',
+    'end_at',
+    'color',
+    'location',
+    'locked',
+    'source',
+  ] as const) {
+    if (input[field] !== undefined)
+      Object.assign(result, { [field]: input[field] });
+  }
+  return result;
+}
+export function calendarEventByIdentity(events: CalendarEvent[], id: string) {
+  return events.find((event) => event.id === id || event._originalId === id);
+}
+export function assertOrdinaryCalendarEvent(
+  events: CalendarEvent[],
+  id: string
+) {
+  if (isProviderRecurrenceReadonly(calendarEventByIdentity(events, id)))
+    throw new Error('Unsupported provider recurrence is read only');
+  if (calendarEventByIdentity(events, id)?.seriesId)
+    throw new Error(
+      'Recurring occurrences require an explicit series edit scope'
+    );
+}

package/src/hooks/collaboration-document-hydration.ts

@@ -0,0 +1,35 @@
+interface DocumentHydrationOptions {
+  load: () => Promise<number[] | null>;
+  apply: (state: Uint8Array) => void;
+  isActive: () => boolean;
+  onLoaded: () => void;
+  onError: () => void;
+}
+
+/** Coalesces durable reads and fences late completion after resource teardown. */
+export class DocumentHydration {
+  private pending: Promise<boolean> | undefined;
+
+  constructor(private readonly options: DocumentHydrationOptions) {}
+
+  load(): Promise<boolean> {
+    if (this.pending) return this.pending;
+    this.pending = this.read().finally(() => {
+      this.pending = undefined;
+    });
+    return this.pending;
+  }
+
+  private async read(): Promise<boolean> {
+    try {
+      const state = await this.options.load();
+      if (!this.options.isActive()) return false;
+      if (state?.length) this.options.apply(Uint8Array.from(state));
+      this.options.onLoaded();
+      return true;
+    } catch {
+      if (this.options.isActive()) this.options.onError();
+      return false;
+    }
+  }
+}

package/src/hooks/supabase-provider.ts

@@ -7,6 +7,7 @@ import debug from 'debug';
 import { EventEmitter } from 'eventemitter3';
 import * as awarenessProtocol from 'y-protocols/awareness';
 import * as Y from 'yjs';
+import { DocumentHydration } from './collaboration-document-hydration';
 import { isPageVisible } from './use-page-visibility';
 
 export const SUPABASE_PROVIDER_SYNC_ORIGIN = Symbol.for(
@@ -31,6 +32,9 @@ export interface SupabaseProviderConfig {
 export default class SupabaseProvider extends EventEmitter {
   public awareness: awarenessProtocol.Awareness;
   public connected = false;
+  public hydrated = false;
+  private connectionGeneration = 0;
+  private hydration: DocumentHydration;
   private channel: RealtimeChannel | null = null;
   private realtime = createRealtimeClient();
   private pendingAwarenessClients = new Set<number>();
@@ -78,12 +82,10 @@ export default class SupabaseProvider extends EventEmitter {
     }
 
     if (!this.connected || this.destroyed) {
-      this.logger('skipping broadcast - not connected or destroyed');
       return;
     }
 
     if (!update || update.length === 0) {
-      this.logger('skipping broadcast - empty update');
       return;
     }
 
@@ -125,7 +127,6 @@ export default class SupabaseProvider extends EventEmitter {
 
     this.saveTimeout = setTimeout(() => {
       this.saveTimeout = undefined;
-      this.logger('debounce period elapsed, saving to database');
       void this.save();
     }, this.saveDebounceMs);
   }
@@ -145,7 +146,6 @@ export default class SupabaseProvider extends EventEmitter {
     if (this.saveTimeout) {
       clearTimeout(this.saveTimeout);
       this.saveTimeout = undefined;
-      this.logger('flushing pending save immediately');
       await this.save();
     }
   }
@@ -269,39 +269,20 @@ export default class SupabaseProvider extends EventEmitter {
   }
 
   private async onConnect() {
-    this.logger('connected');
-
     this.reconnectAttempts = 0;
     if (this.reconnectTimeout) {
       clearTimeout(this.reconnectTimeout);
       this.reconnectTimeout = undefined;
     }
 
-    const persistedState = this.config.loadState
-      ? await this.config.loadState()
-      : await (async () => {
-          const { data, status } = await this.supabase
-            .from(this.config.tableName as any)
-            .select<string, { [key: string]: number[] }>(
-              `${this.config.columnName}`
-            )
-            .eq(this.config.idName || 'id', this.config.id)
-            .single();
-
-          this.logger('retrieved data from supabase', status);
-          return data?.[this.config.columnName] ?? null;
-        })();
-
-    if (persistedState && persistedState.length > 0) {
-      this.logger('applying update to yjs');
-      try {
-        this.applyUpdate(Uint8Array.from(persistedState), this);
-      } catch (error) {
-        this.logger(error);
-      }
-    }
+    const generation = this.connectionGeneration;
+    if (
+      !(await this.hydration.load()) ||
+      this.destroyed ||
+      generation !== this.connectionGeneration
+    )
+      return;
 
-    this.logger('setting connected flag to true');
     this.isOnline(true);
 
     this.synced = true;
@@ -416,9 +397,33 @@ export default class SupabaseProvider extends EventEmitter {
     this.logger = debug(`y-${doc.clientID}`);
     this.logger.enabled = true;
 
-    this.logger('constructor initializing');
-    this.logger('connecting to Cloudflare realtime', doc.guid);
-    this.logger(`save debounce set to ${this.saveDebounceMs}ms`);
+    this.hydration = new DocumentHydration({
+      load:
+        this.config.loadState ??
+        (async () => {
+          const { data, error } = await this.supabase
+            .from(this.config.tableName as any)
+            .select<string, { [key: string]: number[] }>(this.config.columnName)
+            .eq(this.config.idName || 'id', this.config.id)
+            .single();
+          if (error) throw error;
+          return data?.[this.config.columnName] ?? null;
+        }),
+      apply: (state) => Y.applyUpdate(this.doc, state, this),
+      isActive: () => !this.destroyed,
+      onLoaded: () => {
+        this.hydrated = true;
+        this.emit('hydrated');
+      },
+      onError: () =>
+        this.emit('error', {
+          message: 'Unable to load collaboration document',
+          channel: this.config.channel,
+          status: 'DOCUMENT_ERROR',
+        }),
+    });
+    // Durable reads must not depend on a successful peer transport connection.
+    void this.hydration.load();
 
     if (
       this.config.resyncInterval ||
@@ -438,12 +443,10 @@ export default class SupabaseProvider extends EventEmitter {
         }
 
         if (!isPageVisible()) {
-          this.logger('skipping resync - page not visible');
           return;
         }
 
         if (!this._dirty) {
-          this.logger('skipping resync - no local changes');
           return;
         }
 
@@ -542,7 +545,6 @@ export default class SupabaseProvider extends EventEmitter {
 
   public onConnecting() {
     if (!this.isOnline()) {
-      this.logger('connecting');
       this.emit('status', [{ status: 'connecting' }]);
     }
   }
@@ -551,7 +553,6 @@ export default class SupabaseProvider extends EventEmitter {
     if (this.destroyed || this.reconnectTimeout) return;
 
     if (this.reconnectAttempts >= this.maxReconnectAttempts) {
-      this.logger('max reconnect attempts reached');
       this.emit('reconnect-failed');
       return;
     }
@@ -581,7 +582,6 @@ export default class SupabaseProvider extends EventEmitter {
   public resetAndReconnect() {
     if (this.destroyed || this.connected) return;
 
-    this.logger('resetAndReconnect: resetting backoff and reconnecting');
     this.reconnectAttempts = 0;
 
     if (this.reconnectTimeout) {
@@ -594,11 +594,10 @@ export default class SupabaseProvider extends EventEmitter {
   }
 
   public onDisconnect() {
-    this.logger('disconnected');
+    this.connectionGeneration++;
 
     this.synced = false;
     this.isOnline(false);
-    this.logger('set connected flag to false');
     if (this.isOnline()) {
       this.emit('status', [{ status: 'disconnected' }]);
     }
@@ -633,7 +632,6 @@ export default class SupabaseProvider extends EventEmitter {
     if (!message) {
       this.logger(`Permission denied to channel`);
     }
-    this.logger('processed message (type = MessageAuth)');
   }
 
   public destroy() {

package/src/hooks/use-calendar-sync.tsx

@@ -21,6 +21,14 @@ import {
 } from 'react';
 import { toast } from '../components/ui/sonner';
 import { calendarQueryRange } from '../lib/calendar-day';
+import type {
+  CalendarConnection,
+  CalendarOptimisticStatus,
+  OptimisticCalendarPatchOptions,
+  OptimisticCalendarState,
+  OptimisticCalendarSyncEvent,
+  CalendarSyncStatus as SyncStatus,
+} from './calendar-connection-types';
 import { runCalendarProviderSync } from './calendar-provider-sync';
 import {
   type CacheUpdate,
@@ -32,22 +40,10 @@ import {
   calendarRangeCacheKey,
   calendarRangeIncludesToday,
 } from './calendar-sync-range';
-
-// Type for calendar connection
-type CalendarConnection = {
-  id: string;
-  ws_id: string;
-  calendar_id: string;
-  calendar_name: string;
-  is_enabled: boolean;
-  color: string | null;
-  provider?: 'google' | 'microsoft' | string;
-  auth_token_id?: string | null;
-  workspace_calendar_id?: string | null;
-  access_role?: string | null;
-  created_at: string;
-  updated_at: string;
-};
+import {
+  nativeOccurrencesKey,
+  useNativeCalendarOccurrences,
+} from './use-native-calendar-occurrences';
 
 // Extended CalendarEvent type with habit flags
 export type CalendarEventWithHabitInfo = CalendarEvent & {
@@ -56,40 +52,7 @@ export type CalendarEventWithHabitInfo = CalendarEvent & {
   _optimisticStatus?: CalendarOptimisticStatus;
 };
 
-// Sync status type
-type SyncStatus = {
-  state: 'idle' | 'syncing' | 'success' | 'error';
-  message?: string;
-  lastSyncTime?: Date;
-  direction?: 'google-to-tuturuuu' | 'tuturuuu-to-google' | 'both';
-};
-
-export type CalendarOptimisticStatus =
-  | 'creating'
-  | 'updating'
-  | 'deleting'
-  | 'error';
-
-type OptimisticCalendarSyncEvent = Partial<
-  Omit<CalendarEvent, 'color' | 'description' | 'location'>
-> &
-  Pick<CalendarEvent, 'id'> & {
-    color?: CalendarEvent['color'] | string | null;
-    description?: string | null;
-    location?: string | null;
-    _optimisticStatus?: CalendarOptimisticStatus;
-  };
-
-type OptimisticCalendarPatchOptions = {
-  removeIds?: string[];
-  clearIds?: string[];
-  status?: CalendarOptimisticStatus;
-};
-
-type OptimisticCalendarState = {
-  events: Record<string, OptimisticCalendarSyncEvent>;
-  removedIds: string[];
-};
+export type { CalendarOptimisticStatus } from './calendar-connection-types';
 
 const CalendarSyncContext = createContext<{
   data: WorkspaceCalendarEvent[] | null;
@@ -222,6 +185,12 @@ export const CalendarSyncProvider = ({
   const isForcedRef = useRef<boolean>(false);
   const lastSyncTimeRef = useRef<number>(0);
   const queryClient = useQueryClient();
+  const nativeOccurrences = useNativeCalendarOccurrences(
+    wsId,
+    dates,
+    timezone,
+    hasExternalEvents
+  );
 
   // Calendar connections state
   const [calendarConnections, setCalendarConnectionsState] = useState<
@@ -514,6 +483,7 @@ export const CalendarSyncProvider = ({
     if (!activeCacheKey) return null;
 
     isForcedRef.current = true;
+    queryClient.invalidateQueries({ queryKey: nativeOccurrencesKey(wsId) });
 
     queryClient.invalidateQueries({
       queryKey: ['databaseCalendarEvents', wsId, activeCacheKey],
@@ -641,8 +611,17 @@ export const CalendarSyncProvider = ({
     () =>
       hasExternalEvents
         ? ((externalEvents ?? []) as WorkspaceCalendarEvent[])
-        : (fetchedData ?? activeCachedDatabaseEvents ?? []),
-    [activeCachedDatabaseEvents, externalEvents, fetchedData, hasExternalEvents]
+        : [
+            ...(fetchedData ?? activeCachedDatabaseEvents ?? []),
+            ...nativeOccurrences.data,
+          ],
+    [
+      activeCachedDatabaseEvents,
+      externalEvents,
+      fetchedData,
+      hasExternalEvents,
+      nativeOccurrences.data,
+    ]
   );
 
   const visibleEventsWithOptimisticState = useMemo(() => {
@@ -768,20 +747,16 @@ export const CalendarSyncProvider = ({
   const eventsWithoutAllDays = useMemo(() => {
     // Process events immediately when they change
     return events.filter((event) => {
-      // Note: We can't access settings here easily, so we use default timezone detection
-      // This is acceptable since this is used for layout purposes mainly
-      return !isAllDayEvent(event);
+      return !isAllDayEvent(event, timezone);
     });
-  }, [events]);
+  }, [events, timezone]);
 
   const allDayEvents = useMemo(() => {
     // Process events immediately when they change
     return events.filter((event) => {
-      // Note: We can't access settings here easily, so we use default timezone detection
-      // This is acceptable since this is used for layout purposes mainly
-      return isAllDayEvent(event);
+      return isAllDayEvent(event, timezone);
     });
-  }, [events]);
+  }, [events, timezone]);
 
   const syncToGoogle = useCallback(async () => {
     toast.info('Provider events sync when you create or edit them.');
@@ -798,7 +773,7 @@ export const CalendarSyncProvider = ({
       ? ((externalEvents ?? []) as WorkspaceCalendarEvent[])
       : (fetchedData ?? activeCachedDatabaseEvents ?? null),
     googleData,
-    error,
+    error: error ?? nativeOccurrences.error,
     dates,
     setDates,
     timezone,
@@ -828,7 +803,11 @@ export const CalendarSyncProvider = ({
     syncStatus,
 
     // Loading states
-    isLoading: externalEventsLoading || isDatabaseLoading || isGoogleLoading,
+    isLoading:
+      externalEventsLoading ||
+      isDatabaseLoading ||
+      isGoogleLoading ||
+      (!hasExternalEvents && dates.length > 0 && nativeOccurrences.isLoading),
     isSyncing,
   };