@tuturuuu/ui 0.17.0 → 0.18.0

package/src/components/ui/calendar-app/components/actions-dropdown.tsx

@@ -1,269 +0,0 @@
-'use client';
-
-import {
-  CalendarClock,
-  Calendar as CalendarIcon,
-  CalendarPlus,
-  CheckCircle2,
-  MoreHorizontal,
-  Pencil,
-  Trash2,
-} from '@tuturuuu/icons';
-import { format } from 'date-fns';
-import { useState } from 'react';
-import { Button } from '../../button';
-import { Calendar } from '../../calendar';
-import {
-  Dialog,
-  DialogContent,
-  DialogDescription,
-  DialogFooter,
-  DialogHeader,
-  DialogTitle,
-} from '../../dialog';
-import {
-  DropdownMenu,
-  DropdownMenuContent,
-  DropdownMenuItem,
-  DropdownMenuSeparator,
-  DropdownMenuTrigger,
-} from '../../dropdown-menu';
-
-interface ActionsDropdownProps {
-  taskId: string;
-  taskName: string;
-  startDate?: string | null;
-  endDate?: string | null;
-  onEdit?: (taskId: string) => void;
-  onScheduling?: (taskId: string) => void;
-  onStartDateChange?: (taskId: string, date: Date | null) => void;
-  onDueDateChange?: (taskId: string, date: Date | null) => void;
-  onMarkDone?: (taskId: string) => void;
-  onDelete?: (taskId: string) => void;
-}
-
-export default function ActionsDropdown({
-  taskId,
-  taskName,
-  startDate,
-  endDate,
-  onEdit,
-  onScheduling,
-  onStartDateChange,
-  onDueDateChange,
-  onMarkDone,
-  onDelete,
-}: ActionsDropdownProps) {
-  const [startDateDialogOpen, setStartDateDialogOpen] = useState(false);
-  const [dueDateDialogOpen, setDueDateDialogOpen] = useState(false);
-  const [deleteConfirmOpen, setDeleteConfirmOpen] = useState(false);
-  const [selectedStartDate, setSelectedStartDate] = useState<Date | undefined>(
-    startDate ? new Date(startDate) : undefined
-  );
-  const [selectedDueDate, setSelectedDueDate] = useState<Date | undefined>(
-    endDate ? new Date(endDate) : undefined
-  );
-
-  const handleStartDateSave = () => {
-    onStartDateChange?.(taskId, selectedStartDate || null);
-    setStartDateDialogOpen(false);
-  };
-
-  const handleDueDateSave = () => {
-    onDueDateChange?.(taskId, selectedDueDate || null);
-    setDueDateDialogOpen(false);
-  };
-
-  const handleDeleteConfirm = () => {
-    onDelete?.(taskId);
-    setDeleteConfirmOpen(false);
-  };
-
-  return (
-    <>
-      <DropdownMenu>
-        <DropdownMenuTrigger asChild>
-          <button
-            type="button"
-            className="rounded p-1 transition-colors hover:bg-accent/50"
-            aria-label="More actions"
-          >
-            <MoreHorizontal className="h-3.5 w-3.5 text-muted-foreground" />
-          </button>
-        </DropdownMenuTrigger>
-        <DropdownMenuContent align="end" className="w-48">
-          <DropdownMenuItem
-            onClick={() => onEdit?.(taskId)}
-            className="cursor-pointer gap-2"
-          >
-            <Pencil className="h-4 w-4 text-foreground" />
-            Edit task
-          </DropdownMenuItem>
-
-          <DropdownMenuSeparator />
-
-          <DropdownMenuItem
-            onClick={() => onScheduling?.(taskId)}
-            className="cursor-pointer gap-2"
-          >
-            <CalendarClock className="h-4 w-4 text-dynamic-teal" />
-            Configure scheduling
-          </DropdownMenuItem>
-
-          <DropdownMenuItem
-            onClick={() => setStartDateDialogOpen(true)}
-            className="cursor-pointer gap-2"
-          >
-            <CalendarPlus className="h-4 w-4 text-dynamic-blue" />
-            {startDate
-              ? `Start: ${format(new Date(startDate), 'MMM d')}`
-              : 'Set start date'}
-          </DropdownMenuItem>
-
-          <DropdownMenuItem
-            onClick={() => setDueDateDialogOpen(true)}
-            className="cursor-pointer gap-2"
-          >
-            <CalendarIcon className="h-4 w-4 text-dynamic-orange" />
-            {endDate
-              ? `Due: ${format(new Date(endDate), 'MMM d')}`
-              : 'Set due date'}
-          </DropdownMenuItem>
-
-          <DropdownMenuSeparator />
-
-          <DropdownMenuItem
-            onClick={() => onMarkDone?.(taskId)}
-            className="cursor-pointer gap-2"
-          >
-            <CheckCircle2 className="h-4 w-4 text-dynamic-green" />
-            Mark as done
-          </DropdownMenuItem>
-
-          <DropdownMenuSeparator />
-
-          <DropdownMenuItem
-            onClick={() => setDeleteConfirmOpen(true)}
-            className="cursor-pointer gap-2 text-dynamic-red focus:text-dynamic-red"
-          >
-            <Trash2 className="h-4 w-4" />
-            Delete task
-          </DropdownMenuItem>
-        </DropdownMenuContent>
-      </DropdownMenu>
-
-      {/* Start Date Dialog */}
-      <Dialog open={startDateDialogOpen} onOpenChange={setStartDateDialogOpen}>
-        <DialogContent className="sm:max-w-sm">
-          <DialogHeader>
-            <DialogTitle className="flex items-center gap-2">
-              <CalendarPlus className="h-5 w-5 text-dynamic-blue" />
-              Set Start Date
-            </DialogTitle>
-            <DialogDescription>
-              Choose when this task should start.
-            </DialogDescription>
-          </DialogHeader>
-          <div className="flex justify-center py-4">
-            <Calendar
-              mode="single"
-              selected={selectedStartDate}
-              onSelect={setSelectedStartDate}
-              initialFocus
-            />
-          </div>
-          <DialogFooter className="flex-col gap-2 sm:flex-row">
-            {selectedStartDate && (
-              <Button
-                variant="ghost"
-                size="sm"
-                onClick={() => setSelectedStartDate(undefined)}
-                className="text-muted-foreground"
-              >
-                Clear
-              </Button>
-            )}
-            <div className="flex flex-1 justify-end gap-2">
-              <Button
-                variant="outline"
-                onClick={() => setStartDateDialogOpen(false)}
-              >
-                Cancel
-              </Button>
-              <Button onClick={handleStartDateSave}>Save</Button>
-            </div>
-          </DialogFooter>
-        </DialogContent>
-      </Dialog>
-
-      {/* Due Date Dialog */}
-      <Dialog open={dueDateDialogOpen} onOpenChange={setDueDateDialogOpen}>
-        <DialogContent className="sm:max-w-sm">
-          <DialogHeader>
-            <DialogTitle className="flex items-center gap-2">
-              <CalendarIcon className="h-5 w-5 text-dynamic-orange" />
-              Set Due Date
-            </DialogTitle>
-            <DialogDescription>Choose when this task is due.</DialogDescription>
-          </DialogHeader>
-          <div className="flex justify-center py-4">
-            <Calendar
-              mode="single"
-              selected={selectedDueDate}
-              onSelect={setSelectedDueDate}
-              disabled={(date) =>
-                selectedStartDate ? date < selectedStartDate : false
-              }
-              initialFocus
-            />
-          </div>
-          <DialogFooter className="flex-col gap-2 sm:flex-row">
-            {selectedDueDate && (
-              <Button
-                variant="ghost"
-                size="sm"
-                onClick={() => setSelectedDueDate(undefined)}
-                className="text-muted-foreground"
-              >
-                Clear
-              </Button>
-            )}
-            <div className="flex flex-1 justify-end gap-2">
-              <Button
-                variant="outline"
-                onClick={() => setDueDateDialogOpen(false)}
-              >
-                Cancel
-              </Button>
-              <Button onClick={handleDueDateSave}>Save</Button>
-            </div>
-          </DialogFooter>
-        </DialogContent>
-      </Dialog>
-
-      {/* Delete Confirmation Dialog */}
-      <Dialog open={deleteConfirmOpen} onOpenChange={setDeleteConfirmOpen}>
-        <DialogContent className="sm:max-w-sm">
-          <DialogHeader>
-            <DialogTitle>Delete Task</DialogTitle>
-            <DialogDescription>
-              Are you sure you want to move &quot;{taskName}&quot; to the
-              recycle bin?
-            </DialogDescription>
-          </DialogHeader>
-          <DialogFooter>
-            <Button
-              variant="outline"
-              onClick={() => setDeleteConfirmOpen(false)}
-            >
-              Cancel
-            </Button>
-            <Button variant="destructive" onClick={handleDeleteConfirm}>
-              Delete
-            </Button>
-          </DialogFooter>
-        </DialogContent>
-      </Dialog>
-    </>
-  );
-}

