import { useEffect, useState } from 'react';
import { useMarketplacePageLogic } from './MarketplacePage/MarketplacePageLogic';
import MarketplacePageWeb from './MarketplacePage/components/MarketplacePageWeb';
import MarketplacePageH5 from './MarketplacePage/components/MarketplacePageH5';

const isMobileDevice = () => {
  if (typeof window === 'undefined') return false;
  return window.innerWidth < 768;
};

export default function MarketplacePage() {
  const logic = useMarketplacePageLogic();
  const [isMobile, setIsMobile] = useState(isMobileDevice());

  useEffect(() => {
    const handleResize = () => {
      setIsMobile(isMobileDevice());
    };
    window.addEventListener('resize', handleResize);
    return () => window.removeEventListener('resize', handleResize);
  }, []);

  return isMobile ? <MarketplacePageH5 logic={logic} /> : <MarketplacePageWeb logic={logic} />;
}