import { useState, useCallback } from "react";

/**
 * 필드 에러 시 shake 애니메이션을 트리거하는 공통 훅.
 * - `shaking`  : 현재 흔들리고 있는 필드 이름 Set
 * - `triggerShake` : 필드 이름 배열을 받아 0.4초 동안 shake 활성화
 * - `cls`      : 필드 이름을 받아 "animate-shake" 또는 "" 반환 (className에 바로 사용)
 */
export default function useShake() {
  const [shaking, setShaking] = useState<Set<string>>(new Set());

  const triggerShake = useCallback((fields: string[]) => {
    setShaking(new Set(fields));
    setTimeout(() => setShaking(new Set()), 400);
  }, []);

  /** className 헬퍼 */
  const cls = useCallback(
    (field: string) => (shaking.has(field) ? "animate-shake" : ""),
    [shaking],
  );

  return { shaking, triggerShake, cls } as const;
}