I'm a little new to react. I would like to pass down two props to a component, One is an object and another is a callback

function App(props) {
      var [data, setData] = useState([]);
          var [filters, setFilters] = useState([])
        
          const filtersCallback = useCallback((filter) => {
            setFilters(filters);
          }, []);
        
        
          useEffect(() => {
            axios.get(props.api).then(res=>{
              setData(res.data)
            })
          }, [])
        
    return(<Component {...data} filtersCallback={callback}/> )

This won't work, and I'm not quite sure how else this can be achieved. I also couldn't find a solution anywhere else