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;