import React, { useState } from 'react';

import useWindowSize from './useWindowSize';

import HeaderD from './components/HeaderD';
import HeaderM from './components/HeaderM';
import PartOne from './components/PartOne';
import PartTwo from './components/PartTwo';
import Footer from './components/Footer';

export default function App() {
  const [currentLanguage, setCurrentLanguage] = useState('en');
  const [showCookies, setShowCookies] = useState(true);

  const { width } = useWindowSize();
  //   console.log(width);

  return (
    <div className="w-full overflow-x-hidden">
      {width > 1000 ? (
        <HeaderD
          currentLanguage={currentLanguage}
          setCurrentLanguage={setCurrentLanguage}
          showCookies={showCookies}
          setShowCookies={setShowCookies}
        />
      ) : (
        <HeaderM
          currentLanguage={currentLanguage}
          setCurrentLanguage={setCurrentLanguage}
          showCookies={showCookies}
          setShowCookies={setShowCookies}
        />
      )}

      <PartOne />
      <PartTwo />

      <Footer />
    </div>
  );
}
