render()

in amplify-video-frontend/src/App.js [195:241]


  render() {
    const { classes } = this.props;

    return (
      <div className={classes.root}>
        <AppBar position="static">
          <Toolbar>
            <IconButton edge="start" className={classes.menuButton} color="inherit" aria-label="menu">
              <VideocamIcon />
            </IconButton>
            <Typography variant="h6" className={classes.title}>
              Video Streaming
            </Typography>
            <Button color="inherit" onClick={this.onClickSignout}>Sign out</Button>
          </Toolbar>
        </AppBar>
        
        <Container className={classes.myContent}>
        
          <Toolbar>
            <Typography variant="h5" component="h1" gutterBottom>
                Channels
            </Typography>
            <div className={classes.grow} />
            <Button variant="contained" color="secondary" className={classes.margin} onClick={this.handleClickOpenAdd}>
              <AddIcon className={classes.extendedIcon} />
              Add Channel
            </Button>
          </Toolbar>
        
          
          <Grid item xs={12} md={12}>
            <div className={classes.demo}>
              <List dense={false}>
                { this.state.channels.map(item => (
                  <div key={item.id}>
                    <ListItem button onClick={() => this.handleClickChannel(item)} >
                      <ListItemAvatar>
                        <Avatar>
                          <VideocamIcon />
                        </Avatar>
                      </ListItemAvatar>
                      <ListItemText
                        primary={item.name}
                      />
                      <ListItemSecondaryAction className={classes.actionButtons}>
                        <IconButton edge="end" aria-label="delete" onClick={() => this.handleEditChannel(item)}>