// hooks/useDeviceType.js
//
// Расширенный детектор устройств для адаптации Кубоши.
// Возвращает: { isPhone, isTablet, isDesktop }
// - isPhone   — ширина ≤480px ИЛИ (мобильник в landscape с высотой ≤480)
// - isTablet  — 481..1024px (десктоп ещё не готов)
// - isDesktop — ≥1025px (полноценный десктопный layout)

import { useState, useEffect } from 'react';

const PHONE_MAX = 480;
const TABLET_MAX = 1024;

function detect() {
    if (typeof window === 'undefined') {
        return { isPhone: false, isTablet: false, isDesktop: true };
    }
    const w = window.innerWidth;
    const h = window.innerHeight;
    // Landscape-телефон: высота <=480 и есть touch
    const hasTouch = 'ontouchstart' in window || navigator.maxTouchPoints > 0;
    const landscapePhone = hasTouch && h <= PHONE_MAX && w > h;

    const isPhone = w <= PHONE_MAX || landscapePhone;
    const isTablet = !isPhone && w <= TABLET_MAX;
    const isDesktop = !isPhone && !isTablet;

    return { isPhone, isTablet, isDesktop };
}

const useDeviceType = () => {
    const [state, setState] = useState(() => detect());

    useEffect(() => {
        const onResize = () => setState(detect());
        window.addEventListener('resize', onResize);
        window.addEventListener('orientationchange', onResize);
        return () => {
            window.removeEventListener('resize', onResize);
            window.removeEventListener('orientationchange', onResize);
        };
    }, []);

    return state;
};

export default useDeviceType;
