import React, { useCallback, useState } from 'react'
import styles from './index.module.scss'

function A4base() {
  const [show, setShow] = useState(true)

  const baseStart = useCallback(() => {
    window.manage.switchBgmState(true)
    setShow(false)
  }, [])

  return (
    <div
      className={styles.A4base}
      style={{ opacity: show ? '1' : '0', pointerEvents: show ? 'auto' : 'none' }}
    >
      <h1 onClick={baseStart}>A4base</h1>
    </div>
  )
}

const MemoA4base = React.memo(A4base)

export default MemoA4base
