@tuturuuu/ui 0.38.0 → 0.39.1

package/src/components/ui/text-editor/fixed-toolbar-contents.test.tsx

@@ -0,0 +1,59 @@
+import { fireEvent, render, screen } from '@testing-library/react';
+import type { Editor } from '@tiptap/react';
+import { TooltipProvider } from '@tuturuuu/ui/tooltip';
+import { describe, expect, it, vi } from 'vitest';
+import { FixedToolbarContents } from './fixed-toolbar-contents';
+
+vi.mock('./color-controls', () => ({
+  TextEditorColorControls: () => <button type="button">Colors</button>,
+}));
+vi.mock('./copy-menu', () => ({
+  EditorCopyMenu: () => <button type="button">Copy tools</button>,
+}));
+
+function mount(toolsLabel?: string) {
+  const heading = vi.fn();
+  const bold = vi.fn();
+  const options = new Map([
+    ['bold', { icon: <span>B</span>, pressed: false, onClick: bold }],
+    ['heading-1', { icon: <span>H1</span>, pressed: false, onClick: heading }],
+  ]);
+  render(
+    <TooltipProvider>
+      <FixedToolbarContents
+        editor={{} as Editor}
+        options={options}
+        toolsLabel={toolsLabel}
+        imageUpload={false}
+        videoUpload={false}
+        uploadingImage={false}
+        uploadingVideo={false}
+        onImage={vi.fn()}
+        onVideo={vi.fn()}
+      />
+    </TooltipProvider>
+  );
+  return { heading, bold };
+}
+
+describe('optional compact document toolbar', () => {
+  it('retains the existing full toolbar by default', () => {
+    const { heading } = mount();
+    expect(screen.queryByRole('button', { name: 'Tools' })).toBeNull();
+    fireEvent.click(screen.getByRole('button', { name: 'Heading 1' }));
+    expect(heading).toHaveBeenCalledOnce();
+    expect(screen.getByRole('button', { name: 'Colors' })).toBeTruthy();
+  });
+  it('keeps primary formatting reachable and places secondary controls in Tools', () => {
+    const { heading, bold } = mount('Tools');
+    expect(screen.queryByRole('button', { name: 'Heading 1' })).toBeNull();
+    expect(screen.queryByRole('button', { name: 'Colors' })).toBeNull();
+    fireEvent.click(screen.getByRole('button', { name: 'Bold' }));
+    expect(bold).toHaveBeenCalledOnce();
+    fireEvent.click(screen.getByRole('button', { name: 'Tools' }));
+    fireEvent.click(screen.getByRole('button', { name: 'Heading 1' }));
+    expect(heading).toHaveBeenCalledOnce();
+    expect(screen.getByRole('button', { name: 'Colors' })).toBeTruthy();
+    expect(screen.getByRole('button', { name: 'Copy tools' })).toBeTruthy();
+  });
+});

package/src/components/ui/text-editor/fixed-toolbar-contents.tsx

