import logWebUserEvent from '@/logging/logWebUserEvent';

import { getAnalyticsToolName } from '../EditModeContext';
import { getEditCategory } from '../SelectionContext';
import { CanvasRegion } from './CanvasRenderer';
import { EditCanvasRenderContext } from './EditCanvasRenderContext';

export default function makeBaseClickHandlerRegion({
  timelineWrapperRect,
  setSelection,
  handleClickDrag,
  playbackContext,
  editMode,
  editSessionId,
  clipId,
  frameCountRef,
}: EditCanvasRenderContext): CanvasRegion {
  return {
    touchTarget: {
      bounds: {
        top: 0,
        bottom: timelineWrapperRect.height,
        left: 0,
        right: timelineWrapperRect.width,
      },
      onMouseDown: handleClickDrag(({ downSeconds }) => {
        let lastMoveSeconds = downSeconds;
        return {
          onMouseMove: ({ isDrag, moveSeconds }) => {
            if (isDrag && getEditCategory(editMode) === 'fluid') {
              setSelection([downSeconds, moveSeconds]);
              lastMoveSeconds = moveSeconds;
            }
          },
          onMouseUp: ({ isDrag }) => {
            if (!isDrag) {
              frameCountRef.current++;
              playbackContext.seek(downSeconds);
            }
            if (isDrag && getEditCategory(editMode) === 'fluid') {
              logWebUserEvent({
                actionName: 'MakeWaveformSelection',
                context: {
                  startSeconds: Math.min(downSeconds, lastMoveSeconds),
                  endSeconds: Math.max(downSeconds, lastMoveSeconds),
                  editTool: getAnalyticsToolName(editMode),
                  editSessionId: editSessionId || 'MISSING_EDIT_SESSION_ID',
                  editingClipId: clipId,
                  actionIndex: -1, // todo?
                  inputType: 'timeline-click-drag',
                },
              });
            }
          },
        };
      }),
    },
  };
}