I usually work with function components in React, however, my teammate used a class component, and now I am struggling with understanding how to pass props from my component to my teammate's one.

What I have (consider as MyFile.js):

  const [dataDB, setData] = useState([]);

  useEffect(() => { 
    getData();
  }, []);

  const getData = async() => {
    // some api fetching here
    .then(result => setData(result.data))
  };

  return (
    // here I am using my dataDB 
    // but I also want to pass it to another component
    <AnotherComponent dataDB={dataDB} />
  );

What my teammate has (consider as AnotherFile.js):

 const anotherData = {
   name: "Dummy Name" //dataDB.name should be here
 };
    
 export default class MainAnotherComponent extends React.PureComponent {
   state = {
     data: anotherData
   };

  render() {
    return (
        ...
        //recursion happens here, I guess
        <AnotherComponent
          data={this.state.data}/>
        ...
    );
  }
}

I am not sure how to pass dataDB from my functional component to the class one. As you could see, I tried to pass it like that:

<AnotherComponent dataDB={dataDB} />

But how can I access that dataDB within that AnotherComponent?