render()

in amplify-video-frontend/src/components/VideoChat.js [110:164]
49 lines of code
1 McCabe index (conditional complexity)

  render() {
    const { classes } = this.props;
    
    return (
    <div className="App">
      <CssBaseline />
      <Grid container spacing={3}>
        <Grid item sm={12} md={8}>
            
          <div data-vjs-player>
            <VideoPlayer {...this.state.videoJsOptions} />
          </div>
            
        </Grid>
        <Grid item sm={12} md={4}>
          
            <Card >
                <CardContent>
                  <div className={classes.top}>
                    <Typography variant="h5" color="primary" inline >Chat</Typography>
                  </div>
                  <List id="chatMessages" style={{height: 320, overflow: 'auto'}} >
                    { this.state.messages.map((item, index)=>(
                      <ListItem className={classes.item} key={index}>
                        <Chip label={ item.username+" : "+item.content} color={ this.state.username===item.username ? "secondary" : "primary" } />
                      </ListItem>
                    ))}
                  </List>
                  
                </CardContent>
                <CardActions>
                  <Input
                    placeholder="Enter a message"
                    fullWidth={true}
                    id="messageInput"
                    value={this.state.tmpMessage}
                    onChange={this.handleChangeInput}
                    onKeyDown={this.handleKeyDown}
                    inputProps={{'aria-label': 'Message Field',}}
                    autoFocus={true}
                  />
                  <IconButton
                    color="primary"
                    onClick={this.publishMessage}
                    >
                    <SendIcon />
                  </IconButton>
                </CardActions>
              </Card>

        </Grid>
      </Grid>
    </div>
    );
  }