package/src/components/ui/calendar-app/components/auto-schedule-comprehensive-dialog.tsx

@@ -1,220 +0,0 @@
-'use client';
-
-import { useQueryClient } from '@tanstack/react-query';
-import { Loader2, Sparkles } from '@tuturuuu/icons';
-import dayjs from 'dayjs';
-import timezone from 'dayjs/plugin/timezone';
-import utc from 'dayjs/plugin/utc';
-import { useRouter } from 'next/navigation';
-import { useRef, useState } from 'react';
-import { Button } from '../../button';
-import {
-  Dialog,
-  DialogContent,
-  DialogDescription,
-  DialogFooter,
-  DialogHeader,
-  DialogTitle,
-  DialogTrigger,
-} from '../../dialog';
-import { Label } from '../../label';
-import {
-  Select,
-  SelectContent,
-  SelectItem,
-  SelectTrigger,
-  SelectValue,
-} from '../../select';
-import { toast } from '../../sonner';
-import { Switch } from '../../switch';
-
-// Extend dayjs with timezone and UTC plugins
-dayjs.extend(utc);
-dayjs.extend(timezone);
-
-interface AutoScheduleComprehensiveDialogProps {
-  wsId: string;
-  children?: React.ReactNode;
-}
-
-export default function AutoScheduleComprehensiveDialog({
-  wsId,
-  children,
-}: AutoScheduleComprehensiveDialogProps) {
-  const [isOpen, setIsOpen] = useState(false);
-  const [isLoading, setIsLoading] = useState(false);
-  const [isRealtime, setIsRealtime] = useState(true);
-  const [gapMinutes, setGapMinutes] = useState(0);
-  const queryClient = useQueryClient();
-  const refreshIntervalRef = useRef<ReturnType<typeof setInterval> | null>(
-    null
-  );
-  const router = useRouter();
-  const stopRefreshing = () => {
-    if (refreshIntervalRef.current) {
-      clearInterval(refreshIntervalRef.current);
-      refreshIntervalRef.current = null;
-    }
-  };
-
-  const handleAutoSchedule = async () => {
-    if (isLoading) return;
-
-    setIsLoading(true);
-    toast.loading('Connecting to optimizer...', {
-      id: 'auto-schedule',
-    });
-
-    if (isRealtime) {
-      refreshIntervalRef.current = setInterval(() => {
-        queryClient.invalidateQueries({
-          queryKey: ['calendarEvents', wsId],
-        });
-      }, 500);
-    }
-
-    try {
-      const userTimezone = dayjs.tz.guess();
-      const apiUrl = `/api/${wsId}/calendar/auto-schedule?stream=${isRealtime}`;
-      const response = await fetch(apiUrl, {
-        method: 'POST',
-        headers: {
-          'Content-Type': 'application/json',
-        },
-        body: JSON.stringify({
-          gapMinutes,
-          timezone: userTimezone,
-        }),
-      });
-
-      if (!response.ok) {
-        const errorData = await response.json().catch(() => ({
-          error: 'Failed to connect to the optimization service.',
-        }));
-        throw new Error(errorData.error);
-      }
-
-      if (isRealtime) {
-        if (!response.body)
-          throw new Error('Streaming response not available.');
-        const reader = response.body.getReader();
-        const decoder = new TextDecoder();
-
-        // Add a label to the while loop
-        streamLoop: while (true) {
-          const { value, done } = await reader.read();
-          if (done) break;
-
-          const chunk = decoder.decode(value);
-          const lines = chunk.split('\n\n');
-
-          for (const line of lines) {
-            if (line.startsWith('data: ')) {
-              try {
-                const json = JSON.parse(line.substring(6));
-
-                toast.loading(json.message || 'Optimizing...', {
-                  id: 'auto-schedule',
-                });
-
-                if (json.status === 'complete' || json.status === 'converged') {
-                  toast.success(json.message || 'Optimization complete!', {
-                    id: 'auto-schedule',
-                    duration: 5000,
-                  });
-                  setIsOpen(false);
-                  break streamLoop;
-                }
-                if (json.status === 'error') {
-                  throw new Error(json.message || 'An unknown error occurred');
-                }
-              } catch (e) {
-                console.warn('Failed to parse stream chunk:', line, e);
-              }
-            }
-          }
-        }
-      } else {
-        const data = await response.json();
-        toast.success(data.message || 'Optimization complete!', {
-          id: 'auto-schedule',
-          duration: 5000,
-        });
-        setIsOpen(false);
-      }
-    } catch (error) {
-      console.error('Auto-schedule error:', error);
-      toast.error('Failed to optimize calendar', {
-        id: 'auto-schedule',
-        description:
-          error instanceof Error
-            ? error.message
-            : 'An unexpected error occurred',
-      });
-    } finally {
-      router.refresh();
-      setIsLoading(false);
-      stopRefreshing();
-      await queryClient.invalidateQueries({
-        queryKey: ['calendarEvents', wsId],
-      });
-    }
-  };
-
-  return (
-    <Dialog open={isOpen} onOpenChange={setIsOpen}>
-      <DialogTrigger asChild>{children}</DialogTrigger>
-      <DialogContent>
-        <DialogHeader>
-          <DialogTitle>Auto-Schedule Settings</DialogTitle>
-          <DialogDescription>
-            Configure how the auto-scheduler optimizes your calendar.
-          </DialogDescription>
-        </DialogHeader>
-
-        <div className="space-y-4 py-4">
-          <div className="flex items-center justify-between">
-            <Label htmlFor="realtime-updates">Real-time updates</Label>
-            <Switch
-              id="realtime-updates"
-              checked={isRealtime}
-              onCheckedChange={setIsRealtime}
-              disabled={isLoading}
-            />
-          </div>
-          <div className="space-y-2">
-            <Label>Gap Between Events</Label>
-            <Select
-              value={String(gapMinutes)}
-              onValueChange={(value) => setGapMinutes(Number(value))}
-              disabled={isLoading}
-            >
-              <SelectTrigger>
-                <SelectValue />
-              </SelectTrigger>
-              <SelectContent>
-                <SelectItem value="0">No Gap</SelectItem>
-                <SelectItem value="15">15-minute Gap</SelectItem>
-              </SelectContent>
-            </Select>
-          </div>
-        </div>
-
-        <DialogFooter>
-          <Button
-            onClick={handleAutoSchedule}
-            disabled={isLoading}
-            className="w-full"
-          >
-            {isLoading ? (
-              <Loader2 className="mr-2 h-4 w-4 animate-spin" />
-            ) : (
-              <Sparkles className="mr-2 h-4 w-4" />
-            )}
-            {isLoading ? 'Optimizing...' : 'Run Auto-Schedule'}
-          </Button>
-        </DialogFooter>
-      </DialogContent>
-    </Dialog>
-  );
-}

