@tuturuuu/ui 0.16.0 → 0.18.0

package/src/components/ui/tu-do/boards/board-share-settings-panel.tsx

@@ -1,351 +0,0 @@
-'use client';
-
-import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';
-import { Loader2, Trash2, Users } from '@tuturuuu/icons';
-import {
-  createWorkspaceTaskBoardShare,
-  deleteWorkspaceTaskBoardShare,
-  listWorkspaceTaskBoardShares,
-  listWorkspaceTaskBoardViewableMembers,
-  updateWorkspaceTaskBoardShare,
-  type WorkspaceTaskBoardShare,
-  type WorkspaceTaskBoardSharePermission,
-  type WorkspaceTaskBoardViewableMember,
-} from '@tuturuuu/internal-api/tasks';
-import type { WorkspaceTaskBoard } from '@tuturuuu/types';
-import { Avatar, AvatarFallback, AvatarImage } from '@tuturuuu/ui/avatar';
-import { Badge } from '@tuturuuu/ui/badge';
-import { Button } from '@tuturuuu/ui/button';
-import { Combobox } from '@tuturuuu/ui/custom/combobox';
-import { Input } from '@tuturuuu/ui/input';
-import { getInitials } from '@tuturuuu/utils/name-helper';
-import { useTranslations } from 'next-intl';
-import { useState } from 'react';
-import { toast } from 'sonner';
-import { BoardPublicLinkSection } from './board-public-link-section';
-import { ShareSection } from './share-section';
-
-interface BoardShareSettingsPanelProps {
-  board: Pick<WorkspaceTaskBoard, 'id' | 'name'>;
-  enabled?: boolean;
-  wsId: string;
-}
-
-function shareDisplayName(share: WorkspaceTaskBoardShare) {
-  return (
-    share.user?.display_name ||
-    (share.user?.handle ? `@${share.user.handle}` : null) ||
-    share.email ||
-    share.user_id ||
-    'Guest'
-  );
-}
-
-function viewableMemberDisplayName(member: WorkspaceTaskBoardViewableMember) {
-  return (
-    member.display_name ||
-    (member.handle ? `@${member.handle}` : null) ||
-    member.email ||
-    member.user_id
-  );
-}
-
-export function BoardShareSettingsPanel({
-  board,
-  enabled = true,
-  wsId,
-}: BoardShareSettingsPanelProps) {
-  const t = useTranslations();
-  const queryClient = useQueryClient();
-  const [email, setEmail] = useState('');
-  const [permission, setPermission] =
-    useState<WorkspaceTaskBoardSharePermission>('view');
-  const [membersOpen, setMembersOpen] = useState(false);
-  const [guestsOpen, setGuestsOpen] = useState(false);
-
-  const queryKey = ['task-board-shares', wsId, board.id] as const;
-  const sharesQuery = useQuery({
-    queryKey,
-    queryFn: () => listWorkspaceTaskBoardShares(wsId, board.id),
-    enabled,
-  });
-  const viewableMembersQuery = useQuery({
-    queryKey: ['task-board-viewable-members', wsId, board.id] as const,
-    queryFn: () => listWorkspaceTaskBoardViewableMembers(wsId, board.id),
-    enabled: enabled && membersOpen,
-    staleTime: 60_000,
-  });
-
-  const createMutation = useMutation({
-    mutationFn: () =>
-      createWorkspaceTaskBoardShare(wsId, board.id, {
-        email,
-        permission,
-      }),
-    onSuccess: () => {
-      setEmail('');
-      setPermission('view');
-      void queryClient.invalidateQueries({ queryKey });
-      toast.success(t('ws-task-boards.share.saved'));
-    },
-    onError: () => {
-      toast.error(t('common.error'));
-    },
-  });
-
-  const updateMutation = useMutation({
-    mutationFn: ({
-      nextPermission,
-      shareId,
-    }: {
-      nextPermission: WorkspaceTaskBoardSharePermission;
-      shareId: string;
-    }) =>
-      updateWorkspaceTaskBoardShare(wsId, board.id, {
-        shareId,
-        permission: nextPermission,
-      }),
-    onSuccess: () => {
-      void queryClient.invalidateQueries({ queryKey });
-    },
-    onError: () => {
-      toast.error(t('common.error'));
-    },
-  });
-
-  const deleteMutation = useMutation({
-    mutationFn: (shareId: string) =>
-      deleteWorkspaceTaskBoardShare(wsId, board.id, shareId),
-    onSuccess: () => {
-      void queryClient.invalidateQueries({ queryKey });
-      toast.success(t('ws-task-boards.share.removed'));
-    },
-    onError: () => {
-      toast.error(t('common.error'));
-    },
-  });
-
-  const shares = sharesQuery.data?.shares ?? [];
-  const members = Array.isArray(viewableMembersQuery.data?.members)
-    ? viewableMembersQuery.data.members
-    : undefined;
-  const membersCount = members?.length;
-  const membersStatusBadge = viewableMembersQuery.isLoading ? (
-    <Badge variant="secondary" className="gap-1 px-2 py-0.5 text-[10px]">
-      <Loader2 className="h-3 w-3 animate-spin" />
-      {t('common.loading')}
-    </Badge>
-  ) : typeof membersCount === 'number' ? (
-    <Badge variant="secondary" className="px-2 py-0.5 text-[10px]">
-      {membersCount}
-    </Badge>
-  ) : (
-    <Badge variant="outline" className="px-2 py-0.5 text-[10px]">
-      {t('common.workspace')}
-    </Badge>
-  );
-  const guestsStatusBadge = sharesQuery.isLoading ? (
-    <Badge variant="secondary" className="gap-1 px-2 py-0.5 text-[10px]">
-      <Loader2 className="h-3 w-3 animate-spin" />
-      {t('common.loading')}
-    </Badge>
-  ) : shares.length ? (
-    <Badge variant="secondary" className="px-2 py-0.5 text-[10px]">
-      {shares.length}
-    </Badge>
-  ) : (
-    <Badge variant="outline" className="px-2 py-0.5 text-[10px]">
-      {t('common.none')}
-    </Badge>
-  );
-  const canSubmit =
-    email.trim().length > 0 &&
-    !createMutation.isPending &&
-    !sharesQuery.isLoading;
-  const permissionOptions = [
-    {
-      value: 'view',
-      label: t('ws-task-boards.share.permission.view'),
-    },
-    {
-      value: 'edit',
-      label: t('ws-task-boards.share.permission.edit'),
-    },
-  ];
-
-  return (
-    <div className="space-y-2">
-      <BoardPublicLinkSection boardId={board.id} open={enabled} wsId={wsId} />
-
-      <ShareSection
-        open={membersOpen}
-        onOpenChange={setMembersOpen}
-        title={t('ws-task-boards.share.workspace_members.title')}
-        tooltip={t('ws-task-boards.share.workspace_members.tooltip')}
-        icon={<Users className="h-4 w-4 text-muted-foreground" />}
-        statusBadge={membersStatusBadge}
-      >
-        {viewableMembersQuery.isLoading ? (
-          <div className="flex items-center gap-2 text-muted-foreground text-sm">
-            <Loader2 className="h-4 w-4 animate-spin" />
-            {t('common.loading')}
-          </div>
-        ) : (members ?? []).length === 0 ? (
-          <div className="text-muted-foreground text-sm">
-            {t('ws-task-boards.share.workspace_members.empty')}
-          </div>
-        ) : (
-          <div className="divide-y rounded-md border">
-            {members?.map((member) => (
-              <div
-                key={member.user_id}
-                className="flex flex-col gap-3 p-3 sm:flex-row sm:items-center"
-              >
-                <div className="flex min-w-0 flex-1 items-center gap-3">
-                  <Avatar className="h-8 w-8">
-                    <AvatarImage src={member.avatar_url ?? undefined} />
-                    <AvatarFallback>
-                      {getInitials(viewableMemberDisplayName(member))}
-                    </AvatarFallback>
-                  </Avatar>
-                  <div className="min-w-0">
-                    <div className="truncate font-medium text-sm">
-                      {viewableMemberDisplayName(member)}
-                    </div>
-                    <div className="truncate text-muted-foreground text-xs">
-                      {member.email || member.user_id}
-                    </div>
-                  </div>
-                </div>
-                <div className="flex flex-wrap items-center gap-1.5">
-                  {member.is_creator && (
-                    <Badge variant="secondary">
-                      {t('ws-task-boards.share.workspace_members.creator')}
-                    </Badge>
-                  )}
-                  {member.roles.slice(0, 2).map((role) => (
-                    <Badge key={role.id} variant="outline">
-                      {role.name}
-                    </Badge>
-                  ))}
-                  <Badge variant="outline">
-                    {t('ws-task-boards.share.workspace_members.badge')}
-                  </Badge>
-                </div>
-              </div>
-            ))}
-          </div>
-        )}
-      </ShareSection>
-
-      <ShareSection
-        open={guestsOpen}
-        onOpenChange={setGuestsOpen}
-        title={t('ws-task-boards.share.guests.title')}
-        tooltip={t('ws-task-boards.share.guests.tooltip')}
-        icon={<Users className="h-4 w-4 text-muted-foreground" />}
-        statusBadge={guestsStatusBadge}
-      >
-        <div className="space-y-3">
-          <div className="grid gap-2 sm:grid-cols-[1fr_8rem_auto]">
-            <Input
-              type="email"
-              value={email}
-              onChange={(event) => setEmail(event.target.value)}
-              placeholder={t('ws-task-boards.share.email_placeholder')}
-            />
-            <Combobox
-              mode="single"
-              options={permissionOptions}
-              selected={permission}
-              onChange={(value) =>
-                setPermission(value as WorkspaceTaskBoardSharePermission)
-              }
-              placeholder={t('ws-task-boards.share.permission.view')}
-              searchPlaceholder={t('common.search_members')}
-              className="[&_button]:h-9"
-            />
-            <Button
-              type="button"
-              onClick={() => createMutation.mutate()}
-              disabled={!canSubmit}
-            >
-              {createMutation.isPending ? (
-                <Loader2 className="h-4 w-4 animate-spin" />
-              ) : (
-                t('common.share')
-              )}
-            </Button>
-          </div>
-
-          {sharesQuery.isLoading ? (
-            <div className="rounded-md border border-dashed p-4 text-muted-foreground text-sm">
-              {t('common.loading')}
-            </div>
-          ) : shares.length === 0 ? (
-            <div className="rounded-md border border-dashed p-4 text-muted-foreground text-sm">
-              {t('ws-task-boards.share.empty')}
-            </div>
-          ) : (
-            <div className="divide-y rounded-md border">
-              {shares.map((share) => (
-                <div
-                  key={share.id}
-                  className="flex flex-col gap-3 p-3 sm:flex-row sm:items-center"
-                >
-                  <div className="flex min-w-0 flex-1 items-center gap-3">
-                    <Avatar className="h-8 w-8">
-                      <AvatarImage src={share.user?.avatar_url ?? undefined} />
-                      <AvatarFallback>
-                        {getInitials(shareDisplayName(share))}
-                      </AvatarFallback>
-                    </Avatar>
-                    <div className="min-w-0">
-                      <div className="truncate font-medium text-sm">
-                        {shareDisplayName(share)}
-                      </div>
-                      <div className="truncate text-muted-foreground text-xs">
-                        {share.email || share.user_id}
-                      </div>
-                    </div>
-                  </div>
-
-                  <Badge variant="outline" className="w-fit">
-                    {t('common.guest_access')}
-                  </Badge>
-
-                  <Combobox
-                    mode="single"
-                    options={permissionOptions}
-                    selected={share.permission}
-                    onChange={(value) =>
-                      updateMutation.mutate({
-                        shareId: share.id,
-                        nextPermission:
-                          value as WorkspaceTaskBoardSharePermission,
-                      })
-                    }
-                    placeholder={t('ws-task-boards.share.permission.view')}
-                    searchPlaceholder={t('common.search_members')}
-                    className="w-28 [&_button]:h-9"
-                  />
-
-                  <Button
-                    type="button"
-                    variant="ghost"
-                    size="icon"
-                    onClick={() => deleteMutation.mutate(share.id)}
-                    disabled={deleteMutation.isPending}
-                    aria-label={t('common.remove')}
-                  >
-                    <Trash2 className="h-4 w-4" />
-                  </Button>
-                </div>
-              ))}
-            </div>
-          )}
-        </div>
-      </ShareSection>
-    </div>
-  );
-}

