import { useState, useCallback } from 'react';

interface GridPosition {
    x: number;
    y: number;
    width: number;
    height: number;
}

interface GridModal {
    id: string;
    position: GridPosition;
}

const GRID_COLS = 20;
const GRID_ROWS = 8;

export const useModalGrid = () => {
    const [gridState, setGridState] = useState<boolean[][]>(
        Array(GRID_ROWS).fill(null).map(() => Array(GRID_COLS).fill(false))
    );
    const [modals, setModals] = useState<GridModal[]>([]);

    // Check if a position is available in the grid
    const isPositionAvailable = useCallback((pos: GridPosition) => {
        for (let y = pos.y; y < pos.y + pos.height; y++) {
            for (let x = pos.x; x < pos.x + pos.width; x++) {
                if (y >= GRID_ROWS || x >= GRID_COLS || gridState[y][x]) {
                    return false;
                }
            }
        }
        return true;
    }, [gridState]);

    // Find next available position for given dimensions
    const findNextPosition = useCallback((width: number, height: number): GridPosition | null => {
        for (let y = 0; y <= GRID_ROWS - height; y++) {
            for (let x = 0; x <= GRID_COLS - width; x++) {
                const pos = { x, y, width, height };
                if (isPositionAvailable(pos)) {
                    return pos;
                }
            }
        }
        return null;
    }, [isPositionAvailable]);

    // Update grid state for a position
    const updateGridState = useCallback((pos: GridPosition, value: boolean) => {
        setGridState(prev => {
            const newState = prev.map(row => [...row]);
            for (let y = pos.y; y < pos.y + pos.height; y++) {
                for (let x = pos.x; x < pos.x + pos.width; x++) {
                    newState[y][x] = value;
                }
            }
            return newState;
        });
    }, []);

    // Add a new modal to the grid
    const addModal = useCallback((id: string, width: number, height: number) => {
        const position = findNextPosition(width, height);
        if (!position) return null;

        const newModal = { id, position };
        setModals(prev => [...prev, newModal]);
        updateGridState(position, true);
        return position;
    }, [findNextPosition, updateGridState]);

    // Remove a modal from the grid
    const removeModal = useCallback((id: string) => {
        setModals(prev => {
            const modal = prev.find(m => m.id === id);
            if (modal) {
                updateGridState(modal.position, false);
            }
            return prev.filter(m => m.id !== id);
        });
    }, [updateGridState]);

    // Move a modal to a new position
    const moveModal = useCallback((id: string, newPos: GridPosition) => {
        if (!isPositionAvailable(newPos)) return false;

        setModals(prev => {
            const modal = prev.find(m => m.id === id);
            if (!modal) return prev;

            updateGridState(modal.position, false);
            updateGridState(newPos, true);

            return prev.map(m =>
                m.id === id ? { ...m, position: newPos } : m
            );
        });
        return true;
    }, [isPositionAvailable, updateGridState]);

    return {
        addModal,
        removeModal,
        moveModal,
        modals,
        gridState
    };
};

export type { GridPosition, GridModal }; 