import {FC} from 'react';
import css from './index.module.css';
import {useFullscreen} from 'ahooks';
import {FullScreenTwo, OffScreenTwo} from '@icon-park/react';

const FullScreenBtn: FC = function () {
  const [isFullscreen, {toggleFullscreen}] = useFullscreen(document.body);

  return (
    <section className={css.fullscreenBtn} onClick={toggleFullscreen}>
      {!isFullscreen ? (
        <FullScreenTwo theme='outline' size='20' fill='#999' />
      ) : (
        <OffScreenTwo theme='outline' size='20' fill='#999' />
      )}
    </section>
  );
};

export default FullScreenBtn;
