import { isNil } from 'lodash-es';
import { useCallback, useEffect } from 'react';
import { useCopyToClipboard } from 'react-use';
import { NotificationType, useNotification } from '../components/Notifications';

export function useCopyColor() {
  const { showToast } = useNotification();
  const [cpState, copyToClipboard] = useCopyToClipboard();
  const copyAction = useCallback((color: string) => {
    if (isNil(color)) return;
    copyToClipboard(color);
  }, []);

  useEffect(() => {
    if (!isNil(cpState.error)) {
      showToast(NotificationType.ERROR, 'Failed to copy to clipboard', 'tabler:alert-circle', 3000);
    } else if (!isNil(cpState.value)) {
      showToast(
        NotificationType.SUCCESS,
        `${cpState.value} has been copied to clipboard.`,
        'tabler:circle-check',
        3000,
      );
    }
  }, [cpState]);

  return copyAction;
}