Передача данных между двумя компонентами в одном файле react js

#reactjs #parameters #callback #react-hooks #components

Вопрос:

У меня есть два экспорта, которые нужно выполнить в одном файле. Я хотел вернуть их обоих. У одного есть компонент, а другой возвращает значение. Мне нужно передать значение, возвращенное из события щелчка в компоненте, в другую функцию.

 export const CategoryButton = (props) => {
const [clickedCatCode, setClickedCatCode] = useState("");

function parentCallback(){
    setClickedCatCode(props.cat_code);
    return clickedCatCode;
}

return(
    <div className="cat-button">
        <button onClick={parentCallback} id={props.cat_code}>
            <div className="cat-button-image">
                <img src = {props.cat_image} alt={props.cat_name} key={props.cat_code}/>
            </div>
            <div className="cat-button-text">
                {props.cat_name}
            </div>
        </button>
    </div>
);
 

}

 export const cat_code = //This should have the value from the above click event