@tuturuuu/ui 0.2.0 → 0.3.1

package/src/components/ui/tu-do/boards/boardId/task-card/task-card.tsx

@@ -8,7 +8,6 @@ import {
   Ban,
   Box,
   Calendar,
-  Check,
   CheckCircle2,
   CircleSlash,
   Clock,
@@ -35,6 +34,7 @@ import {
   listWorkspaceTaskProjects,
   removeCurrentUserTaskPersonalPlacement,
 } from '@tuturuuu/internal-api/tasks';
+import type { SupportedColor } from '@tuturuuu/types/primitives/SupportedColors';
 import type { Task } from '@tuturuuu/types/primitives/Task';
 import type { TaskList } from '@tuturuuu/types/primitives/TaskList';
 import { Badge } from '@tuturuuu/ui/badge';
@@ -49,6 +49,7 @@ import {
 } from '@tuturuuu/ui/dropdown-menu';
 import { useCalendarPreferences } from '@tuturuuu/ui/hooks/use-calendar-preferences';
 import { useTaskActions } from '@tuturuuu/ui/hooks/use-task-actions';
+import { useUserBooleanConfig } from '@tuturuuu/ui/hooks/use-user-config';
 import { useWorkspaceMembers } from '@tuturuuu/ui/hooks/use-workspace-members';
 import {
   HoverCard,
@@ -93,6 +94,11 @@ import { AssigneeSelect } from '../../../shared/assignee-select';
 import { useBoardBroadcast } from '../../../shared/board-broadcast-context';
 import { CreateListDialog } from '../../../shared/create-list-dialog';
 import { formatRelationshipTaskIdentifier } from '../../../shared/relationship-task-identifier';
+import {
+  shouldShowTaskDueDate,
+  shouldShowTaskStartDate,
+  TASKS_SHOW_REVIEW_DUE_DATES_CONFIG_ID,
+} from '../../../shared/task-due-date-visibility';
 import { TaskEstimationDisplay } from '../../../shared/task-estimation-display';
 import { TaskLabelsDisplay } from '../../../shared/task-labels-display';
 import { TaskShareDialog } from '../../../shared/task-share-dialog';
@@ -121,6 +127,7 @@ import {
   TaskPriorityMenu,
   TaskProjectsMenu,
   TaskRelatedMenu,
+  TaskSchedulingMenu,
 } from '../menus';
 import { TaskActions } from '../task-actions';
 import { TaskCustomDateDialog } from '../task-dialogs/TaskCustomDateDialog';
@@ -129,9 +136,16 @@ import { TaskNewLabelDialog } from '../task-dialogs/TaskNewLabelDialog';
 import { TaskNewProjectDialog } from '../task-dialogs/TaskNewProjectDialog';
 import { getTaskCardParentBadgeState } from '../task-parent-badge-state';
 import { TaskCardCheckbox } from './TaskCardCheckbox';
+import {
+  getTaskCardSelectionCheckboxToneClasses,
+  TASK_CARD_OVERDUE_CHECKBOX_TONE_CLASSES,
+} from './task-card-checkbox-style';
 import { areTaskCardPropsEqual } from './task-card-comparator';
+import { shouldRenderTaskCardCompletionCheckbox } from './task-card-completion-checkbox-visibility';
+import { TaskCardIdentifierRow } from './task-card-identifier-row';
 import { mergeTaskCardLabelOptions } from './task-card-label-options';
 import { getTaskCardVisibilityState } from './task-card-visibility';
+import { TaskSchedulingBadge } from './task-scheduling-badge';
 
 export interface TaskCardProps {
   task: Task;
@@ -186,6 +200,10 @@ function TaskCardInner({
   const locale = useLocale();
   const dateLocale = locale === 'vi' ? vi : enUS;
   const { weekStartsOn, timeFormat } = useCalendarPreferences();
+  const { value: showReviewDueDates } = useUserBooleanConfig(
+    TASKS_SHOW_REVIEW_DUE_DATES_CONFIG_ID,
+    false
+  );
   const timePattern = getTimeFormatPattern(timeFormat);
 
   const [isLoading, setIsLoading] = useState(false);
@@ -673,21 +691,6 @@ function TaskCardInner({
     menuOpen ||
     isOptimistic; // Disable drag for optimistic tasks until confirmed
 
-  // Debug: log drag state for newly created task
-  if (task.name === 'new task') {
-    console.log('[TaskCard Debug]', {
-      taskId: task.id,
-      editDialogOpen: dialogState.editDialogOpen,
-      deleteDialogOpen: dialogState.deleteDialogOpen,
-      customDateDialogOpen: dialogState.customDateDialogOpen,
-      newLabelDialogOpen: dialogState.newLabelDialogOpen,
-      newProjectDialogOpen: dialogState.newProjectDialogOpen,
-      menuOpen,
-      isOptimistic,
-      RESULT_dragDisabled: dragDisabled,
-    });
-  }
-
   const sortableDisabled = dragDisabled || isOverlay;
   const sortableId = isOverlay
     ? `${task.id}:drag-overlay`
@@ -764,10 +767,32 @@ function TaskCardInner({
   };
 
   const now = new Date();
-  const isOverdue = task.end_date && new Date(task.end_date) < now;
+  const shouldRenderDueDate = shouldShowTaskDueDate({
+    completedAt: task.completed_at,
+    closedAt: task.closed_at,
+    dueDate: task.end_date,
+    listStatus: taskList?.status,
+    showReviewDueDates,
+  });
+  const shouldRenderStartDate = shouldShowTaskStartDate({
+    completedAt: task.completed_at,
+    closedAt: task.closed_at,
+    listStatus: taskList?.status,
+    startDate: task.start_date,
+  });
+  const isOverdue = Boolean(
+    shouldRenderDueDate && task.end_date && new Date(task.end_date) < now
+  );
   const isResolvedListStatus = isTaskBoardResolvedStatus(taskList?.status);
   const startDate = task.start_date ? new Date(task.start_date) : null;
   const endDate = task.end_date ? new Date(task.end_date) : null;
+  const selectionCheckboxClassName = cn(
+    getTaskCardSelectionCheckboxToneClasses(taskList?.color as SupportedColor),
+    isOverdue &&
+      !task.closed_at &&
+      !isResolvedListStatus &&
+      TASK_CARD_OVERDUE_CHECKBOX_TONE_CLASSES
+  );
 
   // Memoize description metadata to prevent unnecessary recalculations
   // This is important because descriptionMeta is used in taskBadges dependency array
@@ -1188,6 +1213,36 @@ function TaskCardInner({
       });
     }
 
+    if ((task.total_duration ?? 0) > 0) {
+      badges.push({
+        id: 'duration',
+        element: (
+          <TaskSchedulingBadge
+            key="duration"
+            autoSchedule={task.auto_schedule}
+            calendarHours={task.calendar_hours}
+            isSplittable={task.is_splittable}
+            labels={{
+              autoSchedule: taskBoardT('ws-task-boards.dialog.auto_schedule'),
+              estimatedDuration: taskBoardT(
+                'ws-task-boards.dialog.estimated_duration'
+              ),
+              meetingHours: taskBoardT('ws-task-boards.dialog.meeting_hours'),
+              personalHours: taskBoardT('ws-task-boards.dialog.personal_hours'),
+              splittable: taskBoardT('ws-task-boards.dialog.splittable'),
+              workHours: taskBoardT('ws-task-boards.dialog.work_hours'),
+            }}
+            maxSplitDurationMinutes={task.max_split_duration_minutes}
+            minSplitDurationMinutes={task.min_split_duration_minutes}
+            onElement={(element) => {
+              if (element) badgeRefs.current.set('duration', element as any);
+            }}
+            totalDuration={task.total_duration}
+          />
+        ),
+      });
+    }
+
     // Labels badge
     if (task.labels && task.labels.length > 0) {
       badges.push({
@@ -1324,6 +1379,12 @@ function TaskCardInner({
     task.priority,
     task.projects,
     task.estimation_points,
+    task.total_duration,
+    task.auto_schedule,
+    task.calendar_hours,
+    task.is_splittable,
+    task.max_split_duration_minutes,
+    task.min_split_duration_minutes,
     task.labels,
     boardConfig?.estimation_type,
     descriptionMeta.totalCheckboxes,
@@ -1336,6 +1397,7 @@ function TaskCardInner({
     blockingCount,
     relatedTaskCount,
     t,
+    taskBoardT,
     parentBadgeIdentifier,
   ]);
 
@@ -1651,65 +1713,35 @@ function TaskCardInner({
             <AlertCircle className="absolute -top-4 -right-4.5 h-3 w-3" />
           </div>
         )}
-      {/* Selection indicator */}
-      {isMultiSelectMode && (
-        <div
-          className={cn(
-            'absolute top-2 left-2 flex h-6 w-6 items-center justify-center rounded-full border-2 transition-all duration-200',
-            isSelected
-              ? 'scale-110 border-primary bg-primary text-primary-foreground shadow-md'
-              : 'border-border bg-background/80 text-muted-foreground shadow-sm hover:scale-105 hover:border-primary/50'
-          )}
-        >
-          {isSelected ? (
-            <Check className="h-4 w-4 stroke-3" />
-          ) : (
-            <div className="h-2 w-2 rounded-full bg-current opacity-30" />
-          )}
-        </div>
-      )}
       <div className="p-3">
         {/* Header */}
         <div className="flex items-start gap-1">
           <div className="min-w-0 flex-1">
-            <div
-              className={cn(
-                'mb-1 flex gap-1',
-                isPersonalExternalTask ? 'flex-wrap items-center' : 'flex-col'
+            <TaskCardIdentifierRow
+              externalSourceLabel={externalSourceLabel}
+              externalSourceTitle={[
+                task.source_workspace_name,
+                task.source_board_name,
+                task.source_list_name,
+              ]
+                .filter(Boolean)
+                .join(' / ')}
+              isMultiSelectMode={isMultiSelectMode}
+              isPersonalExternalTask={isPersonalExternalTask}
+              isSelected={isSelected}
+              onSelect={(event) => onSelect?.(task.id, event)}
+              selectTaskLabel={t('select_task', { name: task.name ?? '' })}
+              selectionCheckboxClassName={selectionCheckboxClassName}
+              taskListStatus={taskList?.status}
+              ticketBadgeClassName={getTicketBadgeColorClasses(
+                taskList,
+                task.priority
               )}
-            >
-              {isPersonalExternalTask && (
-                <Badge
-                  variant="secondary"
-                  className="h-5 min-w-0 max-w-[70%] gap-1 border border-dynamic-cyan/30 bg-dynamic-cyan/10 px-1.5 text-[10px] text-dynamic-cyan"
-                  title={[
-                    task.source_workspace_name,
-                    task.source_board_name,
-                    task.source_list_name,
-                  ]
-                    .filter(Boolean)
-                    .join(' / ')}
-                >
-                  <ExternalLink className="h-2.5 w-2.5 shrink-0" />
-                  <span className="truncate">{externalSourceLabel}</span>
-                </Badge>
-              )}
-              {/* Ticket Identifier */}
-              {taskList?.status !== 'documents' && (
-                <Badge
-                  variant="outline"
-                  className={cn(
-                    'w-fit px-1 py-0 font-mono text-[10px]',
-                    getTicketBadgeColorClasses(taskList, task.priority)
-                  )}
-                  title={t('ticket_id_label', {
-                    id: taskTicketIdentifier,
-                  })}
-                >
-                  {taskTicketIdentifier}
-                </Badge>
-              )}
-            </div>
+              ticketIdentifier={taskTicketIdentifier}
+              ticketTitle={t('ticket_id_label', {
+                id: taskTicketIdentifier,
+              })}
+            />
             <div className="mb-1">
               {/* Task Name */}
               <button
@@ -1877,6 +1909,47 @@ function TaskCardInner({
                     }}
                   />
 
+                  {/* Scheduling Menu */}
+                  {taskList?.status !== 'documents' && (
+                    <TaskSchedulingMenu
+                      task={task}
+                      boardId={boardId}
+                      isLoading={isLoading}
+                      onUpdate={onUpdate}
+                      onClose={() => setMenuOpen(false)}
+                      translations={{
+                        schedule: taskBoardT('ws-task-boards.dialog.schedule'),
+                        estimatedDuration: taskBoardT(
+                          'ws-task-boards.dialog.estimated_duration'
+                        ),
+                        h: taskBoardT('ws-task-boards.dialog.h'),
+                        m: taskBoardT('ws-task-boards.dialog.m'),
+                        splittable: taskBoardT(
+                          'ws-task-boards.dialog.splittable'
+                        ),
+                        minSplit: taskBoardT('ws-task-boards.dialog.min_split'),
+                        maxSplit: taskBoardT('ws-task-boards.dialog.max_split'),
+                        hourType: taskBoardT('ws-task-boards.dialog.hour_type'),
+                        workHours: taskBoardT(
+                          'ws-task-boards.dialog.work_hours'
+                        ),
+                        meetingHours: taskBoardT(
+                          'ws-task-boards.dialog.meeting_hours'
+                        ),
+                        personalHours: taskBoardT(
+                          'ws-task-boards.dialog.personal_hours'
+                        ),
+                        autoSchedule: taskBoardT(
+                          'ws-task-boards.dialog.auto_schedule'
+                        ),
+                        save: t('save'),
+                        clear: t('clear'),
+                        saved: t('saved'),
+                        error: t('error'),
+                      }}
+                    />
+                  )}
+
                   {/* Estimation Menu */}
                   {boardConfig?.estimation_type && (
                     <TaskEstimationMenu
@@ -2169,11 +2242,10 @@ function TaskCardInner({
           )}
         </div>
         {/* Dates Section (improved layout & conditional rendering) */}
-        {/* Hide dates when the list itself represents resolved work. */}
-        {(startDate || endDate) && !isResolvedListStatus && (
+        {(shouldRenderStartDate || shouldRenderDueDate) && (
           <div className="mb-1 space-y-0.5 text-[10px] leading-snug">
             {/* Show start only if in the future (hide historical start for visual simplicity) */}
-            {startDate && startDate > now && (
+            {shouldRenderStartDate && startDate && startDate > now && (
               <div className="flex items-center gap-1 text-muted-foreground">
                 <Clock className="h-2.5 w-2.5 shrink-0" />
                 <span className="truncate">
@@ -2191,7 +2263,7 @@ function TaskCardInner({
                 </span>
               </div>
             )}
-            {endDate && (
+            {shouldRenderDueDate && endDate && (
               <div
                 className={cn(
                   'flex items-center gap-1',
@@ -2403,7 +2475,10 @@ function TaskCardInner({
               )}
 
               {/* Checkbox: hidden for documents lists */}
-              {taskList?.status !== 'documents' && (
+              {shouldRenderTaskCardCompletionCheckbox({
+                isMultiSelectMode,
+                taskListStatus: taskList?.status,
+              }) && (
                 <TaskCardCheckbox
                   task={task}
                   taskList={taskList}

package/src/components/ui/tu-do/boards/boardId/task-card/task-scheduling-badge.tsx

@@ -0,0 +1,174 @@
+import type { CalendarHoursType } from '@tuturuuu/types/primitives/Task';
+import { Badge } from '@tuturuuu/ui/badge';
+import { cn } from '@tuturuuu/utils/format';
+import type { ReactElement, SVGProps } from 'react';
+import {
+  formatTaskDurationLabel,
+  formatTaskSchedulingBadgeTitle,
+  type TaskSchedulingBadgeTitleLabels,
+} from '../menus/task-scheduling-utils';
+
+function WorkScheduleIcon(props: SVGProps<SVGSVGElement>) {
+  return (
+    <svg aria-hidden="true" fill="none" viewBox="0 0 16 16" {...props}>
+      <path
+        d="M5.75 4.25V3.5A1.5 1.5 0 0 1 7.25 2h1.5a1.5 1.5 0 0 1 1.5 1.5v.75"
+        stroke="currentColor"
+        strokeLinecap="round"
+        strokeWidth="1.5"
+      />
+      <path
+        d="M3.5 4.5h9A1.5 1.5 0 0 1 14 6v5.25A1.75 1.75 0 0 1 12.25 13h-8.5A1.75 1.75 0 0 1 2 11.25V6a1.5 1.5 0 0 1 1.5-1.5Z"
+        stroke="currentColor"
+        strokeLinejoin="round"
+        strokeWidth="1.5"
+      />
+      <path
+        d="M2.25 7.5h11.5M7 7.5v1h2v-1"
+        stroke="currentColor"
+        strokeLinecap="round"
+        strokeWidth="1.5"
+      />
+    </svg>
+  );
+}
+
+function PersonalScheduleIcon(props: SVGProps<SVGSVGElement>) {
+  return (
+    <svg aria-hidden="true" fill="none" viewBox="0 0 16 16" {...props}>
+      <path
+        d="M2.75 7.25 8 3l5.25 4.25"
+        stroke="currentColor"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        strokeWidth="1.5"
+      />
+      <path
+        d="M4.25 6.75v5A1.25 1.25 0 0 0 5.5 13h5a1.25 1.25 0 0 0 1.25-1.25v-5"
+        stroke="currentColor"
+        strokeLinejoin="round"
+        strokeWidth="1.5"
+      />
+      <path
+        d="M6.5 13V9.75h3V13"
+        stroke="currentColor"
+        strokeLinejoin="round"
+        strokeWidth="1.5"
+      />
+    </svg>
+  );
+}
+
+function MeetingScheduleIcon(props: SVGProps<SVGSVGElement>) {
+  return (
+    <svg aria-hidden="true" fill="none" viewBox="0 0 16 16" {...props}>
+      <path
+        d="M5.25 7a1.75 1.75 0 1 0 0-3.5 1.75 1.75 0 0 0 0 3.5ZM10.75 7a1.75 1.75 0 1 0 0-3.5 1.75 1.75 0 0 0 0 3.5Z"
+        stroke="currentColor"
+        strokeWidth="1.5"
+      />
+      <path
+        d="M2.75 12.5v-.75A2.75 2.75 0 0 1 5.5 9h.25M13.25 12.5v-.75A2.75 2.75 0 0 0 10.5 9h-.25M6.75 10.5h2.5"
+        stroke="currentColor"
+        strokeLinecap="round"
+        strokeWidth="1.5"
+      />
+    </svg>
+  );
+}
+
+function AutoScheduleMark(props: SVGProps<SVGSVGElement>) {
+  return (
+    <svg aria-hidden="true" fill="none" viewBox="0 0 10 10" {...props}>
+      <path
+        d="M5.75 1.25 2.5 5.4h2.35l-.6 3.35L7.5 4.6H5.15l.6-3.35Z"
+        fill="currentColor"
+      />
+    </svg>
+  );
+}
+
+const SCHEDULE_BADGE_CONFIG = {
+  meeting_hours: {
+    className:
+      'border-dynamic-orange/35 bg-dynamic-orange/10 text-dynamic-orange',
+    Icon: MeetingScheduleIcon,
+  },
+  personal_hours: {
+    className: 'border-dynamic-green/35 bg-dynamic-green/10 text-dynamic-green',
+    Icon: PersonalScheduleIcon,
+  },
+  work_hours: {
+    className: 'border-dynamic-blue/35 bg-dynamic-blue/10 text-dynamic-blue',
+    Icon: WorkScheduleIcon,
+  },
+} satisfies Record<
+  CalendarHoursType,
+  {
+    className: string;
+    Icon: (props: SVGProps<SVGSVGElement>) => ReactElement;
+  }
+>;
+
+function getScheduleBadgeConfig(calendarHours: CalendarHoursType | null) {
+  return calendarHours
+    ? SCHEDULE_BADGE_CONFIG[calendarHours]
+    : {
+        className:
+          'border-dynamic-gray/30 bg-dynamic-gray/10 text-dynamic-gray',
+        Icon: WorkScheduleIcon,
+      };
+}
+
+export function TaskSchedulingBadge({
+  autoSchedule,
+  calendarHours,
+  isSplittable,
+  labels,
+  maxSplitDurationMinutes,
+  minSplitDurationMinutes,
+  onElement,
+  totalDuration,
+}: {
+  autoSchedule?: boolean | null;
+  calendarHours?: CalendarHoursType | null;
+  isSplittable?: boolean | null;
+  labels: TaskSchedulingBadgeTitleLabels;
+  maxSplitDurationMinutes?: number | null;
+  minSplitDurationMinutes?: number | null;
+  onElement?: (element: HTMLElement | null) => void;
+  totalDuration?: number | null;
+}) {
+  const durationLabel = formatTaskDurationLabel(totalDuration ?? null);
+  if (!durationLabel) return null;
+
+  const scheduleBadgeConfig = getScheduleBadgeConfig(calendarHours ?? null);
+  const ScheduleIcon = scheduleBadgeConfig.Icon;
+  const schedulingTitle = formatTaskSchedulingBadgeTitle({
+    autoSchedule,
+    calendarHours,
+    durationLabel,
+    isSplittable,
+    labels,
+    maxSplitDurationMinutes,
+    minSplitDurationMinutes,
+  });
+
+  return (
+    <Badge
+      variant="secondary"
+      className={cn(
+        'h-5 shrink-0 border px-1.5 font-medium text-[10px]',
+        scheduleBadgeConfig.className
+      )}
+      title={schedulingTitle}
+      ref={(element) => onElement?.(element as HTMLElement | null)}
+    >
+      <ScheduleIcon className="h-2.5 w-2.5" />
+      {durationLabel}
+      {autoSchedule && (
+        <AutoScheduleMark className="-mr-0.5 h-2.5 w-2.5 opacity-80" />
+      )}
+    </Badge>
+  );
+}

package/src/components/ui/tu-do/providers/task-dialog-provider.tsx

@@ -1,14 +1,5 @@
 'use client';
 
-import {
-  listWorkspaceLabels,
-  listWorkspaceMembers,
-} from '@tuturuuu/internal-api';
-import {
-  getCurrentUserTask,
-  listWorkspaceTaskProjectsByIds,
-  resolveTaskProjectWorkspaceId,
-} from '@tuturuuu/internal-api/tasks';
 import type { WorkspaceProductTier } from '@tuturuuu/types';
 import type { Task } from '@tuturuuu/types/primitives/Task';
 import type { TaskList } from '@tuturuuu/types/primitives/TaskList';
@@ -31,6 +22,20 @@ import { useOptionalWorkspacePresenceContext } from './workspace-presence-provid
 
 export type { PendingRelationship, PendingRelationshipType };
 
+type WorkspaceLabelSummary = {
+  id: string;
+  name: string | null;
+  color: string | null;
+  created_at: string | null;
+};
+
+type WorkspaceMemberSummary = {
+  id: string;
+  user_id?: string | null;
+  display_name?: string | null;
+  avatar_url?: string | null;
+};
+
 interface TaskDialogState {
   isOpen: boolean;
   task?: Task;
@@ -356,6 +361,10 @@ export function TaskDialogProvider({
           | undefined;
 
         try {
+          const { getCurrentUserTask } = await import(
+            '@tuturuuu/internal-api/tasks'
+          );
+
           response = await getCurrentUserTask(taskId, {
             fetch: (input, init) =>
               fetch(new URL(String(input), window.location.origin).toString(), {
@@ -526,6 +535,9 @@ export function TaskDialogProvider({
       assignee_ids?: string[];
       project_ids?: string[];
     }) => {
+      const { resolveTaskProjectWorkspaceId } = await import(
+        '@tuturuuu/internal-api/tasks'
+      );
       const workspaceId = await resolveTaskProjectWorkspaceId({
         boardId: draft.board_id ?? undefined,
         projectIds: draft.project_ids,
@@ -543,12 +555,15 @@ export function TaskDialogProvider({
         created_at: string;
       }> = [];
       if (draft.label_ids && draft.label_ids.length > 0) {
+        const { listWorkspaceLabels } = await import(
+          '@tuturuuu/internal-api/tasks'
+        );
         const data = await listWorkspaceLabels(workspaceId);
         labels = data
-          .filter((label: (typeof data)[number]) =>
+          .filter((label: WorkspaceLabelSummary) =>
             draft.label_ids?.includes(label.id)
           )
-          .map((l: (typeof data)[number]) => ({
+          .map((l: WorkspaceLabelSummary) => ({
             id: l.id,
             name: l.name ?? '',
             color: l.color ?? '',
@@ -564,12 +579,15 @@ export function TaskDialogProvider({
         avatar_url?: string | null;
       }> = [];
       if (draft.assignee_ids && draft.assignee_ids.length > 0) {
+        const { listWorkspaceMembers } = await import(
+          '@tuturuuu/internal-api/workspaces'
+        );
         const data = await listWorkspaceMembers(workspaceId);
         assignees = data
-          .filter((user: (typeof data)[number]) =>
+          .filter((user: WorkspaceMemberSummary) =>
             Boolean(user.user_id && draft.assignee_ids?.includes(user.user_id))
           )
-          .map((u: (typeof data)[number]) => ({
+          .map((u: WorkspaceMemberSummary) => ({
             id: u.id,
             user_id: u.user_id || u.id,
             display_name: u.display_name,
@@ -584,6 +602,9 @@ export function TaskDialogProvider({
         status: string | null;
       }> = [];
       if (draft.project_ids && draft.project_ids.length > 0) {
+        const { listWorkspaceTaskProjectsByIds } = await import(
+          '@tuturuuu/internal-api/tasks'
+        );
         const workspaceProjects = await listWorkspaceTaskProjectsByIds(
           workspaceId,
           draft.project_ids