import { useQueryClient } from '@tanstack/vue-query';
import { getDynamicEnv } from 'src/helpers/getEnv';
import { onMounted, onUnmounted } from 'vue';
import { useRouter } from 'vue-router';

export function useHotKeys() {
  const router = useRouter();

  const queryClient = useQueryClient();
  const handleKeyPress = (event: KeyboardEvent) => {
    const isMac = navigator.platform.toUpperCase().indexOf('MAC') >= 0;
    const modifierKey = isMac ? event.metaKey : event.altKey;

    if (modifierKey && event.key === 'r') {
      event.preventDefault();
      queryClient.invalidateQueries();
    } else if (event.shiftKey && modifierKey && event.key === 'E') {
      event.preventDefault();
      getDynamicEnv({ force: true });
    } else if (modifierKey && event.key === 'g') {
      event.preventDefault();
      router.push('/gamas');
    } else if (modifierKey && event.shiftKey && event.key === 'L') {
      event.preventDefault();
      router.push('/layout');
    } else if (modifierKey && event.key === 'l') {
      event.preventDefault();
      router.push('/landings');
    } else if (modifierKey && event.key === 'o') {
      event.preventDefault();
      router.push('/colecciones');
    } else if (modifierKey && event.key === 'd') {
      event.preventDefault();
      router.push('/plantillas_documentos');
    } else if (modifierKey && event.key === 'a') {
      event.preventDefault();
      router.push('/ai_contexts');
    } else if (modifierKey && event.key === 's') {
      event.preventDefault();
      router.push('/sistemas');
    }
  };

  onMounted(() => {
    window.addEventListener('keydown', handleKeyPress);
  });
  onUnmounted(() => {
    window.removeEventListener('keydown', handleKeyPress);
  });
}