@tuturuuu/ui 0.17.0 → 0.18.0

package/src/components/ui/tu-do/shared/task-edit-dialog/task-properties-section.tsx

@@ -1,2213 +0,0 @@
-'use client';
-
-import {
-  AlertCircle,
-  AlertTriangle,
-  Box,
-  Briefcase,
-  Calendar,
-  CalendarClock,
-  Check,
-  CheckCircle,
-  ChevronDown,
-  Clock,
-  Flag,
-  Loader2,
-  Minus,
-  Pen,
-  Plus,
-  Save,
-  Scissors,
-  Tag,
-  Timer,
-  User,
-  Users,
-  X,
-  Zap,
-} from '@tuturuuu/icons';
-import type { TaskPriority } from '@tuturuuu/types/primitives/Priority';
-import type { CalendarHoursType } from '@tuturuuu/types/primitives/Task';
-import type { TaskList } from '@tuturuuu/types/primitives/TaskList';
-import { Badge } from '@tuturuuu/ui/badge';
-import { Button } from '@tuturuuu/ui/button';
-import { DateTimePicker } from '@tuturuuu/ui/date-time-picker';
-import { useCalendarPreferences } from '@tuturuuu/ui/hooks/use-calendar-preferences';
-import { Label } from '@tuturuuu/ui/label';
-import { Popover, PopoverContent, PopoverTrigger } from '@tuturuuu/ui/popover';
-import { Progress } from '@tuturuuu/ui/progress';
-import { Switch } from '@tuturuuu/ui/switch';
-import { Tooltip, TooltipContent, TooltipTrigger } from '@tuturuuu/ui/tooltip';
-import { cn } from '@tuturuuu/utils/format';
-import { computeAccessibleLabelStyles } from '@tuturuuu/utils/label-colors';
-import dayjs from 'dayjs';
-import { useTranslations } from 'next-intl';
-import {
-  type ComponentProps,
-  cloneElement,
-  isValidElement,
-  type ReactElement,
-  type ReactNode,
-  useCallback,
-  useEffect,
-  useMemo,
-  useRef,
-  useState,
-} from 'react';
-import { PRIORITY_BADGE_COLORS } from '../../utils/taskConstants';
-import { getPriorityIcon } from '../../utils/taskPriorityUtils';
-import { ClearMenuItem } from '../clear-menu-item';
-import { EmptyStateCard } from '../empty-state-card';
-import {
-  buildEstimationIndices,
-  mapEstimationPoints,
-} from '../estimation-mapping';
-import { LabelChip } from '../label-chip';
-import type { SchedulingSettings } from '../task-edit-dialog/hooks/use-task-mutations';
-import type { WorkspaceTaskLabel } from '../task-edit-dialog/types';
-import { TaskResourceSearchField } from '../task-resource-search-field';
-import {
-  labelNameMatchesQuery,
-  memberMatchesSearchQuery,
-  projectNameMatchesQuery,
-} from '../task-resource-search-filters';
-import { UserAvatar } from '../user-avatar';
-import { translateTaskListNameForDisplay } from '../utils/translate-task-list-display-name';
-import { TaskListSelector } from './components/task-list-selector';
-import {
-  getTaskListTriggerIcon,
-  getTaskListTriggerSurfaceClass,
-} from './components/task-list-trigger-styles';
-
-// Scheduled calendar event type
-export interface ScheduledCalendarEvent {
-  id: string;
-  title: string;
-  start_at: string;
-  end_at: string;
-  scheduled_minutes: number;
-  completed: boolean;
-  locked?: boolean;
-  scheduling_reason?: string;
-}
-
-interface TaskPropertiesSectionProps {
-  // IDs
-  wsId: string;
-  boardId: string;
-  taskId?: string;
-  // State
-  priority: TaskPriority | null;
-  startDate: Date | undefined;
-  endDate: Date | undefined;
-  estimationPoints: number | null | undefined;
-  selectedLabels: WorkspaceTaskLabel[];
-  selectedProjects: any[];
-  selectedListId: string;
-  selectedAssignees: any[];
-  isLoading: boolean;
-  isPersonalWorkspace: boolean;
-  canUseBoardAssignees?: boolean;
-  isCreateMode: boolean;
-  // Scheduling state
-  totalDuration: number | null;
-  isSplittable: boolean;
-  minSplitDurationMinutes: number | null;
-  maxSplitDurationMinutes: number | null;
-  calendarHours: CalendarHoursType | null;
-  autoSchedule: boolean;
-  // Saved scheduling state (for comparison)
-  savedSchedulingSettings?: SchedulingSettings;
-  // Scheduled events for this task
-  scheduledEvents?: ScheduledCalendarEvent[];
-
-  // Data
-  availableLists: TaskList[];
-  availableLabels: WorkspaceTaskLabel[];
-  taskProjects: any[];
-  workspaceMembers: any[];
-  boardConfig: any;
-
-  // Handlers
-  onPriorityChange: (priority: TaskPriority | null) => void;
-  onStartDateChange: (date: Date | undefined) => void;
-  onEndDateChange: (date: Date | undefined) => void;
-  onEstimationChange: (points: number | null) => void;
-  onLabelToggle: (label: WorkspaceTaskLabel) => void;
-  onProjectToggle: (project: any) => void;
-  onListChange: (listId: string) => void;
-  onAssigneeToggle: (assignee: any) => void;
-  onQuickDueDate: (days: number | null) => void;
-  onShowNewLabelDialog: () => void;
-  onShowNewProjectDialog: () => void;
-  onShowEstimationConfigDialog: () => void;
-  // Scheduling handlers
-  onTotalDurationChange: (duration: number | null) => void;
-  onIsSplittableChange: (splittable: boolean) => void;
-  onMinSplitDurationChange: (minutes: number | null) => void;
-  onMaxSplitDurationChange: (minutes: number | null) => void;
-  onCalendarHoursChange: (hourType: CalendarHoursType | null) => void;
-  onAutoScheduleChange: (autoSchedule: boolean) => void;
-  onSaveSchedulingSettings: (settings: SchedulingSettings) => Promise<boolean>;
-  schedulingSaving: boolean;
-  disabled?: boolean;
-  /** When true, hides fields not supported by drafts (projects, scheduling) */
-  isDraftMode?: boolean;
-  /** Compact icon-only controls for the create popover. */
-  variant?: 'default' | 'compact';
-}
-
-type TaskPropertyPopoverId =
-  | 'priority'
-  | 'list'
-  | 'dates'
-  | 'estimation'
-  | 'labels'
-  | 'projects'
-  | 'assignees'
-  | 'scheduling';
-
-const TASK_PROPERTY_POPOVER_TRIGGER_ATTRIBUTE =
-  'data-task-property-popover-trigger';
-
-const taskPropertyPopoverIds = new Set<TaskPropertyPopoverId>([
-  'priority',
-  'list',
-  'dates',
-  'estimation',
-  'labels',
-  'projects',
-  'assignees',
-  'scheduling',
-]);
-
-function isTaskPropertyPopoverId(
-  value: string | null
-): value is TaskPropertyPopoverId {
-  return !!value && taskPropertyPopoverIds.has(value as TaskPropertyPopoverId);
-}
-
-function getTaskPropertyPopoverIdFromTarget(
-  target: EventTarget | null
-): TaskPropertyPopoverId | null {
-  if (typeof Element === 'undefined' || !(target instanceof Element)) {
-    return null;
-  }
-
-  const trigger = target.closest(
-    `[${TASK_PROPERTY_POPOVER_TRIGGER_ATTRIBUTE}]`
-  );
-  const popoverId =
-    trigger?.getAttribute(TASK_PROPERTY_POPOVER_TRIGGER_ATTRIBUTE) ?? null;
-
-  return isTaskPropertyPopoverId(popoverId) ? popoverId : null;
-}
-
-function TaskPropertyPopoverTrigger({
-  children,
-  compact,
-  label,
-  popoverId,
-}: {
-  children: ReactNode;
-  compact: boolean;
-  label: ReactNode;
-  popoverId: TaskPropertyPopoverId;
-}) {
-  const trigger = isValidElement(children)
-    ? cloneElement(children as ReactElement<Record<string, unknown>>, {
-        [TASK_PROPERTY_POPOVER_TRIGGER_ATTRIBUTE]: popoverId,
-      })
-    : children;
-
-  if (!compact) {
-    return <PopoverTrigger asChild>{trigger}</PopoverTrigger>;
-  }
-
-  return (
-    <Tooltip>
-      <TooltipTrigger asChild>
-        <PopoverTrigger asChild>{trigger}</PopoverTrigger>
-      </TooltipTrigger>
-      <TooltipContent side="bottom">{label}</TooltipContent>
-    </Tooltip>
-  );
-}
-
-type TaskPropertyPopoverContentProps = ComponentProps<typeof PopoverContent>;
-
-// Calendar hours type options
-const getCalendarHoursOptions = (t: any) => [
-  {
-    value: 'work_hours' as CalendarHoursType,
-    label: t('ws-task-boards.dialog.work_hours'),
-    icon: Briefcase,
-    description: t('ws-task-boards.dialog.schedule_during_work_hours'),
-  },
-  {
-    value: 'meeting_hours' as CalendarHoursType,
-    label: t('ws-task-boards.dialog.meeting_hours'),
-    icon: Calendar,
-    description: t('ws-task-boards.dialog.schedule_during_meeting_hours'),
-  },
-  {
-    value: 'personal_hours' as CalendarHoursType,
-    label: t('ws-task-boards.dialog.personal_hours'),
-    icon: User,
-    description: t('ws-task-boards.dialog.schedule_during_personal_hours'),
-  },
-];
-
-// Format duration helper - rounds to avoid floating point issues
-function formatDuration(totalMinutes: number, t: any): string {
-  const roundedTotal = Math.round(totalMinutes);
-  const hours = Math.floor(roundedTotal / 60);
-  const minutes = roundedTotal % 60;
-  const h = t('ws-task-boards.dialog.h');
-  const m = t('ws-task-boards.dialog.m');
-
-  if (hours === 0) return `${minutes}${m}`;
-  if (minutes === 0) return `${hours}${h}`;
-  return `${hours}${h} ${minutes}${m}`;
-}
-
-// Custom duration input component with better UX
-interface DurationInputProps {
-  value: number;
-  onChange: (value: number, direction?: 'increment' | 'decrement') => void;
-  min?: number;
-  max?: number;
-  step?: number;
-  disabled?: boolean;
-  label: string;
-  className?: string;
-  // For minute inputs that need to rollover to hours
-  allowRollover?: boolean;
-  canDecrement?: boolean;
-}
-
-function DurationInput({
-  value,
-  onChange,
-  min = 0,
-  max = 999,
-  step = 1,
-  disabled = false,
-  label,
-  className,
-  allowRollover = false,
-  canDecrement,
-}: DurationInputProps) {
-  const handleIncrement = () => {
-    if (allowRollover) {
-      // For rollover mode, pass the would-be value and direction
-      onChange(value + step, 'increment');
-    } else {
-      const newValue = Math.min(value + step, max);
-      onChange(newValue);
-    }
-  };
-
-  const handleDecrement = () => {
-    if (allowRollover) {
-      // For rollover mode, pass the would-be value and direction
-      onChange(value - step, 'decrement');
-    } else {
-      const newValue = Math.max(value - step, min);
-      onChange(newValue);
-    }
-  };
-
-  const handleInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {
-    const parsed = parseInt(e.target.value, 10);
-    if (Number.isNaN(parsed)) {
-      onChange(min);
-    } else {
-      onChange(Math.max(min, Math.min(parsed, max)));
-    }
-  };
-
-  // Determine if decrement is allowed
-  const decrementDisabled = allowRollover
-    ? canDecrement === false
-    : value <= min;
-
-  return (
-    <div className={cn('flex items-center gap-1', className)}>
-      <div className="flex h-8 items-center overflow-hidden rounded-md border bg-background">
-        <button
-          type="button"
-          onClick={handleDecrement}
-          disabled={disabled || decrementDisabled}
-          className="flex h-full w-7 items-center justify-center text-muted-foreground transition-colors hover:bg-muted hover:text-foreground disabled:cursor-not-allowed disabled:opacity-50"
-        >
-          <Minus className="h-3 w-3" />
-        </button>
-        <input
-          type="text"
-          inputMode="numeric"
-          pattern="[0-9]*"
-          value={value}
-          onChange={handleInputChange}
-          disabled={disabled}
-          className="h-full w-10 border-x bg-transparent text-center text-sm outline-none [appearance:textfield] [&::-webkit-inner-spin-button]:appearance-none [&::-webkit-outer-spin-button]:appearance-none"
-        />
-        <button
-          type="button"
-          onClick={handleIncrement}
-          disabled={disabled}
-          className="flex h-full w-7 items-center justify-center text-muted-foreground transition-colors hover:bg-muted hover:text-foreground disabled:cursor-not-allowed disabled:opacity-50"
-        >
-          <Plus className="h-3 w-3" />
-        </button>
-      </div>
-      <span className="text-muted-foreground text-xs">{label}</span>
-    </div>
-  );
-}
-
-export function TaskPropertiesSection(props: TaskPropertiesSectionProps) {
-  const {
-    wsId,
-    boardId,
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    taskId: _taskId,
-    priority,
-    startDate,
-    endDate,
-    estimationPoints,
-    selectedLabels,
-    selectedProjects,
-    selectedListId,
-    selectedAssignees,
-    isLoading,
-    isPersonalWorkspace,
-    canUseBoardAssignees = !isPersonalWorkspace,
-    isCreateMode,
-    // Scheduling state
-    totalDuration,
-    isSplittable,
-    minSplitDurationMinutes,
-    maxSplitDurationMinutes,
-    calendarHours,
-    autoSchedule,
-    savedSchedulingSettings,
-    scheduledEvents,
-    availableLists,
-    availableLabels,
-    taskProjects,
-    workspaceMembers,
-    boardConfig,
-    onPriorityChange,
-    onStartDateChange,
-    onEndDateChange,
-    onEstimationChange,
-    onLabelToggle,
-    onProjectToggle,
-    onListChange,
-    onAssigneeToggle,
-    onQuickDueDate,
-    onShowNewLabelDialog,
-    onShowNewProjectDialog,
-    onShowEstimationConfigDialog,
-    // Scheduling handlers
-    onTotalDurationChange,
-    onIsSplittableChange,
-    onMinSplitDurationChange,
-    onMaxSplitDurationChange,
-    onCalendarHoursChange,
-    onAutoScheduleChange,
-    onSaveSchedulingSettings,
-    schedulingSaving,
-    disabled = false,
-    isDraftMode = false,
-    variant = 'default',
-  } = props;
-
-  const t = useTranslations();
-  const isCompact = variant === 'compact';
-  const triggerBaseClass = cn(
-    'inline-flex shrink-0 items-center border font-medium text-xs transition-colors',
-    isCompact
-      ? 'h-9 w-9 justify-center rounded-md p-0'
-      : 'h-8 gap-1.5 rounded-lg px-3'
-  );
-  const compactLabelClass = isCompact ? 'sr-only' : undefined;
-
-  const selectedListForSummary = useMemo(
-    () =>
-      selectedListId
-        ? availableLists?.find((l) => l.id === selectedListId)
-        : undefined,
-    [availableLists, selectedListId]
-  );
-
-  const listNameLabels = useMemo(
-    () => ({
-      toDo: t('common.list_name_to_do'),
-      inProgress: t('common.list_name_in_progress'),
-      review: t('common.list_name_review'),
-      done: t('common.list_name_done'),
-      closed: t('common.list_name_closed'),
-      documents: t('common.documents'),
-    }),
-    [t]
-  );
-
-  const ListSummaryTriggerIcon = getTaskListTriggerIcon(selectedListForSummary);
-  const listSummarySurfaceClass = getTaskListTriggerSurfaceClass(
-    selectedListForSummary
-  );
-
-  const { weekStartsOn, timezone, timeFormat } = useCalendarPreferences();
-
-  const [isMetadataExpanded, setIsMetadataExpanded] = useState(false);
-  const [activePopover, setActivePopover] =
-    useState<TaskPropertyPopoverId | null>(null);
-  const [labelSearchQuery, setLabelSearchQuery] = useState('');
-  const [projectSearchQuery, setProjectSearchQuery] = useState('');
-  const [assigneeSearchQuery, setAssigneeSearchQuery] = useState('');
-
-  const isPopoverOpen = useCallback(
-    (popoverId: TaskPropertyPopoverId) => activePopover === popoverId,
-    [activePopover]
-  );
-
-  const openPropertyPopover = useCallback(
-    (popoverId: TaskPropertyPopoverId) => {
-      setActivePopover(popoverId);
-    },
-    []
-  );
-
-  const closePropertyPopover = useCallback(
-    (popoverId: TaskPropertyPopoverId) => {
-      setActivePopover((currentPopover) =>
-        currentPopover === popoverId ? null : currentPopover
-      );
-    },
-    []
-  );
-
-  const setPopoverOpen = useCallback(
-    (popoverId: TaskPropertyPopoverId, open: boolean) => {
-      if (open) {
-        openPropertyPopover(popoverId);
-        return;
-      }
-
-      closePropertyPopover(popoverId);
-    },
-    [closePropertyPopover, openPropertyPopover]
-  );
-
-  const handlePropertyPopoverCloseAutoFocus = useCallback<
-    NonNullable<TaskPropertyPopoverContentProps['onCloseAutoFocus']>
-  >((event) => {
-    event.preventDefault();
-  }, []);
-
-  const handlePropertyPopoverInteractOutside = useCallback<
-    NonNullable<TaskPropertyPopoverContentProps['onInteractOutside']>
-  >(
-    (event) => {
-      const targetPopoverId = getTaskPropertyPopoverIdFromTarget(event.target);
-
-      if (!targetPopoverId || targetPopoverId === activePopover) {
-        return;
-      }
-
-      event.preventDefault();
-
-      const openTargetPopover = () => {
-        openPropertyPopover(targetPopoverId);
-      };
-
-      if (typeof window !== 'undefined' && window.requestAnimationFrame) {
-        window.requestAnimationFrame(openTargetPopover);
-        return;
-      }
-
-      openTargetPopover();
-    },
-    [activePopover, openPropertyPopover]
-  );
-
-  const propertyPopoverContentProps = useMemo(
-    () => ({
-      onCloseAutoFocus: handlePropertyPopoverCloseAutoFocus,
-      onInteractOutside: handlePropertyPopoverInteractOutside,
-    }),
-    [handlePropertyPopoverCloseAutoFocus, handlePropertyPopoverInteractOutside]
-  );
-
-  useEffect(() => {
-    if (activePopover !== 'labels') {
-      setLabelSearchQuery('');
-    }
-  }, [activePopover]);
-
-  useEffect(() => {
-    if (activePopover !== 'projects') {
-      setProjectSearchQuery('');
-    }
-  }, [activePopover]);
-
-  useEffect(() => {
-    if (activePopover !== 'assignees') {
-      setAssigneeSearchQuery('');
-    }
-  }, [activePopover]);
-
-  const unselectedAvailableLabels = useMemo(
-    () =>
-      availableLabels.filter(
-        (l) => !selectedLabels.some((sl) => sl.id === l.id)
-      ),
-    [availableLabels, selectedLabels]
-  );
-  const filteredUnselectedLabels = useMemo(
-    () =>
-      unselectedAvailableLabels.filter((l) =>
-        labelNameMatchesQuery(l.name, labelSearchQuery)
-      ),
-    [unselectedAvailableLabels, labelSearchQuery]
-  );
-
-  const unselectedTaskProjects = useMemo(
-    () =>
-      taskProjects.filter(
-        (p) => !selectedProjects.some((sp) => sp.id === p.id)
-      ),
-    [taskProjects, selectedProjects]
-  );
-  const filteredUnselectedProjects = useMemo(
-    () =>
-      unselectedTaskProjects.filter((p) =>
-        projectNameMatchesQuery(p.name, projectSearchQuery)
-      ),
-    [unselectedTaskProjects, projectSearchQuery]
-  );
-
-  const unselectedWorkspaceMembers = useMemo(
-    () =>
-      workspaceMembers.filter(
-        (m) =>
-          !selectedAssignees.some(
-            (a) => (a.id || a.user_id) === (m.user_id || m.id)
-          )
-      ),
-    [workspaceMembers, selectedAssignees]
-  );
-  const filteredUnselectedMembers = useMemo(
-    () =>
-      unselectedWorkspaceMembers.filter((m) =>
-        memberMatchesSearchQuery(
-          { display_name: m.display_name, email: m.email },
-          assigneeSearchQuery
-        )
-      ),
-    [unselectedWorkspaceMembers, assigneeSearchQuery]
-  );
-
-  // Track last saved settings locally (updates after successful save)
-  const [lastSavedSettings, setLastSavedSettings] = useState<
-    SchedulingSettings | undefined
-  >(savedSchedulingSettings);
-
-  // Update lastSavedSettings when prop changes (e.g., task is refetched)
-  // Use deep comparison since savedSchedulingSettings is a new object each render
-  const previousSavedRef = useRef(savedSchedulingSettings);
-  useEffect(() => {
-    const propValues = savedSchedulingSettings;
-    const prevValues = previousSavedRef.current;
-
-    // Deep compare to avoid overwriting on every render
-    const hasChanged =
-      propValues?.totalDuration !== prevValues?.totalDuration ||
-      propValues?.isSplittable !== prevValues?.isSplittable ||
-      propValues?.minSplitDurationMinutes !==
-        prevValues?.minSplitDurationMinutes ||
-      propValues?.maxSplitDurationMinutes !==
-        prevValues?.maxSplitDurationMinutes ||
-      propValues?.calendarHours !== prevValues?.calendarHours ||
-      propValues?.autoSchedule !== prevValues?.autoSchedule;
-
-    if (hasChanged) {
-      previousSavedRef.current = propValues;
-      setLastSavedSettings(propValues);
-    }
-  }, [savedSchedulingSettings]);
-
-  // Computed duration values
-  const totalMinutes = (totalDuration ?? 0) * 60;
-  const durationHours = Math.floor(totalMinutes / 60);
-  const durationMinutes = Math.round(totalMinutes % 60);
-
-  // Check if scheduling settings have unsaved changes
-  const hasUnsavedSchedulingChanges = useMemo(() => {
-    if (isCreateMode) return false; // In create mode, all changes are pending until save
-    if (!lastSavedSettings) return false; // No saved state to compare against
-
-    return (
-      totalDuration !== lastSavedSettings.totalDuration ||
-      isSplittable !== lastSavedSettings.isSplittable ||
-      minSplitDurationMinutes !== lastSavedSettings.minSplitDurationMinutes ||
-      maxSplitDurationMinutes !== lastSavedSettings.maxSplitDurationMinutes ||
-      calendarHours !== lastSavedSettings.calendarHours ||
-      autoSchedule !== lastSavedSettings.autoSchedule
-    );
-  }, [
-    isCreateMode,
-    lastSavedSettings,
-    totalDuration,
-    isSplittable,
-    minSplitDurationMinutes,
-    maxSplitDurationMinutes,
-    calendarHours,
-    autoSchedule,
-  ]);
-
-  // Check if save is allowed (must have non-zero duration, hour type selected, and unsaved changes)
-  const canSaveScheduling = useMemo(() => {
-    const hasDuration = durationHours > 0 || durationMinutes > 0;
-    const hasHourType = calendarHours !== null;
-    return (
-      hasUnsavedSchedulingChanges &&
-      hasDuration &&
-      hasHourType &&
-      !schedulingSaving
-    );
-  }, [
-    hasUnsavedSchedulingChanges,
-    durationHours,
-    durationMinutes,
-    calendarHours,
-    schedulingSaving,
-  ]);
-
-  // Handle save scheduling settings
-  const handleSaveSchedulingSettings = useCallback(async () => {
-    const settings: SchedulingSettings = {
-      totalDuration,
-      isSplittable,
-      minSplitDurationMinutes,
-      maxSplitDurationMinutes,
-      calendarHours,
-      autoSchedule,
-    };
-    const success = await onSaveSchedulingSettings(settings);
-    if (success) {
-      // Update local saved state to reflect the successful save
-      setLastSavedSettings(settings);
-      setPopoverOpen('scheduling', false);
-    }
-  }, [
-    totalDuration,
-    isSplittable,
-    minSplitDurationMinutes,
-    maxSplitDurationMinutes,
-    calendarHours,
-    autoSchedule,
-    onSaveSchedulingSettings,
-    setPopoverOpen,
-  ]);
-
-  // Handle clear and save scheduling settings
-  const handleClearSchedulingSettings = useCallback(async () => {
-    // Clear all local state first
-    onTotalDurationChange(null);
-    onIsSplittableChange(false);
-    onMinSplitDurationChange(null);
-    onMaxSplitDurationChange(null);
-    onCalendarHoursChange(null);
-    onAutoScheduleChange(false);
-
-    // Save cleared settings to database
-    const clearedSettings: SchedulingSettings = {
-      totalDuration: null,
-      isSplittable: false,
-      minSplitDurationMinutes: null,
-      maxSplitDurationMinutes: null,
-      calendarHours: null,
-      autoSchedule: false,
-    };
-    const success = await onSaveSchedulingSettings(clearedSettings);
-    if (success) {
-      setLastSavedSettings(clearedSettings);
-      setPopoverOpen('scheduling', false);
-    }
-  }, [
-    onTotalDurationChange,
-    onIsSplittableChange,
-    onMinSplitDurationChange,
-    onMaxSplitDurationChange,
-    onCalendarHoursChange,
-    onAutoScheduleChange,
-    onSaveSchedulingSettings,
-    setPopoverOpen,
-  ]);
-
-  // Note: Manual scheduling removed - handled by Smart Schedule button in Calendar
-
-  // Handlers for duration inputs
-  const handleDurationHoursChange = useCallback(
-    (hours: number) => {
-      const clampedHours = Math.max(0, hours);
-      const totalHours = (clampedHours * 60 + durationMinutes) / 60;
-      onTotalDurationChange(totalHours > 0 ? totalHours : null);
-    },
-    [durationMinutes, onTotalDurationChange]
-  );
-
-  const handleDurationMinutesChange = useCallback(
-    (minutes: number, direction?: 'increment' | 'decrement') => {
-      let newHours = durationHours;
-      let newMinutes = minutes;
-
-      // Handle rollover for increment/decrement
-      if (direction === 'increment' && minutes > 45) {
-        newMinutes = 0;
-        newHours = durationHours + 1;
-      } else if (direction === 'decrement' && minutes < 0) {
-        if (durationHours > 0) {
-          newMinutes = 45;
-          newHours = durationHours - 1;
-        } else {
-          newMinutes = 0;
-        }
-      } else {
-        // For direct input, snap to nearest 15-minute interval
-        newMinutes = Math.round(minutes / 15) * 15;
-        if (newMinutes >= 60) {
-          newMinutes = 0;
-          newHours = durationHours + 1;
-        }
-      }
-
-      const totalHours = (newHours * 60 + newMinutes) / 60;
-      onTotalDurationChange(totalHours > 0 ? totalHours : null);
-    },
-    [durationHours, onTotalDurationChange]
-  );
-
-  const handleSplittableChange = useCallback(
-    (checked: boolean) => {
-      onIsSplittableChange(checked);
-      // Set defaults when enabling
-      if (checked) {
-        if (minSplitDurationMinutes === null) {
-          onMinSplitDurationChange(30);
-        }
-        if (maxSplitDurationMinutes === null) {
-          onMaxSplitDurationChange(120);
-        }
-      }
-    },
-    [
-      minSplitDurationMinutes,
-      maxSplitDurationMinutes,
-      onIsSplittableChange,
-      onMinSplitDurationChange,
-      onMaxSplitDurationChange,
-    ]
-  );
-
-  const estimationIndices: number[] = useMemo(() => {
-    return boardConfig?.estimation_type
-      ? buildEstimationIndices({
-          extended: boardConfig?.extended_estimation,
-          allowZero: boardConfig?.allow_zero_estimates,
-        })
-      : [];
-  }, [
-    boardConfig?.estimation_type,
-    boardConfig?.extended_estimation,
-    boardConfig?.allow_zero_estimates,
-  ]);
-
-  const handleEndDateChange = useCallback(
-    (date: Date | undefined) => {
-      if (date) {
-        let selectedDate = dayjs(date);
-        if (
-          selectedDate.hour() === 0 &&
-          selectedDate.minute() === 0 &&
-          selectedDate.second() === 0 &&
-          selectedDate.millisecond() === 0
-        ) {
-          selectedDate = selectedDate.endOf('day');
-        }
-        // If both start and end dates are empty, set start date to start of today
-        if (!startDate && !endDate) {
-          onStartDateChange(dayjs().startOf('day').toDate());
-        }
-        onEndDateChange(selectedDate.toDate());
-      } else {
-        onEndDateChange(undefined);
-      }
-    },
-    [startDate, endDate, onStartDateChange, onEndDateChange]
-  );
-
-  // Wrapper for quick due date that also sets start date if both are empty
-  const handleQuickDueDate = useCallback(
-    (days: number | null) => {
-      // If both start and end dates are empty, set start date to start of today
-      if (!startDate && !endDate && days !== null) {
-        onStartDateChange(dayjs().startOf('day').toDate());
-      }
-      onQuickDueDate(days);
-    },
-    [startDate, endDate, onStartDateChange, onQuickDueDate]
-  );
-
-  return (
-    <div className={cn(!isCompact && 'border-y bg-muted/30')}>
-      {/* Header with toggle button */}
-      {!isCompact && (
-        <button
-          type="button"
-          onClick={() => setIsMetadataExpanded(!isMetadataExpanded)}
-          className="flex w-full items-center justify-between px-4 py-2.5 text-left transition-colors hover:bg-muted/50 md:px-8"
-        >
-          <div className="flex min-w-0 flex-1 items-center gap-2">
-            <ChevronDown
-              className={cn(
-                'h-4 w-4 shrink-0 text-muted-foreground transition-transform duration-200',
-                !isMetadataExpanded && '-rotate-90'
-              )}
-            />
-            <span className="shrink-0 font-semibold text-foreground text-sm">
-              {t('ws-task-boards.dialog.properties')}
-            </span>
-
-            {/* Summary badges when collapsed */}
-            {!isMetadataExpanded && (
-              <div className="scrollbar-hide ml-2 flex min-w-0 flex-1 items-center gap-1.5 overflow-x-auto">
-                {priority && (
-                  <Badge
-                    variant="secondary"
-                    className={cn(
-                      'h-5 shrink-0 gap-1 border px-2 font-medium text-[10px]',
-                      PRIORITY_BADGE_COLORS[priority]
-                    )}
-                  >
-                    {getPriorityIcon(priority, 'h-2.5 w-2.5')}
-                    {t(`tasks.priority_${priority}`)}
-                  </Badge>
-                )}
-                {selectedListId && (
-                  <Badge
-                    variant="secondary"
-                    className={cn(
-                      'h-5 shrink-0 gap-1 border px-2 font-medium text-[10px]',
-                      listSummarySurfaceClass ??
-                        'border-border bg-muted/50 text-muted-foreground'
-                    )}
-                  >
-                    <ListSummaryTriggerIcon className="h-2.5 w-2.5" />
-                    {selectedListForSummary
-                      ? translateTaskListNameForDisplay(
-                          selectedListForSummary.name,
-                          listNameLabels
-                        )
-                      : t('ws-task-boards.dialog.field.list')}
-                  </Badge>
-                )}
-                {(startDate || endDate) && (
-                  <Badge
-                    variant="secondary"
-                    className="h-5 shrink-0 gap-1 border border-dynamic-orange/30 bg-dynamic-orange/15 px-2 font-medium text-[10px] text-dynamic-orange"
-                  >
-                    <Calendar className="h-2.5 w-2.5" />
-                    {startDate || endDate
-                      ? `${startDate ? new Date(startDate).toLocaleDateString(t('common.locale', { defaultValue: 'en-US' }), { month: 'short', day: 'numeric' }) : t('ws-task-boards.dialog.field.start_date')} → ${endDate ? new Date(endDate).toLocaleDateString(t('common.locale', { defaultValue: 'en-US' }), { month: 'short', day: 'numeric' }) : t('ws-task-boards.dialog.field.end_date')}`
-                      : t('ws-task-boards.dialog.field.end_date')}
-                  </Badge>
-                )}
-                {estimationPoints != null && (
-                  <Badge
-                    variant="secondary"
-                    className="h-5 shrink-0 gap-1 border border-dynamic-purple/30 bg-dynamic-purple/15 px-2 font-medium text-[10px] text-dynamic-purple"
-                  >
-                    <Timer className="h-2.5 w-2.5" />
-                    {boardConfig?.estimation_type
-                      ? mapEstimationPoints(
-                          estimationPoints,
-                          boardConfig.estimation_type
-                        )
-                      : t('ws-task-boards.dialog.field.estimation')}
-                  </Badge>
-                )}
-                {selectedLabels.length > 0 && (
-                  <Badge
-                    variant="secondary"
-                    className="h-5 shrink-0 gap-1 border border-dynamic-indigo/30 bg-dynamic-indigo/15 px-2 font-medium text-[10px] text-dynamic-indigo"
-                  >
-                    <Tag className="h-2.5 w-2.5" />
-                    {selectedLabels.length === 1
-                      ? selectedLabels[0]?.name
-                      : t('common.n_labels', { count: selectedLabels.length })}
-                  </Badge>
-                )}
-                {selectedProjects.length > 0 && (
-                  <Badge
-                    variant="secondary"
-                    className="h-5 shrink-0 gap-1 border border-dynamic-sky/30 bg-dynamic-sky/15 px-2 font-medium text-[10px] text-dynamic-sky"
-                  >
-                    <Box className="h-2.5 w-2.5" />
-                    {selectedProjects.length === 1
-                      ? selectedProjects[0]?.name
-                      : t('common.n_projects', {
-                          count: selectedProjects.length,
-                        })}
-                  </Badge>
-                )}
-                {selectedAssignees.length > 0 && canUseBoardAssignees && (
-                  <Badge
-                    variant="secondary"
-                    className="h-5 shrink-0 gap-1 border border-dynamic-cyan/30 bg-dynamic-cyan/15 px-2 font-medium text-[10px] text-dynamic-cyan"
-                  >
-                    <Users className="h-2.5 w-2.5" />
-                    {selectedAssignees.length === 1
-                      ? selectedAssignees[0]?.display_name ||
-                        t('ws-task-boards.dialog.unknown_user')
-                      : t('common.n_assignees', {
-                          count: selectedAssignees.length,
-                        })}
-                  </Badge>
-                )}
-                {totalMinutes > 0 && (
-                  <Badge
-                    variant="secondary"
-                    className={cn(
-                      'h-5 shrink-0 gap-1 border px-2 font-medium text-[10px]',
-                      !disabled && hasUnsavedSchedulingChanges
-                        ? 'border-dynamic-yellow/50 border-dashed bg-dynamic-yellow/15 text-dynamic-yellow'
-                        : 'border-dynamic-teal/30 bg-dynamic-teal/15 text-dynamic-teal'
-                    )}
-                  >
-                    {!disabled && hasUnsavedSchedulingChanges ? (
-                      <AlertCircle className="h-2.5 w-2.5" />
-                    ) : (
-                      <CalendarClock className="h-2.5 w-2.5" />
-                    )}
-                    {formatDuration(totalMinutes, t)}
-                    {!disabled && hasUnsavedSchedulingChanges && (
-                      <span className="text-[8px] opacity-75">
-                        {t('ws-task-boards.dialog.unsaved')}
-                      </span>
-                    )}
-                  </Badge>
-                )}
-              </div>
-            )}
-          </div>
-        </button>
-      )}
-
-      {/* Expandable badges section */}
-      {(isCompact || isMetadataExpanded) && (
-        <div
-          className={cn(isCompact ? 'px-0 py-0' : 'border-t px-4 py-3 md:px-8')}
-        >
-          <div
-            className={cn(
-              'flex flex-wrap items-center',
-              isCompact ? 'gap-1.5' : 'gap-2'
-            )}
-          >
-            {/* Priority Badge */}
-            <Popover
-              open={isPopoverOpen('priority')}
-              onOpenChange={(open) => setPopoverOpen('priority', open)}
-            >
-              <TaskPropertyPopoverTrigger
-                compact={isCompact}
-                label={
-                  priority
-                    ? t(`tasks.priority_${priority}`)
-                    : t('common.priority')
-                }
-                popoverId="priority"
-              >
-                <button
-                  type="button"
-                  disabled={disabled}
-                  aria-label={
-                    priority
-                      ? t(`tasks.priority_${priority}`)
-                      : t('common.priority')
-                  }
-                  className={cn(
-                    triggerBaseClass,
-                    priority
-                      ? PRIORITY_BADGE_COLORS[priority]
-                      : 'border-input bg-background text-foreground hover:bg-muted',
-                    disabled && 'cursor-not-allowed opacity-50'
-                  )}
-                >
-                  {priority ? (
-                    getPriorityIcon(priority, 'h-3.5 w-3.5')
-                  ) : (
-                    <Flag className="h-3.5 w-3.5" />
-                  )}
-                  <span className={compactLabelClass}>
-                    {priority
-                      ? t(`tasks.priority_${priority}`)
-                      : t('common.priority')}
-                  </span>
-                </button>
-              </TaskPropertyPopoverTrigger>
-              <PopoverContent
-                align="start"
-                className="w-56 p-0"
-                {...propertyPopoverContentProps}
-              >
-                <div className="p-1">
-                  {[
-                    {
-                      value: 'critical',
-                      label: t('tasks.priority_critical'),
-                      color: 'text-dynamic-red',
-                    },
-                    {
-                      value: 'high',
-                      label: t('tasks.priority_high'),
-                      color: 'text-dynamic-orange',
-                    },
-                    {
-                      value: 'normal',
-                      label: t('tasks.priority_normal'),
-                      color: 'text-dynamic-yellow',
-                    },
-                    {
-                      value: 'low',
-                      label: t('tasks.priority_low'),
-                      color: 'text-dynamic-blue',
-                    },
-                  ].map((opt) => (
-                    <button
-                      key={opt.value}
-                      type="button"
-                      onClick={() => {
-                        onPriorityChange(opt.value as TaskPriority);
-                        setPopoverOpen('priority', false);
-                      }}
-                      className={cn(
-                        'flex w-full items-center gap-2.5 rounded-md px-2 py-2 text-left text-sm transition-colors hover:bg-muted',
-                        priority === opt.value && 'bg-muted font-medium'
-                      )}
-                    >
-                      {getPriorityIcon(
-                        opt.value as TaskPriority,
-                        cn('h-4 w-4', opt.color)
-                      )}
-                      <span className="flex-1">{opt.label}</span>
-                      {priority === opt.value && (
-                        <Check className="h-4 w-4 shrink-0 text-primary" />
-                      )}
-                    </button>
-                  ))}
-                  {priority && (
-                    <ClearMenuItem
-                      label={t('ws-task-boards.dialog.clear_priority')}
-                      onClick={() => {
-                        onPriorityChange(null);
-                        setPopoverOpen('priority', false);
-                      }}
-                    />
-                  )}
-                </div>
-              </PopoverContent>
-            </Popover>
-
-            <TaskListSelector
-              wsId={wsId}
-              boardId={boardId}
-              selectedListId={selectedListId}
-              availableLists={availableLists}
-              disabled={disabled}
-              compact={isCompact}
-              open={isPopoverOpen('list')}
-              onOpenChange={(open) => setPopoverOpen('list', open)}
-              onPopoverCloseAutoFocus={handlePropertyPopoverCloseAutoFocus}
-              onPopoverInteractOutside={handlePropertyPopoverInteractOutside}
-              onListChange={onListChange}
-              propertyPopoverId="list"
-            />
-
-            {/* Dates Badge */}
-            <Popover
-              open={isPopoverOpen('dates')}
-              onOpenChange={(open) => setPopoverOpen('dates', open)}
-            >
-              <TaskPropertyPopoverTrigger
-                compact={isCompact}
-                label={
-                  startDate || endDate
-                    ? `${startDate ? new Date(startDate).toLocaleDateString(t('common.locale', { defaultValue: 'en-US' }), { month: 'short', day: 'numeric' }) : t('ws-task-boards.dialog.no_start_date')} → ${endDate ? new Date(endDate).toLocaleDateString(t('common.locale', { defaultValue: 'en-US' }), { month: 'short', day: 'numeric' }) : t('ws-task-boards.dialog.no_due_date')}`
-                    : t('ws-task-boards.dialog.dates')
-                }
-                popoverId="dates"
-              >
-                <button
-                  type="button"
-                  disabled={disabled}
-                  aria-label={t('ws-task-boards.dialog.dates')}
-                  className={cn(
-                    triggerBaseClass,
-                    startDate || endDate
-                      ? 'border-dynamic-orange/30 bg-dynamic-orange/15 text-dynamic-orange hover:border-dynamic-orange/50 hover:bg-dynamic-orange/20'
-                      : 'border-border bg-background text-muted-foreground hover:border-primary/30 hover:bg-muted hover:text-foreground',
-                    disabled && 'cursor-not-allowed opacity-50'
-                  )}
-                >
-                  <Calendar className="h-3.5 w-3.5" />
-                  <span className={compactLabelClass}>
-                    {startDate || endDate
-                      ? `${startDate ? new Date(startDate).toLocaleDateString(t('common.locale', { defaultValue: 'en-US' }), { month: 'short', day: 'numeric' }) : t('ws-task-boards.dialog.no_start_date')} → ${endDate ? new Date(endDate).toLocaleDateString(t('common.locale', { defaultValue: 'en-US' }), { month: 'short', day: 'numeric' }) : t('ws-task-boards.dialog.no_due_date')}`
-                      : t('ws-task-boards.dialog.dates')}
-                  </span>
-                </button>
-              </TaskPropertyPopoverTrigger>
-              <PopoverContent
-                align="start"
-                className="w-80 p-0"
-                {...propertyPopoverContentProps}
-              >
-                <div className="rounded-lg p-3.5">
-                  <div className="space-y-3">
-                    {/* Start Date */}
-                    <div className="space-y-1.5">
-                      <Label className="font-normal text-muted-foreground text-xs">
-                        {t('ws-task-boards.dialog.start_date')}
-                      </Label>
-                      <DateTimePicker
-                        date={startDate}
-                        setDate={onStartDateChange}
-                        showTimeSelect={true}
-                        allowClear={true}
-                        showFooterControls={true}
-                        maxDate={endDate}
-                        preferences={{ weekStartsOn, timezone, timeFormat }}
-                      />
-                    </div>
-
-                    {/* Due Date */}
-                    <div className="space-y-1.5">
-                      <Label className="font-normal text-muted-foreground text-xs">
-                        {t('ws-task-boards.dialog.due_date')}
-                      </Label>
-                      <DateTimePicker
-                        date={endDate}
-                        setDate={handleEndDateChange}
-                        showTimeSelect={true}
-                        allowClear={true}
-                        showFooterControls={true}
-                        minDate={startDate}
-                        preferences={{ weekStartsOn, timezone, timeFormat }}
-                      />
-
-                      {/* Date Range Warning */}
-                      {startDate && endDate && startDate > endDate && (
-                        <div className="flex items-center gap-2 rounded-md border border-dynamic-orange/30 bg-dynamic-orange/10 px-3 py-2 text-xs">
-                          <AlertTriangle className="h-3.5 w-3.5 shrink-0 text-dynamic-orange" />
-                          <span className="text-dynamic-orange">
-                            {t(
-                              'ws-task-boards.dialog.start_date_after_due_date'
-                            )}
-                          </span>
-                        </div>
-                      )}
-
-                      {/* Quick Due Date Actions */}
-                      <div className="space-y-1.5 pt-2">
-                        <Label className="font-normal text-muted-foreground text-xs">
-                          {t('ws-task-boards.dialog.quick_actions')}
-                        </Label>
-                        <div className="grid grid-cols-2 gap-1.5 md:gap-2">
-                          <Button
-                            type="button"
-                            variant="outline"
-                            size="xs"
-                            onClick={() => handleQuickDueDate(0)}
-                            disabled={isLoading}
-                            className="h-7 text-[11px] transition-all hover:border-dynamic-orange/50 hover:bg-dynamic-orange/5 md:text-xs"
-                          >
-                            {t('common.today')}
-                          </Button>
-                          <Button
-                            type="button"
-                            variant="outline"
-                            size="xs"
-                            onClick={() => handleQuickDueDate(1)}
-                            disabled={isLoading}
-                            className="h-7 text-[11px] transition-all hover:border-dynamic-orange/50 hover:bg-dynamic-orange/5 md:text-xs"
-                          >
-                            {t('common.tomorrow')}
-                          </Button>
-                          <Button
-                            type="button"
-                            variant="outline"
-                            size="xs"
-                            onClick={() => {
-                              // Calculate days until end of week (respects first day of week setting)
-                              const endOfWeekDay =
-                                ((weekStartsOn ?? 0) - 1 + 7) % 7;
-                              const daysUntilEnd =
-                                (endOfWeekDay - dayjs().day() + 7) % 7;
-                              handleQuickDueDate(daysUntilEnd);
-                            }}
-                            disabled={isLoading}
-                            className="h-7 text-[11px] transition-all hover:border-dynamic-orange/50 hover:bg-dynamic-orange/5 md:text-xs"
-                          >
-                            {t('common.this_week')}
-                          </Button>
-                          <Button
-                            type="button"
-                            variant="outline"
-                            size="xs"
-                            onClick={() => {
-                              // Calculate days until end of next week (respects first day of week setting)
-                              const endOfWeekDay =
-                                ((weekStartsOn ?? 0) - 1 + 7) % 7;
-                              const daysUntilEnd =
-                                (endOfWeekDay - dayjs().day() + 7) % 7;
-                              handleQuickDueDate(daysUntilEnd + 7);
-                            }}
-                            disabled={isLoading}
-                            className="h-7 text-[11px] transition-all hover:border-dynamic-orange/50 hover:bg-dynamic-orange/5 md:text-xs"
-                          >
-                            {t('common.next_week')}
-                          </Button>
-                        </div>
-                      </div>
-                    </div>
-                  </div>
-                </div>
-              </PopoverContent>
-            </Popover>
-
-            {/* Estimation Points Badge */}
-            <Popover
-              open={isPopoverOpen('estimation')}
-              onOpenChange={(open) => setPopoverOpen('estimation', open)}
-            >
-              <TaskPropertyPopoverTrigger
-                compact={isCompact}
-                label={
-                  boardConfig?.estimation_type && estimationPoints != null
-                    ? mapEstimationPoints(
-                        estimationPoints,
-                        boardConfig.estimation_type
-                      )
-                    : t('ws-task-boards.dialog.estimate')
-                }
-                popoverId="estimation"
-              >
-                <button
-                  type="button"
-                  disabled={disabled}
-                  aria-label={t('ws-task-boards.dialog.estimate')}
-                  className={cn(
-                    triggerBaseClass,
-                    estimationPoints != null
-                      ? 'border-dynamic-purple/30 bg-dynamic-purple/15 text-dynamic-purple hover:border-dynamic-purple/50 hover:bg-dynamic-purple/20'
-                      : 'border-border bg-background text-muted-foreground hover:border-primary/30 hover:bg-muted hover:text-foreground',
-                    disabled && 'cursor-not-allowed opacity-50'
-                  )}
-                >
-                  <Timer className="h-3.5 w-3.5" />
-                  <span className={compactLabelClass}>
-                    {boardConfig?.estimation_type
-                      ? estimationPoints != null
-                        ? mapEstimationPoints(
-                            estimationPoints,
-                            boardConfig.estimation_type
-                          )
-                        : t('ws-task-boards.dialog.estimate')
-                      : t('ws-task-boards.dialog.estimate')}
-                  </span>
-                </button>
-              </TaskPropertyPopoverTrigger>
-              <PopoverContent
-                align="start"
-                className="w-64 p-0"
-                {...propertyPopoverContentProps}
-              >
-                {!boardConfig?.estimation_type ? (
-                  <EmptyStateCard
-                    title={t('ws-task-boards.dialog.no_estimation_configured')}
-                    description={t(
-                      'ws-task-boards.dialog.configure_estimation_description'
-                    )}
-                    actionLabel={t('common.configure')}
-                    ActionIcon={Pen}
-                    onAction={() => {
-                      setPopoverOpen('estimation', false);
-                      onShowEstimationConfigDialog();
-                    }}
-                  />
-                ) : (
-                  <div className="p-1">
-                    {estimationIndices.map((idx) => (
-                      <button
-                        key={idx}
-                        type="button"
-                        onClick={() => {
-                          onEstimationChange(idx);
-                          setPopoverOpen('estimation', false);
-                        }}
-                        className={cn(
-                          'flex w-full items-center gap-2 rounded-md px-2 py-2 text-left text-sm transition-colors hover:bg-muted',
-                          estimationPoints === idx && 'bg-muted font-medium'
-                        )}
-                      >
-                        <Timer className="h-4 w-4 text-dynamic-purple" />
-                        <span className="flex-1">
-                          {mapEstimationPoints(
-                            idx,
-                            boardConfig.estimation_type
-                          )}
-                        </span>
-                        {estimationPoints === idx && (
-                          <Check className="h-4 w-4 shrink-0 text-primary" />
-                        )}
-                      </button>
-                    ))}
-                    {estimationPoints != null && (
-                      <ClearMenuItem
-                        label={t('ws-task-boards.dialog.clear_estimate')}
-                        onClick={() => {
-                          onEstimationChange(null);
-                          setPopoverOpen('estimation', false);
-                        }}
-                      />
-                    )}
-                  </div>
-                )}
-              </PopoverContent>
-            </Popover>
-
-            {/* Labels Badge */}
-            <Popover
-              open={isPopoverOpen('labels')}
-              onOpenChange={(open) => {
-                setPopoverOpen('labels', open);
-                if (!open) setLabelSearchQuery('');
-              }}
-            >
-              <TaskPropertyPopoverTrigger
-                compact={isCompact}
-                label={
-                  selectedLabels.length === 0
-                    ? t('common.labels')
-                    : selectedLabels.length === 1
-                      ? selectedLabels[0]?.name
-                      : t('common.n_labels', {
-                          count: selectedLabels.length,
-                        })
-                }
-                popoverId="labels"
-              >
-                <button
-                  type="button"
-                  disabled={disabled}
-                  aria-label={t('common.labels')}
-                  className={cn(
-                    triggerBaseClass,
-                    selectedLabels.length > 0
-                      ? 'border-dynamic-indigo/30 bg-dynamic-indigo/15 text-dynamic-indigo hover:border-dynamic-indigo/50 hover:bg-dynamic-indigo/20'
-                      : 'border-border bg-background text-muted-foreground hover:border-primary/30 hover:bg-muted hover:text-foreground',
-                    disabled && 'cursor-not-allowed opacity-50'
-                  )}
-                >
-                  <Tag className="h-3.5 w-3.5" />
-                  <span className={compactLabelClass}>
-                    {selectedLabels.length === 0
-                      ? t('common.labels')
-                      : selectedLabels.length === 1
-                        ? selectedLabels[0]?.name
-                        : t('common.n_labels', {
-                            count: selectedLabels.length,
-                          })}
-                  </span>
-                </button>
-              </TaskPropertyPopoverTrigger>
-              <PopoverContent
-                align="start"
-                className="w-72 p-0"
-                {...propertyPopoverContentProps}
-              >
-                {availableLabels.length === 0 ? (
-                  <EmptyStateCard
-                    title={t('ws-task-boards.dialog.no_labels_configured')}
-                    description={t(
-                      'ws-task-boards.dialog.create_labels_description'
-                    )}
-                    actionLabel={t('ws-task-boards.dialog.create_label')}
-                    ActionIcon={Plus}
-                    onAction={() => {
-                      setPopoverOpen('labels', false);
-                      onShowNewLabelDialog();
-                    }}
-                  />
-                ) : (
-                  <>
-                    {selectedLabels.length > 0 && (
-                      <div className="border-b p-2">
-                        <div className="flex flex-wrap gap-1.5">
-                          {selectedLabels.map((label) => {
-                            const styles = computeAccessibleLabelStyles(
-                              label.color
-                            );
-                            return (
-                              <Badge
-                                key={label.id}
-                                variant="secondary"
-                                className={cn(
-                                  'h-6 cursor-pointer gap-1 px-2 text-xs transition-opacity hover:opacity-80',
-                                  disabled && 'pointer-events-none'
-                                )}
-                                style={
-                                  styles
-                                    ? {
-                                        backgroundColor: styles.bg,
-                                        borderColor: styles.border,
-                                        color: styles.text,
-                                      }
-                                    : undefined
-                                }
-                                onClick={() =>
-                                  !disabled && onLabelToggle(label)
-                                }
-                              >
-                                {label.name}
-                                {!disabled && <X className="h-2.5 w-2.5" />}
-                              </Badge>
-                            );
-                          })}
-                        </div>
-                      </div>
-                    )}
-                    <TaskResourceSearchField
-                      value={labelSearchQuery}
-                      onChange={setLabelSearchQuery}
-                      placeholder={t('common.search_labels')}
-                    />
-                    <div
-                      className="max-h-60 overflow-y-auto overscroll-contain"
-                      onWheel={(e) => e.stopPropagation()}
-                    >
-                      <div className="p-1">
-                        {labelSearchQuery &&
-                        unselectedAvailableLabels.length > 0 &&
-                        filteredUnselectedLabels.length === 0 ? (
-                          <div className="px-2 py-4 text-center text-muted-foreground text-xs">
-                            {t('common.no_labels_found')}
-                          </div>
-                        ) : (
-                          filteredUnselectedLabels.map((label) => (
-                            <button
-                              key={label.id}
-                              type="button"
-                              onClick={() => onLabelToggle(label)}
-                              className="flex w-full items-center rounded-md px-2 py-1.5 text-left transition-colors hover:bg-muted"
-                            >
-                              <LabelChip
-                                label={label}
-                                showIcon={false}
-                                className="h-6 px-2 text-xs"
-                              />
-                            </button>
-                          ))
-                        )}
-                      </div>
-                    </div>
-                    <div className="border-t p-2">
-                      <Button
-                        size="sm"
-                        variant="ghost"
-                        onClick={() => {
-                          setPopoverOpen('labels', false);
-                          onShowNewLabelDialog();
-                        }}
-                        className="h-8 w-full justify-start"
-                      >
-                        <Plus className="mr-1.5 h-3.5 w-3.5" />
-                        {t('ws-task-boards.dialog.create_new_label')}
-                      </Button>
-                    </div>
-                  </>
-                )}
-              </PopoverContent>
-            </Popover>
-
-            {/* Projects Badge — not available for drafts */}
-            {!isDraftMode && (
-              <Popover
-                open={isPopoverOpen('projects')}
-                onOpenChange={(open) => {
-                  setPopoverOpen('projects', open);
-                  if (!open) setProjectSearchQuery('');
-                }}
-              >
-                <TaskPropertyPopoverTrigger
-                  compact={isCompact}
-                  label={
-                    selectedProjects.length === 0
-                      ? t('common.projects')
-                      : selectedProjects.length === 1
-                        ? selectedProjects[0]?.name
-                        : t('common.n_projects', {
-                            count: selectedProjects.length,
-                          })
-                  }
-                  popoverId="projects"
-                >
-                  <button
-                    type="button"
-                    disabled={disabled}
-                    aria-label={t('common.projects')}
-                    className={cn(
-                      triggerBaseClass,
-                      selectedProjects.length > 0
-                        ? 'border-dynamic-sky/30 bg-dynamic-sky/15 text-dynamic-sky hover:border-dynamic-sky/50 hover:bg-dynamic-sky/20'
-                        : 'border-border bg-background text-muted-foreground hover:border-primary/30 hover:bg-muted hover:text-foreground',
-                      disabled && 'cursor-not-allowed opacity-50'
-                    )}
-                  >
-                    <Box className="h-3.5 w-3.5" />
-                    <span className={compactLabelClass}>
-                      {selectedProjects.length === 0
-                        ? t('common.projects')
-                        : selectedProjects.length === 1
-                          ? selectedProjects[0]?.name
-                          : t('common.n_projects', {
-                              count: selectedProjects.length,
-                            })}
-                    </span>
-                  </button>
-                </TaskPropertyPopoverTrigger>
-                <PopoverContent
-                  align="start"
-                  className="w-72 p-0"
-                  {...propertyPopoverContentProps}
-                >
-                  {taskProjects.length === 0 ? (
-                    <EmptyStateCard
-                      title={t('ws-task-boards.dialog.no_projects_configured')}
-                      description={t(
-                        'ws-task-boards.dialog.create_projects_description'
-                      )}
-                      actionLabel={t('ws-task-boards.dialog.create_project')}
-                      ActionIcon={Plus}
-                      onAction={() => {
-                        setPopoverOpen('projects', false);
-                        onShowNewProjectDialog();
-                      }}
-                    />
-                  ) : (
-                    <>
-                      {selectedProjects.length > 0 && (
-                        <div className="border-b p-2">
-                          <div className="flex flex-wrap gap-1.5">
-                            {selectedProjects.map((project) => (
-                              <Badge
-                                key={project.id}
-                                variant="secondary"
-                                className={cn(
-                                  'item-center h-auto cursor-pointer gap-1 whitespace-normal border-dynamic-sky/30 bg-dynamic-sky/10 px-2 text-dynamic-sky text-xs transition-opacity hover:opacity-80',
-                                  disabled && 'pointer-events-none'
-                                )}
-                                onClick={() =>
-                                  !disabled && onProjectToggle(project)
-                                }
-                              >
-                                <span className="wrap-break-word">
-                                  {project.name}
-                                </span>
-                                {!disabled && (
-                                  <X className="h-2.5 w-2.5 shrink-0" />
-                                )}
-                              </Badge>
-                            ))}
-                          </div>
-                        </div>
-                      )}
-                      <TaskResourceSearchField
-                        value={projectSearchQuery}
-                        onChange={setProjectSearchQuery}
-                        placeholder={t('common.search_projects')}
-                      />
-                      <div
-                        className="max-h-60 overflow-y-auto overscroll-contain"
-                        onWheel={(e) => e.stopPropagation()}
-                      >
-                        <div className="p-1">
-                          {projectSearchQuery &&
-                          unselectedTaskProjects.length > 0 &&
-                          filteredUnselectedProjects.length === 0 ? (
-                            <div className="px-2 py-4 text-center text-muted-foreground text-xs">
-                              {t('common.no_projects_found')}
-                            </div>
-                          ) : (
-                            filteredUnselectedProjects.map((project) => (
-                              <button
-                                key={project.id}
-                                type="button"
-                                onClick={() => onProjectToggle(project)}
-                                className="flex w-full items-center gap-2 rounded-md px-2 py-2 text-left text-sm transition-colors hover:bg-muted"
-                              >
-                                <Box className="h-4 w-4 text-dynamic-sky" />
-                                <span className="wrap-break-word flex-1 whitespace-normal">
-                                  {project.name}
-                                </span>
-                              </button>
-                            ))
-                          )}
-                        </div>
-                      </div>
-                      <div className="border-t p-2">
-                        <Button
-                          size="sm"
-                          variant="ghost"
-                          onClick={() => {
-                            setPopoverOpen('projects', false);
-                            onShowNewProjectDialog();
-                          }}
-                          className="h-8 w-full justify-start"
-                        >
-                          <Plus className="mr-1.5 h-3.5 w-3.5" />
-                          {t('ws-task-boards.dialog.create_new_project')}
-                        </Button>
-                      </div>
-                    </>
-                  )}
-                </PopoverContent>
-              </Popover>
-            )}
-
-            {/* Assignees Badge */}
-            {canUseBoardAssignees && (
-              <Popover
-                open={isPopoverOpen('assignees')}
-                onOpenChange={(open) => {
-                  setPopoverOpen('assignees', open);
-                  if (!open) setAssigneeSearchQuery('');
-                }}
-              >
-                <TaskPropertyPopoverTrigger
-                  compact={isCompact}
-                  label={
-                    selectedAssignees.length === 0
-                      ? t('common.assignees')
-                      : selectedAssignees.length === 1
-                        ? selectedAssignees[0]?.display_name ||
-                          t('ws-task-boards.dialog.unknown_user')
-                        : t('common.n_assignees', {
-                            count: selectedAssignees.length,
-                          })
-                  }
-                  popoverId="assignees"
-                >
-                  <button
-                    type="button"
-                    disabled={disabled}
-                    aria-label={t('common.assignees')}
-                    className={cn(
-                      triggerBaseClass,
-                      selectedAssignees.length > 0
-                        ? 'border-dynamic-cyan/30 bg-dynamic-cyan/15 text-dynamic-cyan hover:border-dynamic-cyan/50 hover:bg-dynamic-cyan/20'
-                        : 'border-border bg-background text-muted-foreground hover:border-primary/30 hover:bg-muted hover:text-foreground',
-                      disabled && 'cursor-not-allowed opacity-50'
-                    )}
-                  >
-                    <Users className="h-3.5 w-3.5" />
-                    <span className={compactLabelClass}>
-                      {selectedAssignees.length === 0
-                        ? t('common.assignees')
-                        : selectedAssignees.length === 1
-                          ? selectedAssignees[0]?.display_name ||
-                            t('ws-task-boards.dialog.unknown_user')
-                          : t('common.n_assignees', {
-                              count: selectedAssignees.length,
-                            })}
-                    </span>
-                  </button>
-                </TaskPropertyPopoverTrigger>
-                <PopoverContent
-                  align="start"
-                  className="w-72 p-0"
-                  {...propertyPopoverContentProps}
-                >
-                  {workspaceMembers.length === 0 ? (
-                    <div className="p-4 text-center text-muted-foreground text-sm">
-                      {t('ws-task-boards.dialog.no_members_found')}
-                    </div>
-                  ) : (
-                    <>
-                      {selectedAssignees.length > 0 && (
-                        <div className="border-b p-2">
-                          <div className="flex flex-wrap gap-1.5">
-                            {selectedAssignees.map((assignee, index) => (
-                              <Badge
-                                key={
-                                  assignee.id ||
-                                  assignee.user_id ||
-                                  `assignee-${index}`
-                                }
-                                variant="secondary"
-                                className={cn(
-                                  'h-6 cursor-pointer gap-1.5 px-2 text-xs transition-opacity hover:opacity-80',
-                                  disabled && 'pointer-events-none'
-                                )}
-                                onClick={() =>
-                                  !disabled && onAssigneeToggle(assignee)
-                                }
-                              >
-                                <UserAvatar user={assignee} size="xs" />
-                                {assignee.display_name ||
-                                  t('ws-task-boards.dialog.unknown_user')}
-                                {!disabled && <X className="h-2.5 w-2.5" />}
-                              </Badge>
-                            ))}
-                          </div>
-                        </div>
-                      )}
-                      <TaskResourceSearchField
-                        value={assigneeSearchQuery}
-                        onChange={setAssigneeSearchQuery}
-                        placeholder={t('common.search_members')}
-                      />
-                      <div
-                        className="max-h-60 overflow-y-auto overscroll-contain"
-                        onWheel={(e) => e.stopPropagation()}
-                      >
-                        <div className="p-1">
-                          {assigneeSearchQuery &&
-                          unselectedWorkspaceMembers.length > 0 &&
-                          filteredUnselectedMembers.length === 0 ? (
-                            <div className="px-2 py-4 text-center text-muted-foreground text-xs">
-                              {t('common.no_members_found')}
-                            </div>
-                          ) : (
-                            filteredUnselectedMembers.map((member, index) => (
-                              <button
-                                key={
-                                  member.user_id ||
-                                  member.id ||
-                                  `member-${index}`
-                                }
-                                type="button"
-                                onClick={() => onAssigneeToggle(member)}
-                                className="flex w-full items-center gap-2.5 rounded-md px-2 py-2 text-left text-sm transition-colors hover:bg-muted"
-                              >
-                                <UserAvatar
-                                  user={member}
-                                  size="sm"
-                                  className="shrink-0 border"
-                                />
-                                <span className="flex-1">
-                                  {member.display_name ||
-                                    t('ws-task-boards.dialog.unknown_user')}
-                                </span>
-                                <Plus className="h-4 w-4 shrink-0" />
-                              </button>
-                            ))
-                          )}
-                        </div>
-                      </div>
-                    </>
-                  )}
-                </PopoverContent>
-              </Popover>
-            )}
-
-            {/* Scheduling Badge — not available for drafts */}
-            {!isDraftMode && (
-              <Popover
-                open={isPopoverOpen('scheduling')}
-                onOpenChange={(open) => setPopoverOpen('scheduling', open)}
-              >
-                <TaskPropertyPopoverTrigger
-                  compact={isCompact}
-                  label={
-                    totalMinutes > 0
-                      ? formatDuration(totalMinutes, t)
-                      : t('ws-task-boards.dialog.schedule')
-                  }
-                  popoverId="scheduling"
-                >
-                  <button
-                    type="button"
-                    disabled={disabled}
-                    aria-label={t('ws-task-boards.dialog.schedule')}
-                    className={cn(
-                      triggerBaseClass,
-                      hasUnsavedSchedulingChanges
-                        ? 'border-dynamic-yellow/50 border-dashed bg-dynamic-yellow/10 text-dynamic-yellow hover:border-dynamic-yellow/70 hover:bg-dynamic-yellow/15'
-                        : totalDuration
-                          ? 'border-dynamic-teal/30 bg-dynamic-teal/15 text-dynamic-teal hover:border-dynamic-teal/50 hover:bg-dynamic-teal/20'
-                          : 'border-border bg-background text-muted-foreground hover:border-primary/30 hover:bg-muted hover:text-foreground',
-                      disabled && 'cursor-not-allowed opacity-50'
-                    )}
-                  >
-                    {hasUnsavedSchedulingChanges ? (
-                      <AlertCircle className="h-3.5 w-3.5" />
-                    ) : (
-                      <CalendarClock className="h-3.5 w-3.5" />
-                    )}
-                    <span className={compactLabelClass}>
-                      {totalMinutes > 0
-                        ? formatDuration(totalMinutes, t)
-                        : t('ws-task-boards.dialog.schedule')}
-                    </span>
-                    {!isCompact && !disabled && hasUnsavedSchedulingChanges && (
-                      <span className="text-[10px] opacity-75">
-                        {t('ws-task-boards.dialog.unsaved')}
-                      </span>
-                    )}
-                  </button>
-                </TaskPropertyPopoverTrigger>
-                <PopoverContent
-                  align="start"
-                  className="w-72 p-0"
-                  {...propertyPopoverContentProps}
-                >
-                  <div className="rounded-lg p-3">
-                    <div className="space-y-3">
-                      {/* Duration */}
-                      <div className="space-y-2">
-                        <Label className="flex items-center gap-1.5 font-normal text-muted-foreground text-xs">
-                          <Clock className="h-3.5 w-3.5" />
-                          {t('ws-task-boards.dialog.estimated_duration')}
-                          <span className="text-dynamic-red">*</span>
-                        </Label>
-                        <div className="flex items-center gap-3">
-                          <DurationInput
-                            value={durationHours}
-                            onChange={handleDurationHoursChange}
-                            min={0}
-                            max={999}
-                            disabled={isLoading}
-                            label={t('ws-task-boards.dialog.h')}
-                          />
-                          <DurationInput
-                            value={durationMinutes}
-                            onChange={handleDurationMinutesChange}
-                            min={0}
-                            max={45}
-                            step={15}
-                            disabled={isLoading}
-                            label={t('ws-task-boards.dialog.m')}
-                            allowRollover={true}
-                            canDecrement={
-                              durationHours > 0 || durationMinutes > 0
-                            }
-                          />
-                        </div>
-                      </div>
-
-                      {/* Splittable */}
-                      <div className="flex items-center justify-between">
-                        <Label
-                          htmlFor="splittable"
-                          className="flex cursor-pointer items-center gap-1.5 font-normal text-muted-foreground text-xs"
-                        >
-                          <Scissors className="h-3.5 w-3.5" />
-                          {t('ws-task-boards.dialog.splittable')}
-                        </Label>
-                        <Switch
-                          id="splittable"
-                          checked={isSplittable}
-                          onCheckedChange={handleSplittableChange}
-                          disabled={isLoading}
-                        />
-                      </div>
-
-                      {/* Min/Max Split Duration */}
-                      {isSplittable && (
-                        <div className="grid grid-cols-2 gap-3">
-                          <div className="space-y-1.5">
-                            <Label className="font-normal text-muted-foreground text-xs">
-                              {t('ws-task-boards.dialog.min_split')}
-                            </Label>
-                            <DurationInput
-                              value={minSplitDurationMinutes ?? 30}
-                              onChange={(value) =>
-                                onMinSplitDurationChange(value)
-                              }
-                              min={15}
-                              max={maxSplitDurationMinutes ?? 480}
-                              step={15}
-                              disabled={isLoading}
-                              label={t('ws-task-boards.dialog.min')}
-                            />
-                          </div>
-                          <div className="space-y-1.5">
-                            <Label className="font-normal text-muted-foreground text-xs">
-                              {t('ws-task-boards.dialog.max_split')}
-                            </Label>
-                            <DurationInput
-                              value={maxSplitDurationMinutes ?? 120}
-                              onChange={(value) =>
-                                onMaxSplitDurationChange(value)
-                              }
-                              min={minSplitDurationMinutes ?? 15}
-                              max={480}
-                              step={15}
-                              disabled={isLoading}
-                              label={t('ws-task-boards.dialog.min')}
-                            />
-                          </div>
-                        </div>
-                      )}
-
-                      {/* Calendar Hours Type */}
-                      <div className="space-y-1.5">
-                        <Label className="flex items-center gap-1.5 font-normal text-muted-foreground text-xs">
-                          <Briefcase className="h-3.5 w-3.5" />
-                          {t('ws-task-boards.dialog.hour_type')}
-                          <span className="text-dynamic-red">*</span>
-                        </Label>
-                        <div
-                          className={cn(
-                            'inline-flex rounded-md border p-0.5',
-                            !isCreateMode &&
-                              hasUnsavedSchedulingChanges &&
-                              !calendarHours
-                              ? 'border-dynamic-red/50 bg-dynamic-red/5'
-                              : 'border-border'
-                          )}
-                        >
-                          {getCalendarHoursOptions(t).map((option) => {
-                            const Icon = option.icon;
-                            const isSelected = calendarHours === option.value;
-                            return (
-                              <button
-                                key={option.value}
-                                type="button"
-                                onClick={() =>
-                                  onCalendarHoursChange(option.value)
-                                }
-                                className={cn(
-                                  'flex items-center gap-1.5 rounded px-2.5 py-1 text-xs transition-colors',
-                                  isSelected
-                                    ? 'bg-primary text-primary-foreground'
-                                    : 'text-muted-foreground hover:bg-muted hover:text-foreground'
-                                )}
-                                title={option.label}
-                              >
-                                <Icon className="h-3.5 w-3.5" />
-                                <span className="hidden sm:inline">
-                                  {option.label.split(' ')[0]}
-                                </span>
-                              </button>
-                            );
-                          })}
-                        </div>
-                      </div>
-
-                      {/* Auto-schedule */}
-                      <div className="flex items-center justify-between">
-                        <Label
-                          htmlFor="auto-schedule"
-                          className="flex cursor-pointer items-center gap-1.5 font-normal text-muted-foreground text-xs"
-                        >
-                          <Zap className="h-3.5 w-3.5" />
-                          {t('ws-task-boards.dialog.auto_schedule')}
-                        </Label>
-                        <Switch
-                          id="auto-schedule"
-                          checked={autoSchedule}
-                          onCheckedChange={onAutoScheduleChange}
-                          disabled={isLoading}
-                        />
-                      </div>
-
-                      {/* Scheduled Events Progress & List */}
-                      {!isCreateMode && totalMinutes > 0 && (
-                        <div className="space-y-2 border-t pt-2">
-                          {/* Progress */}
-                          {(() => {
-                            const scheduledMinutes =
-                              scheduledEvents?.reduce(
-                                (sum, e) => sum + (e.scheduled_minutes || 0),
-                                0
-                              ) ?? 0;
-                            const progress =
-                              totalMinutes > 0
-                                ? (scheduledMinutes / totalMinutes) * 100
-                                : 0;
-                            const isFullyScheduled = progress >= 100;
-
-                            // Check if any events are scheduled past the deadline
-                            const eventsAfterDeadline =
-                              endDate && scheduledEvents
-                                ? scheduledEvents.filter(
-                                    (e) => new Date(e.start_at) > endDate
-                                  )
-                                : [];
-                            const hasEventsAfterDeadline =
-                              eventsAfterDeadline.length > 0;
-
-                            return (
-                              <>
-                                <div className="space-y-1">
-                                  <div className="flex items-center justify-between text-xs">
-                                    <span className="text-muted-foreground">
-                                      {scheduledEvents &&
-                                      scheduledEvents.length > 0
-                                        ? t(
-                                            'ws-task-boards.dialog.events_scheduled',
-                                            {
-                                              count: scheduledEvents.length,
-                                            }
-                                          )
-                                        : t(
-                                            'ws-task-boards.dialog.not_scheduled'
-                                          )}
-                                    </span>
-                                    <span
-                                      className={cn(
-                                        'font-medium',
-                                        isFullyScheduled
-                                          ? 'text-dynamic-green'
-                                          : 'text-foreground'
-                                      )}
-                                    >
-                                      {formatDuration(scheduledMinutes, t)} /{' '}
-                                      {formatDuration(totalMinutes, t)}
-                                    </span>
-                                  </div>
-                                  <Progress
-                                    value={Math.min(progress, 100)}
-                                    className={cn(
-                                      'h-1.5',
-                                      isFullyScheduled &&
-                                        '[&>div]:bg-dynamic-green'
-                                    )}
-                                  />
-                                </div>
-
-                                {/* Warning: Events scheduled after deadline */}
-                                {hasEventsAfterDeadline && (
-                                  <div className="flex items-center gap-2 rounded-md border border-dynamic-orange/30 bg-dynamic-orange/10 px-2.5 py-1.5 text-xs">
-                                    <AlertTriangle className="h-3.5 w-3.5 shrink-0 text-dynamic-orange" />
-                                    <span className="text-dynamic-orange">
-                                      {eventsAfterDeadline.length === 1
-                                        ? t(
-                                            'ws-task-boards.dialog.event_after_deadline_singular'
-                                          )
-                                        : t(
-                                            'ws-task-boards.dialog.event_after_deadline_plural',
-                                            {
-                                              count: eventsAfterDeadline.length,
-                                            }
-                                          )}
-                                    </span>
-                                  </div>
-                                )}
-
-                                {/* Compact Events List */}
-                                {scheduledEvents &&
-                                  scheduledEvents.length > 0 && (
-                                    <div className="flex flex-wrap gap-1">
-                                      {scheduledEvents.map((event) => {
-                                        const isAfterDeadline =
-                                          endDate &&
-                                          new Date(event.start_at) > endDate;
-                                        return (
-                                          <div
-                                            key={event.id}
-                                            className={cn(
-                                              'inline-flex items-center gap-1 rounded-full px-2 py-0.5 text-[10px]',
-                                              event.completed
-                                                ? 'bg-dynamic-green/10 text-dynamic-green'
-                                                : isAfterDeadline
-                                                  ? 'bg-dynamic-orange/10 text-dynamic-orange'
-                                                  : 'bg-muted text-muted-foreground'
-                                            )}
-                                            title={`${dayjs(event.start_at).format('MMM D, h:mm A')} - ${formatDuration(event.scheduled_minutes, t)}${isAfterDeadline ? ` (${t('ws-task-boards.dialog.after_deadline', { defaultValue: 'after deadline' })})` : ''}`}
-                                          >
-                                            {event.completed ? (
-                                              <CheckCircle className="h-2.5 w-2.5" />
-                                            ) : isAfterDeadline ? (
-                                              <AlertTriangle className="h-2.5 w-2.5" />
-                                            ) : (
-                                              <Calendar className="h-2.5 w-2.5" />
-                                            )}
-                                            <span>
-                                              {dayjs(event.start_at).format(
-                                                'M/D h:mma'
-                                              )}
-                                            </span>
-                                          </div>
-                                        );
-                                      })}
-                                    </div>
-                                  )}
-                              </>
-                            );
-                          })()}
-                        </div>
-                      )}
-
-                      {/* Action Buttons */}
-                      {!isCreateMode && (
-                        <div className="flex items-center gap-2 border-t pt-2">
-                          <Button
-                            size="sm"
-                            variant="outline"
-                            onClick={handleSaveSchedulingSettings}
-                            disabled={!canSaveScheduling}
-                            className="flex-1"
-                          >
-                            {schedulingSaving ? (
-                              <Loader2 className="h-3.5 w-3.5 animate-spin" />
-                            ) : (
-                              <>
-                                <Save className="mr-1.5 h-3.5 w-3.5" />
-                                {t('common.save')}
-                              </>
-                            )}
-                          </Button>
-                          {(durationHours > 0 || durationMinutes > 0) && (
-                            <Button
-                              size="sm"
-                              variant="ghost"
-                              onClick={handleClearSchedulingSettings}
-                              disabled={schedulingSaving}
-                              className="px-2 text-muted-foreground hover:text-dynamic-red"
-                            >
-                              <X className="h-3.5 w-3.5" />
-                            </Button>
-                          )}
-                        </div>
-                      )}
-
-                      {/* Clear Duration (create mode only) */}
-                      {isCreateMode &&
-                        totalDuration !== null &&
-                        totalDuration > 0 && (
-                          <ClearMenuItem
-                            label={t('ws-task-boards.dialog.clear_duration')}
-                            onClick={() => {
-                              onTotalDurationChange(null);
-                              setPopoverOpen('scheduling', false);
-                            }}
-                          />
-                        )}
-                    </div>
-                  </div>
-                </PopoverContent>
-              </Popover>
-            )}
-          </div>
-        </div>
-      )}
-    </div>
-  );
-}