@@ -0,0 +1,156 @@
+import type { Editor } from '@tiptap/react';
+import {
+  CirclePlus,
+  FileVideo,
+  ImageIcon,
+  Loader2,
+  Settings2,
+} from '@tuturuuu/icons';
+import { Button } from '@tuturuuu/ui/button';
+import { Popover, PopoverContent, PopoverTrigger } from '@tuturuuu/ui/popover';
+import type { ReactNode } from 'react';
+import { TextEditorColorControls } from './color-controls';
+import { type EditorCopyLabels, EditorCopyMenu } from './copy-menu';
+import { TOOLBAR_GROUPS } from './toolbar-config';
+import { ToolbarButton, ToolbarSeparator } from './toolbar-controls';
+
+interface Props {
+  editor: Editor;
+  options: Map<
+    string,
+    { onClick: () => void; pressed: boolean; icon: ReactNode }
+  >;
+  toolsLabel?: string;
+  toggleBlockLabel?: string;
+  copyLabels?: EditorCopyLabels;
+  imageUpload: boolean;
+  videoUpload: boolean;
+  uploadingImage: boolean;
+  uploadingVideo: boolean;
+  onImage: () => void;
+  onVideo: () => void;
+  onConvertToTask?: () => void | Promise<void>;
+}
+
+/** Optional compact presentation; existing editors keep the full toolbar. */
+export function FixedToolbarContents({
+  editor,
+  options,
+  toolsLabel,
+  toggleBlockLabel,
+  copyLabels,
+  imageUpload,
+  videoUpload,
+  uploadingImage,
+  uploadingVideo,
+  onImage,
+  onVideo,
+  onConvertToTask,
+}: Props) {
+  function control(key: string) {
+    const option = options.get(key);
+    if (!option) return null;
+    return (
+      <ToolbarButton
+        key={key}
+        id={key}
+        label={key === 'toggle-block' ? toggleBlockLabel : undefined}
+        icon={option.icon}
+        pressed={option.pressed}
+        onClick={option.onClick}
+      />
+    );
+  }
+  const primary = new Set(['bold', 'italic', 'strike']);
+  const groups = TOOLBAR_GROUPS.map((group, index) => {
+    const keys = toolsLabel ? group.filter((key) => !primary.has(key)) : group;
+    if (!keys.length) return null;
+    return (
+      <div
+        key={index}
+        className={toolsLabel ? 'flex items-center gap-1' : 'contents'}
+      >
+        {!toolsLabel && index > 0 && <ToolbarSeparator />}
+        {keys.map(control)}
+      </div>
+    );
+  });
+  const secondary = (
+    <>
+      {groups}
+      <ToolbarSeparator />
+      <TextEditorColorControls editor={editor} />
+      {imageUpload && (
+        <>
+          <ToolbarSeparator />
+          <ToolbarButton
+            id="image"
+            icon={
+              uploadingImage ? (
+                <Loader2 className="size-4 animate-spin" />
+              ) : (
+                <ImageIcon className="size-4" />
+              )
+            }
+            pressed={false}
+            onClick={onImage}
+            disabled={uploadingImage}
+          />
+          {videoUpload && (
+            <ToolbarButton
+              id="video"
+              icon={
+                uploadingVideo ? (
+                  <Loader2 className="size-4 animate-spin" />
+                ) : (
+                  <FileVideo className="size-4" />
+                )
+              }
+              pressed={false}
+              onClick={onVideo}
+              disabled={uploadingVideo}
+            />
+          )}
+        </>
+      )}
+      {onConvertToTask && (
+        <>
+          <ToolbarSeparator />
+          <ToolbarButton
+            id="convert-to-task"
+            icon={<CirclePlus className="size-4" />}
+            pressed={false}
+            onClick={onConvertToTask}
+          />
+        </>
+      )}
+      <ToolbarSeparator />
+      <EditorCopyMenu editor={editor} labels={copyLabels} />
+    </>
+  );
+  if (!toolsLabel) return secondary;
+  return (
+    <>
+      {[...primary].map(control)}
+      <Popover>
+        <PopoverTrigger asChild>
+          <Button
+            type="button"
+            variant="ghost"
+            size="sm"
+            className="h-8 shrink-0"
+          >
+            <Settings2 className="size-4" aria-hidden="true" />
+            {toolsLabel}
+          </Button>
+        </PopoverTrigger>
+        <PopoverContent
+          align="start"
+          className="flex w-80 max-w-[calc(100vw-2rem)] flex-wrap items-center gap-1"
+        >
+          {secondary}
+        </PopoverContent>
+      </Popover>
+    </>
+  );
+}

package/src/components/ui/text-editor/tool-bar.tsx

@@ -35,13 +35,13 @@ import { toast } from '@tuturuuu/ui/sonner';
 import { cn } from '@tuturuuu/utils/format';
 import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { TextEditorColorControls } from './color-controls';
-import { type EditorCopyLabels, EditorCopyMenu } from './copy-menu';
+import type { EditorCopyLabels } from './copy-menu';
+import { FixedToolbarContents } from './fixed-toolbar-contents';
 import {
   MAX_IMAGE_SIZE,
   MAX_VIDEO_SIZE,
   StorageQuotaError,
 } from './media-utils';
-import { TOOLBAR_GROUPS } from './toolbar-config';
 import { ToolbarButton, ToolbarSeparator } from './toolbar-controls';
 
 type LinkEditorContext = 'bubble' | 'popover' | null;