package/src/components/ui/calendar-app/components/calendar-header-actions.tsx

@@ -1,67 +0,0 @@
-'use client';
-
-import { CheckSquare, ChevronDown, PlusIcon, Repeat } from '@tuturuuu/icons';
-import { Button } from '@tuturuuu/ui/button';
-import {
-  DropdownMenu,
-  DropdownMenuContent,
-  DropdownMenuItem,
-  DropdownMenuTrigger,
-} from '@tuturuuu/ui/dropdown-menu';
-import HabitFormDialog from '@tuturuuu/ui/tu-do/habits/habit-form-dialog';
-import { useTranslations } from 'next-intl';
-import { useState } from 'react';
-import { QuickTaskDialog } from './quick-task-dialog';
-import { SmartScheduleButton } from './smart-schedule-button';
-
-interface CalendarHeaderActionsProps {
-  workspaceId: string;
-  enableSmartScheduling: boolean;
-}
-
-export function CalendarHeaderActions({
-  workspaceId,
-}: CalendarHeaderActionsProps) {
-  const t = useTranslations('calendar');
-  const [quickTaskOpen, setQuickTaskOpen] = useState(false);
-  const [habitFormOpen, setHabitFormOpen] = useState(false);
-
-  return (
-    <div className="grid w-full items-center gap-2 md:flex md:w-auto">
-      <DropdownMenu>
-        <DropdownMenuTrigger asChild>
-          <Button variant="default" size="xs" className="gap-1.5">
-            <PlusIcon className="h-4 w-4" />
-            <span className="hidden sm:inline">{t('create')}</span>
-            <ChevronDown className="h-3 w-3 opacity-60" />
-          </Button>
-        </DropdownMenuTrigger>
-        <DropdownMenuContent align="end">
-          <DropdownMenuItem onClick={() => setQuickTaskOpen(true)}>
-            <CheckSquare className="h-4 w-4" />
-            {t('new-task')}
-          </DropdownMenuItem>
-          <DropdownMenuItem onClick={() => setHabitFormOpen(true)}>
-            <Repeat className="h-4 w-4" />
-            {t('new-habit')}
-          </DropdownMenuItem>
-        </DropdownMenuContent>
-      </DropdownMenu>
-
-      <SmartScheduleButton wsId={workspaceId} />
-
-      <QuickTaskDialog
-        wsId={workspaceId}
-        open={quickTaskOpen}
-        onOpenChange={setQuickTaskOpen}
-      />
-
-      <HabitFormDialog
-        wsId={workspaceId}
-        open={habitFormOpen}
-        onOpenChange={setHabitFormOpen}
-        onSuccess={() => setHabitFormOpen(false)}
-      />
-    </div>
-  );
-}

