'use client';

import { useEffect } from 'react';
import { useIsDesktopClient } from '@/lib/desktop-client';

/**
 * DesktopContextMenuGuard (260917-h2s) — unterdrueckt das
 * WebView2-Browser-Kontextmenue (Zurueck, Aktualisieren, Speichern unter,
 * Drucken …) im Desktop-Client; in Eingabefeldern und contenteditable-
 * Bereichen bleibt es erhalten, damit Kopieren/Einfuegen erreichbar bleibt.
 * jsdom kennt `isContentEditable` nicht -- deshalb zusaetzlich der Selektor.
 */
const EDITABLE_SELECTOR =
  'input, textarea, select, [contenteditable=""], [contenteditable="true"], [contenteditable="plaintext-only"]';

export function DesktopContextMenuGuard() {
  const isDesktop = useIsDesktopClient();

  useEffect(() => {
    if (!isDesktop) return;

    const handler = (event: MouseEvent) => {
      const target = event.target;
      if (!(target instanceof Element)) return;
      if (target.closest(EDITABLE_SELECTOR) || (target as HTMLElement).isContentEditable === true) {
        return;
      }
      event.preventDefault();
    };

    document.addEventListener('contextmenu', handler);
    return () => {
      document.removeEventListener('contextmenu', handler);
    };
  }, [isDesktop]);

  return null;
}