UserLayout.tsx

import React from 'react';
import { Helmet, HelmetProvider } from 'react-helmet-async';
import {useModel} from 'umi'
import styles from './UserLayout.less';
import LoginBackground from './LoginBackground'
import LoginModel from './LoginModel'


const UserLayout: React.FC = (props) => {
  const { initialState } = useModel('@@initialState');

  if (!initialState || !initialState.settings) {
    return null;
  }
  const { settings } = initialState

  return (
    <HelmetProvider>
      {/*<LoginBackground/>*/}
      {/*<LoginModel/>*/}
      <div className={styles.logo}>
        <img src="/login/login-logo.png" />
      </div>
      {/* <div className={styles.slogan}>
        <img src="/login/login-slogan.png" />
      </div> */}

      <Helmet>
        <title>{settings && settings.title || ''}</title>
        <meta name="description" content={settings && settings.title || ''} />
      </Helmet>

      <div className={styles.container}>
        <div className={styles.content}>
          {props.children}
        </div>
      </div>
    </HelmetProvider>
  );
};

export default UserLayout;