import { create } from 'zustand';

export interface ExpandedMedia {
    type: 'video' | 'image';
    src: string;
    nodeId: string;
    images?: string[];
    initialIndex?: number;
}

export interface CropRequest {
    src: string;
    nodeId: string;
}

interface HandleClick {
    nodeId: string;
    handleType: 'source';
    x: number;
    y: number;
}

interface MediaContextMenu {
    nodeId: string;
    type: 'image' | 'video';
    src: string;
    x: number;
    y: number;
}

interface CanvasEventsStore {
    expandedMedia: ExpandedMedia | null;
    setExpandedMedia: (media: ExpandedMedia | null) => void;
    
    cropRequest: CropRequest | null;
    setCropRequest: (request: CropRequest | null) => void;
    
    handleClick: HandleClick | null;
    setHandleClick: (click: HandleClick | null) => void;

    mediaContextMenu: MediaContextMenu | null;
    setMediaContextMenu: (menu: MediaContextMenu | null) => void;

    storyboardPreviewOpen: boolean;
    setStoryboardPreviewOpen: (open: boolean) => void;
}

export const useCanvasEvents = create<CanvasEventsStore>((set) => ({
    expandedMedia: null,
    setExpandedMedia: (expandedMedia) => set({ expandedMedia }),
    
    cropRequest: null,
    setCropRequest: (cropRequest) => set({ cropRequest }),
    
    handleClick: null,
    setHandleClick: (handleClick) => set({ handleClick }),

    mediaContextMenu: null,
    setMediaContextMenu: (mediaContextMenu) => set({ mediaContextMenu }),

    storyboardPreviewOpen: false,
    setStoryboardPreviewOpen: (storyboardPreviewOpen) => set({ storyboardPreviewOpen }),
}));
