React + typescript + antd collapse. How to pass data between collapse's elements?

Question

How to pass data from the first element to the second one by clicking the button?

If we open the second component by clicking on the panel, it must to stay empty.

It is welcomed if the answer is with items, and not with Collapse.Panel.

Also, I had to hardcode the activeKey value which is completely wrong and immobilizes the entire parent Collapse component.

interface ChildComponentProps {
 //activeKey: number;
 //setActiveKey: React.Dispatch<React.SetStateAction<string>>;
 setActiveKey: (newType: string) => void;
}
const Element1: React.FC<ChildComponentProps> = ({ setActiveKey }) => {
 // need to pass this 'car'
 const car: { type: string, model: string, year: number } = {
 type: "Toyota",
 model: "Corolla",
 year: 2009
 };
 const handleClick = (key: string) => {
 setActiveKey(key);
 }
 return (
 <div>
 <div>
 <Button
 onClick={() => handleClick('2')} // wrong hardcoding!
 >expandNextPanel
 </Button>
 </div>
 </div>
 );
}
const Element2 = () => {
 return (
 <div>
 <div>
 go back to the first component and click the button
 </div>
 </div>
 );
}
const CollapseComponent = () => {
 const [activeKey, setActiveKey] = useState<string>();
 return (
 <Collapse
 activeKey={activeKey}
 onChange={() => setActiveKey(activeKey)}
 >
 <Collapse.Panel header="Element1" key="1">
 <Element1
 setActiveKey={setActiveKey}
 />
 </Collapse.Panel>
 <Collapse.Panel header="Element2" key="2">
 <Element2 />
 </Collapse.Panel>
 </Collapse>
 );
}
export default CollapseComponent;