import React, { Suspense } from 'react';

import { Helmet } from 'react-helmet';
import { connect } from 'react-redux';
// import { renderRoutes } from 'react-router-config';
import { renderRoutes } from '../../utils/routes'
// import BootPage from '../../pages/bootpage';
import {
  Router,
  Switch,
  Route,
  Redirect
} from '@wisdom-utils/runtime';

import { dyRoutes } from '../../routes/config';
// import routeContext from '@ant-design/pro-layout/lib/RouteContext';
// import { Route } from 'react-router-dom';

const pkg = require('../../../package.json');
const config = require('../../../config/config');
const defaultSetting = config.layout;


function App(props) {
  const { routes } = dyRoutes(props.menu);
  console.log("routes", routes)
  return (
    <>
      <Helmet
        title={`${(props.global && props.global.title) ||
          defaultSetting.title}`}
      >
        <title>{`${(props.global && props.global.title) ||
          defaultSetting.title}`}</title>
        <link
          rel="shortcut icon"
          href={`https://panda-water.cn/web4/${props.global &&
            props.global.shortcutIcon}`}
        />
        <meta
          name="description"
          content={`${props.global && props.global.title}`}
        />
      </Helmet>
      <Router basename={config.base || pkg.name.toLocaleLowerCase() || ''}>
        <Switch>
        {renderRoutes(dyRoutes(props.menu || []).routes)}
        </Switch>
      </Router>
    </>
  );
}

const mapStateToProps = state => ({
  global: state.getIn(['global', 'globalConfig']),
  menu: state.getIn(['global', 'menu']),
});
export default connect(
  mapStateToProps,
  null,
)(App);
