import React, { useState, useEffect } from "react" import PropTypes from "prop-types" export const ShowMore = ({ children, id, inLibrary }) => { const [ display, setDisplay ] = useState(!inLibrary) useEffect(() => { setDisplay(!inLibrary); }, [id, inLibrary]); if (!display) { return ( setDisplay(true)} className="badge badge-pill badge-secondary clickable mb-1" > More options ... ) } return ({children}) } ShowMore.propTypes = { id: PropTypes.string, inLibrary: PropTypes.bool.isRequired, children: PropTypes.oneOf( PropTypes.object, PropTypes.array, ), } ShowMore.defaultProps = { id: "", inLibrary: false, }