package/src/components/ui/calendar-app/components/experimental-feature-dialog.tsx

@@ -1,56 +0,0 @@
-'use client';
-
-import { TriangleAlert } from '@tuturuuu/icons';
-import { Button } from '../../button';
-import {
-  Dialog,
-  DialogContent,
-  DialogDescription,
-  DialogFooter,
-  DialogHeader,
-  DialogTitle,
-} from '../../dialog';
-
-interface ExperimentalFeatureDialogProps {
-  open: boolean;
-  onConfirm: () => void;
-  onClose?: () => void;
-}
-
-export function ExperimentalFeatureDialog({
-  open,
-  onConfirm,
-  onClose,
-}: ExperimentalFeatureDialogProps) {
-  const handleOpenChange = (isOpen: boolean) => {
-    if (!isOpen) {
-      onClose?.();
-    }
-  };
-
-  return (
-    <Dialog open={open} onOpenChange={handleOpenChange}>
-      <DialogContent onInteractOutside={(e) => e.preventDefault()}>
-        <DialogHeader>
-          <DialogTitle className="flex items-center gap-2 text-destructive">
-            <TriangleAlert className="h-5 w-5" />
-            Experimental Feature
-          </DialogTitle>
-          <DialogDescription className="pt-2">
-            Smart scheduling is enabled for testing. This feature is very
-            experimental and could result in unexpected behaviors.
-            <br />
-            <br />
-            Not stable enough for production use, only for experimentation and
-            testing purposes only.
-          </DialogDescription>
-        </DialogHeader>
-        <DialogFooter>
-          <Button variant="destructive" onClick={onConfirm}>
-            I understand, proceed anyway
-          </Button>
-        </DialogFooter>
-      </DialogContent>
-    </Dialog>
-  );
-}