import { registerModule } from '../../core/modules';
import { emitAsukaEvent, emitAsukaEventCancelable } from '../../core/events';
import { useAsukaStore } from '../../store/asukaStore';

/**
 * MagnifierActionModule
 * --------------------
 * "Action-only" module: clicking its menu button toggles the magnifier feature.
 * It does not open an overlay.
 */
registerModule({
  id: 'magnifier',
  label: 'Loupe',
  icon: 'magnifying-glass',
  // No overlay by default — if someone opens it explicitly, it will show nothing.
  displayMode: 'floating',
  supportedEngines: ['fabric'],
  requiredCapabilities: ['canvas2d'],
  render: () => null,
  action: () => {
    const ok = emitAsukaEventCancelable('before:ui.magnifier.interact', {});
    if (!ok) return;

    const state = useAsukaStore.getState() as any;
    const enabled = Boolean(state.magnifierEnabled);
    state.setMagnifierEnabled?.(!enabled);

    emitAsukaEvent('after:ui.magnifier.interact', { enabled: !enabled });
  },
});