@@ -842,6 +842,7 @@ export function ToolBar({
 }
 
 interface FixedToolbarProps {
+  toolsLabel?: string;
   editor: Editor | null;
   leadingContent?: React.ReactNode;
   workspaceId?: string;
@@ -853,6 +854,7 @@ interface FixedToolbarProps {
   copyLabels?: EditorCopyLabels;
 }
 export function FixedToolbar({
+  toolsLabel,
   editor,
   leadingContent,
   workspaceId,
@@ -1108,78 +1110,20 @@ export function FixedToolbar({
           <ToolbarSeparator />
         </>
       ) : null}
-      {/* Grouped formatting options with separators */}
-      {TOOLBAR_GROUPS.map((group, gi) => (
-        <div key={gi} className="contents">
-          {gi > 0 && <ToolbarSeparator />}
-          {group.map((key) => {
-            const opt = formattingOptions.get(key);
-            if (!opt) return null;
-            return (
-              <ToolbarButton
-                key={key}
-                id={key}
-                label={key === 'toggle-block' ? toggleBlockLabel : undefined}
-                icon={opt.icon}
-                pressed={opt.pressed}
-                onClick={opt.onClick}
-              />
-            );
-          })}
-        </div>
-      ))}
-
-      <ToolbarSeparator />
-      <TextEditorColorControls editor={editor} />
-
-      {onImageUpload && (
-        <>
-          <ToolbarSeparator />
-          <ToolbarButton
-            id="image"
-            icon={
-              isUploadingImage ? (
-                <Loader2 className="size-4 animate-spin" />
-              ) : (
-                <ImageIcon className="size-4" />
-              )
-            }
-            pressed={false}
-            onClick={() => fileInputRef.current?.click()}
-            disabled={isUploadingImage}
-          />
-          {workspaceId && (
-            <ToolbarButton
-              id="video"
-              icon={
-                isUploadingVideo ? (
-                  <Loader2 className="size-4 animate-spin" />
-                ) : (
-                  <FileVideo className="size-4" />
-                )
-              }
-              pressed={false}
-              onClick={() => videoInputRef.current?.click()}
-              disabled={isUploadingVideo}
-            />
-          )}
-        </>
-      )}
-
-      {onConvertToTask && (
-        <>
-          <ToolbarSeparator />
-          <ToolbarButton
-            id="convert-to-task"
-            icon={<CirclePlus className="size-4" />}
-            pressed={false}
-            onClick={onConvertToTask}
-          />
-        </>
-      )}
-
-      <ToolbarSeparator />
-      <EditorCopyMenu editor={editor} labels={copyLabels} />
+      <FixedToolbarContents
+        editor={editor}
+        options={formattingOptions}
+        toolsLabel={toolsLabel}
+        toggleBlockLabel={toggleBlockLabel}
+        copyLabels={copyLabels}
+        imageUpload={!!onImageUpload}
+        videoUpload={!!workspaceId}
+        uploadingImage={isUploadingImage}
+        uploadingVideo={isUploadingVideo}
+        onImage={() => fileInputRef.current?.click()}
+        onVideo={() => videoInputRef.current?.click()}
+        onConvertToTask={onConvertToTask}
+      />
     </div>
   );
 }

package/src/hooks/__tests__/calendar-event-write-payload-readonly.test.ts

@@ -0,0 +1,40 @@
+import type { CalendarEvent } from '@tuturuuu/types/primitives/calendar-event';
+import { describe, expect, it } from 'vitest';
+import { assertOrdinaryCalendarEvent } from '../calendar-event-write-payload';
+
+const event = {
+  id: 'instance',
+  start_at: '2026-10-06T09:00:00Z',
+  end_at: '2026-10-06T10:00:00Z',
+  _originalId: 'original',
+  scheduling_metadata: {
+    provider_recurrence: {
+      state: 'unsupported',
+      provider: 'google',
+      master_id: 'master',
+    },
+  },
+} as CalendarEvent;
+describe('provider readonly ordinary mutation fence', () => {
+  it.each(['instance', 'original'])(
+    'blocks updates/deletes by %s identity even if user unlocks the local event',
+    (id) =>
+      expect(() =>
+        assertOrdinaryCalendarEvent([{ ...event, locked: false }], id)
+      ).toThrow('read only')
+  );
+  it('permits an ordinary independently locked event', () =>
+    expect(() =>
+      assertOrdinaryCalendarEvent(
+        [{ id: 'ordinary', locked: true } as CalendarEvent],
+        'ordinary'
+      )
+    ).not.toThrow());
+  it('retains the scoped native occurrence fence', () =>
+    expect(() =>
+      assertOrdinaryCalendarEvent(
+        [{ id: 'native', seriesId: 'series' } as CalendarEvent],
+        'native'
+      )
+    ).toThrow('explicit series edit scope'));
+});

package/src/hooks/__tests__/native-calendar-mutation-guard.test.ts

@@ -0,0 +1,45 @@
+import type { CalendarEvent } from '@tuturuuu/types/primitives/calendar-event';
+import { describe, expect, it } from 'vitest';
+import {
+  assertOrdinaryCalendarEvent,
+  calendarEventByIdentity,
+  cleanCalendarEventUpdates,
+} from '../calendar-event-write-payload';
+
+const virtual: CalendarEvent = {
+  id: '123e4567-e89b-42d3-a456-426614174000',
+  seriesId: 'series',
+  originalStartLocal: '2026-10-05T09:00:00',
+  start_at: '2026-10-05T09:00:00Z',
+  end_at: '2026-10-05T10:00:00Z',
+};
+describe('native virtual mutation fence', () => {
+  it('resolves full UUID identities without truncating at the first dash', () => {
+    expect(calendarEventByIdentity([virtual], virtual.id)).toBe(virtual);
+  });
+  it('rejects ordinary update/delete/drag identity paths for virtual rows and split rows', () => {
+    expect(() => assertOrdinaryCalendarEvent([virtual], virtual.id)).toThrow();
+    expect(() =>
+      assertOrdinaryCalendarEvent(
+        [{ ...virtual, id: 'split', _originalId: virtual.id }],
+        virtual.id
+      )
+    ).toThrow();
+  });
+  it('preserves ordinary event mutation behavior', () => {
+    expect(() =>
+      assertOrdinaryCalendarEvent(
+        [{ ...virtual, seriesId: undefined }],
+        virtual.id
+      )
+    ).not.toThrow();
+    expect(
+      cleanCalendarEventUpdates({
+        title: 'Title',
+        seriesId: 'injected',
+        originalStartLocal: 'injected',
+        start_at: '2026-10-05T12:00:00Z',
+      })
+    ).toEqual({ title: 'Title', start_at: '2026-10-05T12:00:00Z' });
+  });
+});

package/src/hooks/__tests__/supabase-provider.test.ts

@@ -66,9 +66,7 @@ describe('SupabaseProvider', () => {
 
     channel.trigger('SUBSCRIBED');
 
-    await Promise.resolve();
-    await Promise.resolve();
-    expect(provider.connected).toBe(true);
+    await waitFor(() => expect(provider.connected).toBe(true));
     expect(provider.synced).toBe(true);
 
     doc.getMap('prosemirror').set('text', 'hello');
@@ -165,8 +163,7 @@ describe('SupabaseProvider', () => {
     try {
       channel.trigger('SUBSCRIBED');
 
-      await Promise.resolve();
-      await Promise.resolve();
+      await vi.advanceTimersByTimeAsync(0);
       expect(provider.connected).toBe(true);
 
       const sendsBefore = channel.send.mock.calls.length;
@@ -223,8 +220,7 @@ describe('SupabaseProvider', () => {
     try {
       channel.trigger('SUBSCRIBED');
 
-      await Promise.resolve();
-      await Promise.resolve();
+      await vi.advanceTimersByTimeAsync(0);
       expect(provider.connected).toBe(true);
 
       const sendsBefore = channel.send.mock.calls.length;
@@ -353,3 +349,101 @@ describe('SupabaseProvider', () => {
     provider.destroy();
   });
 });
+
+describe('durable hydration without peer transport', () => {
+  it('loads saved content even when the channel never subscribes', async () => {
+    createRealtimeChannel();
+    const saved = new Y.Doc();
+    saved.getText('description').insert(0, 'saved text');
+    const doc = new Y.Doc();
+    const provider = new SupabaseProvider(doc, {} as any, {
+      channel: 'task-editor-offline',
+      tableName: 'tasks',
+      columnName: 'state',
+      id: 'offline',
+      loadState: async () => Array.from(Y.encodeStateAsUpdate(saved)),
+      resyncInterval: false,
+    });
+    await waitFor(() => expect(provider.hydrated).toBe(true));
+    expect(doc.getText('description').toString()).toBe('saved text');
+    expect(provider.connected).toBe(false);
+    expect(provider.synced).toBe(false);
+    provider.destroy();
+    saved.destroy();
+  });
+
+  it('coalesces startup and connection loads and ignores disconnect during hydration', async () => {
+    const channel = createRealtimeChannel();
+    let finish!: (state: number[] | null) => void;
+    const loadState = vi.fn(
+      () =>
+        new Promise<number[] | null>((resolve) => {
+          finish = resolve;
+        })
+    );
+    const provider = new SupabaseProvider(new Y.Doc(), {} as any, {
+      channel: 'task-editor-pending',
+      tableName: 'tasks',
+      columnName: 'state',
+      id: 'pending',
+      loadState,
+      resyncInterval: false,
+    });
+    channel.trigger('SUBSCRIBED');
+    channel.trigger('CLOSED');
+    finish(null);
+    await waitFor(() => expect(provider.hydrated).toBe(true));
+    expect(loadState).toHaveBeenCalledTimes(1);
+    expect(provider.connected).toBe(false);
+    provider.destroy();
+  });
+
+  it('does not hydrate a denied read and retries without unhandled rejection', async () => {
+    const channel = createRealtimeChannel();
+    const loadState = vi
+      .fn()
+      .mockRejectedValueOnce(new Error('Access denied'))
+      .mockResolvedValueOnce(null);
+    const provider = new SupabaseProvider(new Y.Doc(), {} as any, {
+      channel: 'task-editor-denied',
+      tableName: 'tasks',
+      columnName: 'state',
+      id: 'denied',
+      loadState,
+      resyncInterval: false,
+    });
+    const report = vi.fn();
+    provider.on('error', report);
+    await waitFor(() => expect(report).toHaveBeenCalledTimes(1));
+    expect(provider.hydrated).toBe(false);
+    channel.trigger('SUBSCRIBED');
+    await waitFor(() => expect(provider.connected).toBe(true));
+    expect(provider.hydrated).toBe(true);
+    provider.destroy();
+  });
+
+  it('ignores a durable read completing after teardown', async () => {
+    createRealtimeChannel();
+    let finish!: (state: number[] | null) => void;
+    const doc = new Y.Doc();
+    const provider = new SupabaseProvider(doc, {} as any, {
+      channel: 'task-editor-old',
+      tableName: 'tasks',
+      columnName: 'state',
+      id: 'old',
+      loadState: () =>
+        new Promise((resolve) => {
+          finish = resolve;
+        }),
+      resyncInterval: false,
+    });
+    const apply = vi.fn();
+    doc.on('update', apply);
+    provider.destroy();
+    finish(null);
+    await Promise.resolve();
+    await Promise.resolve();
+    expect(provider.hydrated).toBe(false);
+    expect(apply).not.toHaveBeenCalled();
+  });
+});

package/src/hooks/__tests__/use-calendar-readonly.test.tsx

@@ -530,4 +530,31 @@ describe('CalendarProvider Read-Only Mode', () => {
       baseEvent,
     ]);
   });
+  it('blocks ordinary update/delete/drag writes for native recurrence occurrences', async () => {
+    const occurrence = {
+      ...baseEvent,
+      seriesId: 'series',
+      seriesRevision: 3,
+      originalStartLocal: '2026-06-22T09:00:00',
+    };
+    calendarMockState.events = [occurrence];
+    const { result } = renderHook(() => useCalendar(), {
+      wrapper: createWrapper(),
+    });
+    await expect(
+      result.current.updateEvent(occurrence.id, {
+        start_at: '2026-06-23T09:00:00Z',
+      })
+    ).rejects.toThrow('explicit series edit scope');
+    await expect(result.current.deleteEvent(occurrence.id)).rejects.toThrow(
+      'explicit series edit scope'
+    );
+    expect(
+      internalApiMocks.updateWorkspaceCalendarEvent
+    ).not.toHaveBeenCalled();
+    expect(
+      internalApiMocks.deleteWorkspaceCalendarEvent
+    ).not.toHaveBeenCalled();
+    expect(result.current.isEventReadOnly(occurrence)).toBe(true);
+  });
 });

package/src/hooks/__tests__/use-local-storage.test.tsx

@@ -147,6 +147,48 @@ describe('useLocalStorage', () => {
   });
 
   describe('error handling', () => {
+    it('completes initialization with defaults when getItem is denied', () => {
+      vi.spyOn(window.localStorage, 'getItem').mockImplementation(() => {
+        throw new DOMException('Synthetic denied read', 'SecurityError');
+      });
+      const { result } = renderHook(() =>
+        useLocalStorage('invoice-compact-view', false)
+      );
+      expect(result.current).toEqual([false, expect.any(Function), true]);
+      expect(console.error).toHaveBeenCalledWith(
+        'Unable to read browser preferences.'
+      );
+      act(() => result.current[1](true));
+      expect(result.current[0]).toBe(true);
+    });
+
+    it('completes initialization when the storage getter itself is denied', () => {
+      const storage = window.localStorage;
+      Object.defineProperty(window, 'localStorage', {
+        configurable: true,
+        get() {
+          throw new DOMException('Synthetic denied getter', 'SecurityError');
+        },
+      });
+      try {
+        const { result } = renderHook(() =>
+          useLocalStorage('printAfterCreate', true)
+        );
+        expect(result.current).toEqual([true, expect.any(Function), true]);
+        act(() => result.current[1](false));
+        expect(result.current[0]).toBe(false);
+        expect(console.error).toHaveBeenLastCalledWith(
+          'Unable to save browser preferences.'
+        );
+      } finally {
+        Object.defineProperty(window, 'localStorage', {
+          configurable: true,
+          writable: true,
+          value: storage,
+        });
+      }
+    });
+
     it('should handle invalid JSON in localStorage gracefully', () => {
       window.localStorage.setItem(TEST_KEY, 'invalid-json');