package/src/components/ui/tu-do/boards/boardId/__tests__/list-actions.test.tsx

@@ -1,199 +0,0 @@
-import '@testing-library/jest-dom';
-import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
-import { fireEvent, render, screen, waitFor } from '@testing-library/react';
-import type { Task } from '@tuturuuu/types/primitives/Task';
-import type { TaskList } from '@tuturuuu/types/primitives/TaskList';
-import { toast } from '@tuturuuu/ui/sonner';
-import type React from 'react';
-import { beforeEach, describe, expect, it, vi } from 'vitest';
-import { ListActions } from '../list-actions';
-
-const updateWorkspaceTaskListMock = vi.fn();
-const broadcastMock = vi.fn();
-const moveAllTasksFromListMock = vi.fn();
-
-vi.mock('next-intl', () => ({
-  useTranslations: () => (key: string) => key,
-}));
-
-vi.mock('@tuturuuu/internal-api/tasks', () => ({
-  createWorkspaceTaskList: vi.fn(),
-  listWorkspaceTaskLists: vi.fn(),
-  updateWorkspaceTaskList: (...args: unknown[]) =>
-    updateWorkspaceTaskListMock(...args),
-}));
-
-vi.mock('@tuturuuu/utils/task-helper', () => ({
-  useMoveAllTasksFromList: () => ({
-    isPending: false,
-    mutateAsync: (...args: unknown[]) => moveAllTasksFromListMock(...args),
-  }),
-}));
-
-vi.mock('../../../shared/board-broadcast-context', () => ({
-  useBoardBroadcast: () => broadcastMock,
-}));
-
-vi.mock('../board-selector', () => ({
-  BoardSelector: () => null,
-}));
-
-vi.mock('@tuturuuu/ui/sonner', () => ({
-  toast: {
-    error: vi.fn(),
-    info: vi.fn(),
-    success: vi.fn(),
-    warning: vi.fn(),
-  },
-}));
-
-vi.mock('@tuturuuu/ui/dropdown-menu', () => ({
-  DropdownMenu: ({ children }: { children: React.ReactNode }) => (
-    <>{children}</>
-  ),
-  DropdownMenuTrigger: ({ children }: { children: React.ReactNode }) => (
-    <>{children}</>
-  ),
-  DropdownMenuContent: ({ children }: { children: React.ReactNode }) => (
-    <>{children}</>
-  ),
-  DropdownMenuItem: ({
-    children,
-    onClick,
-  }: {
-    children: React.ReactNode;
-    onClick?: () => void;
-  }) => (
-    <button type="button" onClick={onClick}>
-      {children}
-    </button>
-  ),
-  DropdownMenuSeparator: () => null,
-}));
-
-const baseList: TaskList = {
-  archived: false,
-  board_id: 'board-1',
-  color: 'BLUE',
-  created_at: '2026-03-07T00:00:00.000Z',
-  creator_id: 'user-1',
-  deleted: false,
-  id: 'list-1',
-  name: 'To Do',
-  position: 0,
-  status: 'not_started',
-};
-
-const baseTask: Task = {
-  assignees: [],
-  created_at: '2026-03-07T00:00:00.000Z',
-  display_number: 1,
-  end_date: null,
-  id: 'task-1',
-  labels: [],
-  list_id: 'list-1',
-  name: 'Ship board updates',
-  priority: 'normal',
-  sort_key: 1,
-  start_date: undefined,
-};
-
-function renderListActions(options?: {
-  tasks?: Task[];
-  isEditOpen?: boolean;
-  onEditOpenChange?: (open: boolean) => void;
-}) {
-  const queryClient = new QueryClient({
-    defaultOptions: {
-      queries: {
-        retry: false,
-      },
-    },
-  });
-
-  queryClient.setQueryData(['task_lists', 'board-1'], [baseList]);
-  queryClient.setQueryData(['tasks', 'board-1'], options?.tasks ?? []);
-
-  const result = render(
-    <QueryClientProvider client={queryClient}>
-      <ListActions
-        listId="list-1"
-        listName="To Do"
-        listStatus="not_started"
-        tasks={options?.tasks ?? []}
-        boardId="board-1"
-        wsId="ws-1"
-        onUpdate={vi.fn()}
-        isEditOpen={options?.isEditOpen ?? false}
-        onEditOpenChange={options?.onEditOpenChange ?? vi.fn()}
-      />
-    </QueryClientProvider>
-  );
-
-  return {
-    ...result,
-    queryClient,
-  };
-}
-
-describe('ListActions', () => {
-  beforeEach(() => {
-    updateWorkspaceTaskListMock.mockReset();
-    broadcastMock.mockReset();
-    moveAllTasksFromListMock.mockReset();
-    vi.mocked(toast.error).mockReset();
-    vi.mocked(toast.success).mockReset();
-    vi.mocked(toast.info).mockReset();
-    vi.mocked(toast.warning).mockReset();
-  });
-
-  it('rolls back an optimistic rename when the mutation fails', async () => {
-    updateWorkspaceTaskListMock.mockRejectedValueOnce(
-      new Error('Rename failed')
-    );
-
-    const onEditOpenChange = vi.fn();
-    const { queryClient } = renderListActions({
-      isEditOpen: true,
-      onEditOpenChange,
-    });
-
-    fireEvent.change(screen.getByPlaceholderText('list_name'), {
-      target: { value: 'Doing' },
-    });
-    fireEvent.click(screen.getByText('save_changes'));
-
-    await waitFor(() => {
-      expect(
-        queryClient.getQueryData<TaskList[]>(['task_lists', 'board-1'])
-      ).toEqual([baseList]);
-    });
-
-    expect(onEditOpenChange).not.toHaveBeenCalledWith(false);
-    expect(toast.error).toHaveBeenCalledWith('Rename failed');
-  });
-
-  it('removes the list and its tasks from cache and broadcasts delete on success', async () => {
-    updateWorkspaceTaskListMock.mockResolvedValueOnce({ list: baseList });
-
-    const { queryClient } = renderListActions({
-      tasks: [baseTask],
-    });
-
-    fireEvent.click(screen.getAllByRole('button', { name: 'delete' })[0]!);
-    fireEvent.click(screen.getAllByRole('button', { name: 'delete' }).at(-1)!);
-
-    await waitFor(() => {
-      expect(
-        queryClient.getQueryData<TaskList[]>(['task_lists', 'board-1'])
-      ).toEqual([]);
-      expect(queryClient.getQueryData<Task[]>(['tasks', 'board-1'])).toEqual(
-        []
-      );
-    });
-
-    expect(broadcastMock).toHaveBeenCalledWith('list:delete', {
-      listId: 'list-1',
-    });
-  });
-});

