import React, { useEffect } from 'react';
import Nav from './nav';
import Services from './services';
import Show from './show';
import Customer from './customer';
import Consultant from './consultant';
import Contact from './contact';
import Footer from './footer';

import './less/homeStyle.less';
// @ts-ignore
import { enquireScreen } from 'enquire-js';
import NavMobile from '@/pages/Home/navMobile';
import { useLocation } from 'umi';
import { scroller } from 'react-scroll';

import { listServiceProduct } from '@/services/cms';
import { IGetInitialProps } from 'umi';

let isMobile;
enquireScreen((b) => {
  isMobile = b;
});

const Home: React.FC = () => {
  const location = useLocation();

  useEffect(() => {
    const hash = location.hash.replace('#', '');
    if (hash) {
      scroller.scrollTo(hash, {
        smooth: false,
      });
    }

    return () => {};
  }, [location]);

  return (
    <>
      <div className="main">
        <a id="home" />
        {isMobile ? <NavMobile /> : <Nav />}
        <a id="service" />
        <Services />
        <Customer />
        <a id="consultant" />
        <Consultant />
        <Contact />
        <Show />
        <Footer />
      </div>
    </>
  );
};
// Home.getInitialProps = (async (ctx) => {
//   try {
//     const { data: servicesList } = await listServiceProduct(1, 100);
//     console.log(servicesList);
//     return servicesList;
//   } catch (error) {
//     console.error('Failed to fetch listServiceProduct:', error);
//     return null;
//   }
// }) as IGetInitialProps;
export default Home;
