render()

in src/App.js [96:202]
107 lines of code
2 McCabe index (conditional complexity)

  render() {
    return (
      <Router>
      <header>
        <Link to="/">
          <Button secondary> Channel List </Button>
        </Link>
          <Link to="/channelList">
          <Button primary> My Channels </Button>
        </Link>
        <Modal
          centered={false}
          closeIcon
          trigger={<Button primary>Create My Channel</Button>}
          open={this.state.open}
          onClose={()=>this.setState({open:false})}
          onOpen={()=>this.setState({open:true})}
        >
          <Header icon='file video' content='Input Your Channel Info' />
          <Modal.Content>
            {this.state.loader && <Loader />}
            <Form>
              <Form.Field>
                <label> Channel Title</label>
                <input name='name' placeholder='Input your channel title' onChange={this.handleChange} />
              </Form.Field>
              <Form.Field>
                <label> Channel Type</label>
                <Radio
                  label='STANDARD'
                  name='type'
                  value='STANDARD'
                  checked={this.state.type === 'STANDARD'}
                  onChange={this.handleRadio}
                />
              </Form.Field>
              <Form.Field>
                <Radio
                  label='BASIC'
                  name='type'
                  value='BASIC'
                  checked={this.state.type === 'BASIC'}
                  onChange={this.handleRadio}
                />
              </Form.Field>
              <Form.Field>
                <label> Latency Mode</label>
                <Radio
                  label='LOW'
                  name='latencyMode'
                  value='LOW'
                  checked={this.state.latencyMode === 'LOW'}
                  onChange={this.handleRadio}
                />
              </Form.Field>
              <Form.Field>
                <Radio
                  label='NORMAL'
                  name='latencyMode'
                  value='NORMAL'
                  checked={this.state.latencyMode === 'NORMAL'}
                  onChange={this.handleRadio}
                />
              </Form.Field>
            </Form>
          </Modal.Content>
          <Modal.Actions>
            <Button color='green' onClick={this.onClickHandler}>
              <Icon name='checkmark'/> Create Channel
            </Button>
          </Modal.Actions>
        </Modal>
        <Modal
          centered={false}
          onClose={() => {
              this.setState({popup:false})
              window.location.reload(false)
            }
          }
          open={this.state.popup}
          size='small'
        >
          <Modal.Header> {this.state.popup_header} </Modal.Header>
          <Modal.Content>
            <p>{this.state.popup_msg}</p>
          </Modal.Content>
          <Modal.Actions>
            <Button
              icon='check'
              onClick={() => {
                this.setState({popup:false});
                window.location.reload(false)}
              }
            />
          </Modal.Actions>
        </Modal>
      </header>
      <main>
        <Switch>
          <Route exact path="/" component={ChannelList} />
          <Route exact path="/channelList" component={MyChannels} />
          <Route exact path="/channel" component={Channel} />
        </Switch>
      </main>
      </Router>
    );
  }