package/src/components/ui/tu-do/boards/boardId/board-column-external-retry.test.tsx

@@ -1,127 +0,0 @@
-/**
- * @vitest-environment jsdom
- */
-
-import { act, render, waitFor } from '@testing-library/react';
-import type { TaskList } from '@tuturuuu/types/primitives/TaskList';
-import { beforeEach, describe, expect, it, vi } from 'vitest';
-import type { ListPaginationState } from '../../shared/progressive-loader-context';
-import { BoardColumn } from './board-column';
-
-const mocks = vi.hoisted(() => ({
-  createTask: vi.fn(),
-  loadListPage: vi.fn(),
-  pagination: {} as Record<string, ListPaginationState>,
-}));
-
-vi.mock('@dnd-kit/sortable', () => ({
-  useSortable: () => ({
-    attributes: {},
-    isDragging: false,
-    listeners: {},
-    setNodeRef: vi.fn(),
-    transform: null,
-    transition: null,
-  }),
-}));
-
-vi.mock('@dnd-kit/utilities', () => ({
-  CSS: {
-    Transform: {
-      toString: () => '',
-    },
-  },
-}));
-
-vi.mock('next-intl', () => ({
-  useTranslations: () => (key: string, values?: Record<string, string>) =>
-    values?.name ? `${key}:${values.name}` : key,
-}));
-
-vi.mock('../../hooks/useTaskDialog', () => ({
-  useTaskDialog: () => ({
-    createTask: mocks.createTask,
-  }),
-}));
-
-vi.mock('../../shared/progressive-loader-context', () => ({
-  useProgressiveLoader: () => ({
-    loadListPage: mocks.loadListPage,
-    pagination: mocks.pagination,
-    revalidateLoadedLists: vi.fn(),
-  }),
-}));
-
-vi.mock('./list-actions', () => ({
-  ListActions: () => <div data-testid="list-actions" />,
-}));
-
-vi.mock('./task-list', () => ({
-  VirtualizedTaskList: () => <div data-testid="task-list" />,
-}));
-
-const externalColumn: TaskList = {
-  archived: false,
-  board_id: 'board-1',
-  color: 'CYAN',
-  created_at: '2026-06-16T00:00:00.000Z',
-  creator_id: 'user-1',
-  deleted: false,
-  id: 'personal-external-staging:board-1',
-  is_external_staging: true,
-  name: 'External tasks',
-  position: 0,
-  status: 'active',
-};
-
-const loadedExternalState: ListPaginationState = {
-  hasMore: true,
-  isInitialLoad: false,
-  isLoading: false,
-  page: 0,
-  totalCount: 0,
-};
-
-function renderExternalColumn() {
-  return (
-    <BoardColumn
-      boardId="board-1"
-      column={externalColumn}
-      tasks={[]}
-      wsId="personal"
-    />
-  );
-}
-
-describe('BoardColumn external lane retry behavior', () => {
-  beforeEach(() => {
-    vi.clearAllMocks();
-    mocks.pagination = {
-      [externalColumn.id]: loadedExternalState,
-    };
-    mocks.loadListPage.mockRejectedValue(
-      new Error('external lane unavailable')
-    );
-  });
-
-  it('does not immediately retry the same failed external-options signature', async () => {
-    const { rerender } = render(renderExternalColumn());
-
-    await waitFor(() => {
-      expect(mocks.loadListPage).toHaveBeenCalledTimes(1);
-    });
-
-    await act(async () => {
-      await Promise.resolve();
-      rerender(renderExternalColumn());
-      await Promise.resolve();
-    });
-
-    expect(mocks.loadListPage).toHaveBeenCalledTimes(1);
-    expect(mocks.loadListPage).toHaveBeenCalledWith(externalColumn.id, 0, {
-      externalIncludeDocuments: false,
-      externalIncludeDoneClosed: false,
-      externalSortBy: 'created-desc',
-    });
-  });
-});