@tuturuuu/ui 0.7.0 → 0.9.0

package/src/components/ui/tu-do/initiatives/task-initiatives-client.tsx

@@ -13,6 +13,15 @@ import {
   Trash2,
   User,
 } from '@tuturuuu/icons';
+import {
+  createWorkspaceTaskInitiative,
+  deleteWorkspaceTaskInitiative,
+  linkWorkspaceTaskInitiativeProject,
+  listWorkspaceTaskInitiatives,
+  listWorkspaceTaskProjects,
+  unlinkWorkspaceTaskInitiativeProject,
+  updateWorkspaceTaskInitiative,
+} from '@tuturuuu/internal-api/tasks';
 import { Badge } from '@tuturuuu/ui/badge';
 import { Button } from '@tuturuuu/ui/button';
 import {
@@ -98,6 +107,12 @@ const STATUS_BADGE_CLASS: Record<InitiativeStatus, string> = {
   cancelled: 'bg-dynamic-red/15 text-dynamic-red border-transparent',
 };
 
+function getBrowserInternalApiOptions() {
+  return typeof window !== 'undefined'
+    ? { baseUrl: window.location.origin }
+    : undefined;
+}
+
 export function TaskInitiativesClient({
   wsId,
   initialInitiatives,
@@ -136,16 +151,8 @@ export function TaskInitiativesClient({
     refetch: refetchInitiatives,
   } = useQuery<TaskInitiative[]>({
     queryKey: ['workspace', wsId, 'task-initiatives'],
-    queryFn: async () => {
-      const response = await fetch(
-        `/api/v1/workspaces/${wsId}/task-initiatives`,
-        { cache: 'no-store' }
-      );
-      if (!response.ok) {
-        throw new Error(t('errors.fetch_initiatives'));
-      }
-      return response.json();
-    },
+    queryFn: () =>
+      listWorkspaceTaskInitiatives(wsId, getBrowserInternalApiOptions()),
     initialData: initialInitiatives,
     staleTime: 30_000,
   });
@@ -157,20 +164,12 @@ export function TaskInitiativesClient({
   } = useQuery<TaskProjectOption[]>({
     queryKey: ['workspace', wsId, 'task-projects-for-initiatives'],
     queryFn: async () => {
-      const response = await fetch(`/api/v1/workspaces/${wsId}/task-projects`, {
-        cache: 'no-store',
-      });
-      if (!response.ok) {
-        throw new Error(t('errors.fetch_projects'));
-      }
-      const rawProjects = await response.json();
-      return (
-        rawProjects as Array<{
-          id: string;
-          name: string;
-          status?: string | null;
-        }>
-      ).map((project) => ({
+      const rawProjects = await listWorkspaceTaskProjects(
+        wsId,
+        getBrowserInternalApiOptions()
+      );
+
+      return rawProjects.map((project) => ({
         id: project.id,
         name: project.name,
         status: project.status ?? null,
@@ -218,19 +217,13 @@ export function TaskInitiativesClient({
       description?: string;
       status: InitiativeStatus;
     }) => {
-      const response = await fetch(
-        `/api/v1/workspaces/${wsId}/task-initiatives`,
-        {
-          method: 'POST',
-          headers: { 'Content-Type': 'application/json' },
-          body: JSON.stringify({ name, description, status }),
-        }
+      const payload = { name, description: description ?? '', status };
+
+      return createWorkspaceTaskInitiative(
+        wsId,
+        payload,
+        getBrowserInternalApiOptions()
       );
-      if (!response.ok) {
-        const errorData = await response.json().catch(() => ({}));
-        throw new Error(errorData.error || t('errors.create_initiative'));
-      }
-      return response.json();
     },
     onSuccess: () => {
       toast.success(t('success.initiative_created'));
@@ -257,19 +250,14 @@ export function TaskInitiativesClient({
       description?: string;
       status: InitiativeStatus;
     }) => {
-      const response = await fetch(
-        `/api/v1/workspaces/${wsId}/task-initiatives/${initiativeId}`,
-        {
-          method: 'PUT',
-          headers: { 'Content-Type': 'application/json' },
-          body: JSON.stringify({ name, description, status }),
-        }
+      const payload = { name, description: description ?? '', status };
+
+      return updateWorkspaceTaskInitiative(
+        wsId,
+        initiativeId,
+        payload,
+        getBrowserInternalApiOptions()
       );
-      if (!response.ok) {
-        const errorData = await response.json().catch(() => ({}));
-        throw new Error(errorData.error || t('errors.update_initiative'));
-      }
-      return response.json();
     },
     onSuccess: () => {
       toast.success(t('success.initiative_updated'));
@@ -286,18 +274,12 @@ export function TaskInitiativesClient({
   });
 
   const deleteInitiativeMutation = useMutation({
-    mutationFn: async (initiativeId: string) => {
-      const response = await fetch(
-        `/api/v1/workspaces/${wsId}/task-initiatives/${initiativeId}`,
-        {
-          method: 'DELETE',
-        }
-      );
-      if (!response.ok) {
-        const errorData = await response.json().catch(() => ({}));
-        throw new Error(errorData.error || t('errors.delete_initiative'));
-      }
-    },
+    mutationFn: (initiativeId: string) =>
+      deleteWorkspaceTaskInitiative(
+        wsId,
+        initiativeId,
+        getBrowserInternalApiOptions()
+      ),
     onSuccess: () => {
       toast.success(t('success.initiative_deleted'));
       refetchInitiatives();
@@ -314,21 +296,13 @@ export function TaskInitiativesClient({
     }: {
       initiativeId: string;
       projectId: string;
-    }) => {
-      const response = await fetch(
-        `/api/v1/workspaces/${wsId}/task-initiatives/${initiativeId}/projects`,
-        {
-          method: 'POST',
-          headers: { 'Content-Type': 'application/json' },
-          body: JSON.stringify({ projectId }),
-        }
-      );
-      if (!response.ok) {
-        const errorData = await response.json().catch(() => ({}));
-        throw new Error(errorData.error || t('errors.link_project'));
-      }
-      return response.json();
-    },
+    }) =>
+      linkWorkspaceTaskInitiativeProject(
+        wsId,
+        initiativeId,
+        projectId,
+        getBrowserInternalApiOptions()
+      ),
     onSuccess: (_data, variables) => {
       toast.success(t('success.project_linked'));
       setProjectToLink('');
@@ -362,19 +336,13 @@ export function TaskInitiativesClient({
     }: {
       initiativeId: string;
       projectId: string;
-    }) => {
-      const response = await fetch(
-        `/api/v1/workspaces/${wsId}/task-initiatives/${initiativeId}/projects/${projectId}`,
-        {
-          method: 'DELETE',
-        }
-      );
-      if (!response.ok) {
-        const errorData = await response.json().catch(() => ({}));
-        throw new Error(errorData.error || t('errors.unlink_project'));
-      }
-      return response.json();
-    },
+    }) =>
+      unlinkWorkspaceTaskInitiativeProject(
+        wsId,
+        initiativeId,
+        projectId,
+        getBrowserInternalApiOptions()
+      ),
     onSuccess: (_data, variables) => {
       toast.success(t('success.project_unlinked'));
       if (variables) {

package/src/components/ui/tu-do/my-tasks/my-tasks-content.tsx

@@ -20,12 +20,30 @@ import { TaskPreviewDialog } from './task-preview-dialog';
 import { useMyTasksState } from './use-my-tasks-state';
 
 interface MyTasksContentProps {
+  disableAutoCreateBoard?: boolean;
+  embedded?: boolean;
+  initialBoard?: {
+    id: string;
+    name: string | null;
+  };
+  initialListId?: string;
+  initialLists?: Array<{
+    deleted?: boolean | null;
+    id: string;
+    name: string | null;
+    position?: number | null;
+  }>;
   wsId: string;
   userId: string;
   isPersonal: boolean;
 }
 
 export default function MyTasksContent({
+  disableAutoCreateBoard = false,
+  embedded = false,
+  initialBoard,
+  initialListId,
+  initialLists,
   wsId,
   userId,
   isPersonal,
@@ -40,13 +58,17 @@ export default function MyTasksContent({
     'enter'
   );
   const state = useMyTasksState({
+    ...(disableAutoCreateBoard ? { disableAutoCreateBoard } : {}),
+    ...(initialBoard ? { initialBoard } : {}),
+    ...(initialListId ? { initialListId } : {}),
+    ...(initialLists ? { initialLists } : {}),
     wsId,
     userId,
     isPersonal,
   });
 
   return (
-    <div className="space-y-4 md:space-y-6">
+    <div className={embedded ? 'space-y-4' : 'space-y-4 md:space-y-6'}>
       {/* Header with greeting + summary cards */}
       <MyTasksHeader
         overdueCount={state.filteredTasks.overdueTasks?.length ?? 0}
@@ -55,7 +77,9 @@ export default function MyTasksContent({
       />
 
       {/* Command Bar */}
-      <div className="mx-auto mb-32 max-w-5xl">
+      <div
+        className={embedded ? 'mx-auto max-w-5xl' : 'mx-auto mb-32 max-w-5xl'}
+      >
         <CommandBar
           value={state.commandBarInput}
           onValueChange={state.setCommandBarInput}

package/src/components/ui/tu-do/my-tasks/use-my-tasks-state.ts

@@ -39,12 +39,28 @@ dayjs.extend(utc);
 dayjs.extend(timezone);
 
 interface UseMyTasksStateProps {
+  disableAutoCreateBoard?: boolean;
+  initialBoard?: {
+    id: string;
+    name: string | null;
+  };
+  initialListId?: string;
+  initialLists?: Array<{
+    deleted?: boolean | null;
+    id: string;
+    name: string | null;
+    position?: number | null;
+  }>;
   wsId: string;
   userId: string;
   isPersonal: boolean;
 }
 
 export function useMyTasksState({
+  disableAutoCreateBoard = false,
+  initialBoard,
+  initialListId,
+  initialLists,
   wsId,
   userId,
   isPersonal,
@@ -96,8 +112,16 @@ export function useMyTasksState({
   // Board selector state
   const [boardSelectorOpen, setBoardSelectorOpen] = useState(false);
   const [selectedWorkspaceId, setSelectedWorkspaceId] = useState<string>(wsId);
-  const [selectedBoardId, setSelectedBoardId] = useState<string>('');
-  const [selectedListId, setSelectedListId] = useState<string>('');
+  const [selectedBoardId, setSelectedBoardId] = useState<string>(
+    initialBoard?.id ?? ''
+  );
+  const [selectedListId, setSelectedListId] = useState<string>(
+    initialListId ??
+      initialLists
+        ?.filter((list) => !list.deleted)
+        .sort((a, b) => (a.position ?? 0) - (b.position ?? 0))[0]?.id ??
+      ''
+  );
   const [newBoardDialogOpen, setNewBoardDialogOpen] = useState(false);
   const [newBoardName, setNewBoardName] = useState<string>('');
   const [newListDialogOpen, setNewListDialogOpen] = useState(false);
@@ -276,6 +300,7 @@ export function useMyTasksState({
       });
       return payload.count ?? 0;
     },
+    enabled: !disableAutoCreateBoard,
   });
 
   // Auto-create a board if the workspace has none
@@ -294,7 +319,13 @@ export function useMyTasksState({
   );
 
   useEffect(() => {
-    if (wsBoardCountLoading || wsBoardCount === undefined) return;
+    if (
+      disableAutoCreateBoard ||
+      wsBoardCountLoading ||
+      wsBoardCount === undefined
+    ) {
+      return;
+    }
     if (wsBoardCount > 0) return;
     if (autoCreateAttemptedRef.current) return;
     autoCreateAttemptedRef.current = true;
@@ -344,6 +375,7 @@ export function useMyTasksState({
     queryClient,
     defaultBoardName,
     defaultListNames,
+    disableAutoCreateBoard,
   ]);
 
   // Fetch boards with lists for selected workspace
@@ -422,11 +454,16 @@ export function useMyTasksState({
   const availableLists = useMemo(() => {
     if (!selectedBoardId) return [];
     const board = boardsData.find((b: any) => b.id === selectedBoardId);
-    if (!board?.task_lists) return [];
+    if (!board?.task_lists) {
+      if (selectedBoardId !== initialBoard?.id) return [];
+      return (initialLists ?? [])
+        .filter((list) => !list.deleted)
+        .sort((a, b) => (a.position ?? 0) - (b.position ?? 0));
+    }
     return (board.task_lists as any[])
       .filter((l: any) => !l.deleted)
       .sort((a: any, b: any) => (a.position || 0) - (b.position || 0));
-  }, [selectedBoardId, boardsData]);
+  }, [selectedBoardId, boardsData, initialBoard?.id, initialLists]);
 
   const hasValidSelectedList = useMemo(
     () => availableLists.some((list: any) => list.id === selectedListId),
@@ -794,13 +831,23 @@ export function useMyTasksState({
   const selectedDestination = useMemo(() => {
     if (!selectedBoardId || !selectedListId) return null;
     const board = boardsData.find((b: any) => b.id === selectedBoardId);
-    const lists = (board?.task_lists as any[]) || [];
+    const isInitialBoard = selectedBoardId === initialBoard?.id;
+    const lists =
+      (board?.task_lists as any[]) ||
+      (isInitialBoard ? (initialLists ?? []) : []);
     const list = lists.find((l: any) => l.id === selectedListId);
     return {
-      boardName: board?.name || 'Unknown Board',
+      boardName: board?.name || initialBoard?.name || 'Unknown Board',
       listName: list?.name || 'Unknown List',
     };
-  }, [selectedBoardId, selectedListId, boardsData]);
+  }, [
+    selectedBoardId,
+    selectedListId,
+    boardsData,
+    initialBoard?.id,
+    initialBoard?.name,
+    initialLists,
+  ]);
 
   const handleClearDestination = () => {
     setSelectedBoardId('');

package/src/components/ui/tu-do/notes/note-edit-dialog.tsx

@@ -41,10 +41,7 @@ export function NoteEditDialog({
 
   return (
     <Dialog open={isOpen} onOpenChange={onOpenChange} modal={true}>
-      <DialogContent
-        showCloseButton={false}
-        className="inset-0! top-0! left-0! flex h-screen max-h-screen w-screen max-w-none! translate-x-0! translate-y-0! gap-0 rounded-none! border-0 p-0"
-      >
+      <DialogContent showCloseButton={false} presentation="fullscreen">
         {/* Main content area - Note title and description */}
         <div className="flex min-w-0 flex-1 flex-col bg-background transition-all duration-300">
           {/* Enhanced Header with gradient */}

package/src/components/ui/tu-do/shared/__tests__/board-client.test.tsx

@@ -115,6 +115,31 @@ describe('BoardClient', () => {
     );
   });
 
+  it('uses the shared task board loading state while the board query resolves', () => {
+    getWorkspaceTaskBoardMock.mockReturnValue(new Promise(() => {}));
+    const queryClient = new QueryClient({
+      defaultOptions: {
+        queries: {
+          retry: false,
+        },
+      },
+    });
+
+    render(
+      <QueryClientProvider client={queryClient}>
+        <BoardClient
+          boardId="board-1"
+          workspace={{ id: 'workspace-uuid', personal: false } as any}
+          currentUserId="user-1"
+        />
+      </QueryClientProvider>
+    );
+
+    expect(screen.getByTestId('task-board-loading-state')).toBeInTheDocument();
+    expect(screen.getByTestId('kanban-skeleton')).toBeInTheDocument();
+    expect(screen.queryByText('Loading board...')).not.toBeInTheDocument();
+  });
+
   it('can revalidate loaded board lists without invalidating visible task caches', async () => {
     const queryClient = new QueryClient({
       defaultOptions: {