text: import Logo from './Logo'
  import GroupCategory from './GroupCategory'
  import GroupMenu from './GroupMenu'
  import GroupTag from './GroupTag'
  import SearchInput from './SearchInput'
  import SiteInfo from './SiteInfo'
  import Catalog from './Catalog'
  import { useRouter } from 'next/router'
  
  function AsideLeft (props) {
    const { tags, currentTag, categories, currentCategory, post, slot, siteInfo } = props
    const router = useRouter()
    return <div className='w-72 bg-white dark:bg-gray-800 min-h-screen px-10 py-14 hidden lg:block'>
      <Logo {...props}/>
  
      <section className='flex flex-col text-gray-600'>
        <hr className='w-12 my-8' />
        <GroupMenu {...props}/>
      </section>
  
      <section className='flex flex-col text-gray-600'>
        <hr className='w-12 my-8' />
        <SearchInput {...props}/>
      </section>
  
      <section className='flex flex-col dark:text-gray-300'>
        <hr className='w-12 my-8' />
        { siteInfo.description }
      </section>
  
      {router.asPath !== '/tag' && <section className='flex flex-col'>
        <hr className='w-12 my-8 ' />
        <GroupTag tags={tags} currentTag={currentTag}/>
      </section>}
  
      {router.asPath !== '/category' && <section className='flex flex-col'>
        <hr className='w-12 my-8 ' />
        <GroupCategory categories={categories} currentCategory={currentCategory}/>
      </section>}
  
      <section className='flex flex-col'>
        <hr className='w-12 my-8 ' />
        <SiteInfo/>
      </section>
  
      <section className='sticky top-0 pt-12'>
        <Catalog toc={post?.toc}/>
        <div className='flex justify-center'>
          <div>{slot}</div>
        </div>
      </section>
    </div>
  }
  
  export default AsideLeft
  