import React from 'react';
import { Layout, Spin } from 'antd';
import { useModel } from '@/store'
import RequireLogin from './components/RequireLogin';
import SiderBar from './components/SiderBar';
import Header from './components/Header';
import Container from './components/Container';
import Footer from './components/Footer';
import useReady from './useReady';

const { Content } = Layout;

export default (props) => {
  const [user] = useModel();
  // const isReady = useReady(user)
  const isReady = true

  return (
    <Spin spinning={!isReady}>
      <RequireLogin>
        <div className='main-layout'>
          <Header />
          <Layout>
            <SiderBar />
            <Layout>
              <Container />
              <Footer />
            </Layout>
          </Layout>
        </div>
      </RequireLogin>
    </Spin>
  );
}