Динамически стейт передать другому компоненту

Сделать стейт в App.

Передавать в WithCallbacks и List возможность его использовать и менять.

 const BlogPage = () => {
    ....
const [breed, setBreed] = useState("")
    return(
        />
      <WithCallbacks options={breeds.sort(compare)} title='породу'
        selectBreed={(hadleBreed) => setBreed(hadleBreed)} />
      {console.log(breed)}
      <List breed={breed} />
    )}


export default class WithCallbacks extends Component {
          constructor(props) {
            super(props)
            this.state = {
              selectedOptions: []
            };
            ...
            this.handleChange = this.handleChange.bind(this)
          }
          handleChange = (selectedOptions) => {
        this.setState({ selectedOptions });
        this.props.selectBreed(selectedOptions.value)
      }
        
          ...