Proyectos de Subversion LeadersLinked - Antes de SPA

/* eslint-disable react/prop-types */
import React, { useEffect, useState } from "react";
import SearchInput from './SearchInput'

const Searchbox = ({ show, onClose }) => {

  const [shouldRender, setShouldRender] = useState(show);

  const handleUnmount = () => {
    if (!show) setShouldRender(false);
  };

  useEffect(() => {
    if (show) setShouldRender(show);
  }, [show]);


  return (
    shouldRender &&
    <>
      <div className={`searchBox ${show ? 'fadeIn' : 'fadeOut'}`} onAnimationEnd={handleUnmount}>
        <SearchInput />
      </div>
      <div className='backdrop' onClick={onClose}></div>
    </>
  )
};

export default Searchbox;