sendAnimations.ts1.0 KBView on GitHub
import type { HydratedUserTask } from '@/modules/userTasks/slice/userTasksSlice';
import { useCedarStore } from '@/modules/store';

export interface SendAnimationOptions {
  conversationId: string;
  emailTasks: HydratedUserTask[];
}

/**
 * Orchestrates the send animation flow:
 * 1. Set email tasks to 'done' status (triggers animation in TimelineTaskItem)
 * 2. Let animations play naturally (no manual delays)
 * 3. Return control to caller who will handle backend sync
 *
 * The done tasks will:
 * - Show checkmark animation (600ms spring + rotate)
 * - Fade out (400ms with 600ms delay)
 * - Be removed from DOM when query refetches (backend filters out 'done' status)
 */
export function triggerSendEmailAnimationFlow(options: SendAnimationOptions): void {
  const store = useCedarStore.getState();

  // Mark email tasks as 'done'
  // This triggers the checkmark animation in TimelineTaskItem
  options.emailTasks.forEach((task) => {
    store.updateTask(task.id, {
      status: 'done',
      completedAt: new Date(), // Set completion timestamp
    });
  });
}