render()

in lti-components/web/src/components/ConfigEditor.js [106:133]


    render() {
        return (
            <>
            <Button variant={`link`} className={this.props.size||'btn'} onClick={this.handleVisibility}>
                <FontAwesomeIcon icon={faCog} />
            </Button>
    
            <Modal show={this.state.show} onHide={this.handleVisibility} >
                <Form onSubmit={this.handleSubmit}>
                    <Modal.Header closeButton>
                    <Modal.Title>Page settings</Modal.Title>
                    </Modal.Header>
                    <Modal.Body>
                            {this.state.alert.message && (
                                <Alert variant={this.state.alert.variant||`info`}><FontAwesomeIcon icon={this.state.alert.icon} /> {this.state.alert.message||``}</Alert>
                            )}
                            <Form.Group controlId="formTitle">
                                <FontAwesomeIcon icon={faInfoCircle} className="mr-1" /> <Form.Label><b>Page title:</b></Form.Label>
                                <Form.Control 
                                    type="text" 
                                    value={this.state.config.title.substring(0, 200)}
                                    onChange={(e)=>this.handleConfigChange(`title`, e.target.value)}
                                    disabled={this.state.lock} />
                            </Form.Group>

                            <Form.Group controlId="formDetail">
                                <FontAwesomeIcon icon={faInfoCircle} className="mr-1"/> <Form.Label><b>Page details:</b></Form.Label>
                                <Form.Control as="textarea" rows={3} value={(this.state.config.detail||``).substring(0, 1000)} onChange={(e)=>this.handleConfigChange(`detail`, e.target.value)} disabled={this.state.lock}></Form.Control>