Reactjs: pasar accesorios del componente de tarjeta al componente de pestaña

Soy nuevo para reaccionar.stoy tratando de pasar los accesorios del componente secundario a las pestañas del componente primario que tiene pestañas favoritas.so pensé que pasaría los valores del método handleClickOpen, ya que ahí es donde hago clic en el icono de favoritos. pero no estoy seguro de cómo pasar.cuando hago clic en los favoritos en el componente de tarjetas, debería guardarse en la pestaña de favoritos.puedes decirme cómo solucionarlo, para que en el futuro lo arregle yo mismo.desde que pasar los accesorios es un concepto importante.todo mi código está en tab-demo.js

https: //codesandbox.io/s/40mmrl905

 <CardActions className={classes.actions} disableActionSpacing>
                    <IconButton
                      onClick={this.handleClickOpen}
                      aria-label="Add to favorites"
                    >
                      <FavoriteIcon />
                    </IconButton>

     <AppBar position="static" color="default">
          <Tabs
            value={value}
            onChange={this.handleChange}
            scrollable
            scrollButtons="on"
            indicatorColor="primary"
            textColor="primary"
          >
            <Tab label="Search" icon={<PhoneIcon />} />
            <Tab label="Favorites" icon={<FavoriteIcon />} />
            {/* <Tab label="Item Three" icon={<PersonPinIcon />} />
            <Tab label="Item Four" icon={<HelpIcon />} />
            <Tab label="Item Five" icon={<ShoppingBasket />} />
            <Tab label="Item Six" icon={<ThumbDown />} />
            <Tab label="Item Seven" icon={<ThumbUp />} /> */}
          </Tabs>
        </AppBar>

react code

 handleClickOpen = currentTarget => {
    console.log("handleClickOpen--->");
    console.log("event.currentTarget--->", currentTarget.relatedTarget);
    // console.log("event.relatedTarget--->", relatedTarget);

    // this.setState({ open: true });
  };

TabContainer.propTypes = {
  children: PropTypes.node.isRequired
};

function TabsFavourites(props) {
  return (
    <Typography component="div" style={{ padding: 8 * 3 }}>
      {props.children}
    </Typography>
  );
}

TabsFavourites.propTypes = {
  children: PropTypes.node.isRequired
};

Respuestas a la pregunta(1)

Su respuesta a la pregunta