1
1
import React , { Component } from 'react'
2
- import { Button , Form , FormGroup , Label , Input } from 'reactstrap'
2
+ import { Button , Form , FormGroup , Label , Input , FormText } from 'reactstrap'
3
3
import { Field , reduxForm } from 'redux-form'
4
+ import { connect } from 'react-redux'
4
5
5
6
6
- class AddProjectForm extends Component {
7
+ class AddProject extends Component {
7
8
renderInput ( field ) {
8
9
return (
9
10
< Input { ...field . input } type = { field . type } placeholder = { field . placeholder } />
@@ -16,16 +17,49 @@ class AddProjectForm extends Component {
16
17
)
17
18
}
18
19
20
+ renderGitUrl ( ) {
21
+ let { formValues } = this . props
22
+ if ( formValues && formValues . values . gitProtocol === "HTTPS" ) {
23
+ return (
24
+ < FormGroup >
25
+ < Label for = "gitUrl" > Git HTTPS Url</ Label >
26
+ < Field name = "gitUrl" component = { this . renderInput } type = "text" placeholder = "https://github.com/checkr/codeflow.git" />
27
+ </ FormGroup >
28
+ )
29
+ } else {
30
+ return (
31
+ < FormGroup >
32
+ < Label for = "gitUrl" > Git SSH Url</ Label >
33
+ < Field name = "gitUrl" component = { this . renderInput } type = "text" placeholder = "[email protected] :checkr/codeflow.git" />
34
+ </ FormGroup >
35
+ )
36
+ }
37
+ }
38
+
19
39
render ( ) {
20
40
const { onSubmit } = this . props
21
41
return (
22
42
< Form onSubmit = { onSubmit } >
23
43
< FormGroup >
24
- < Label for = "gitSshUrl" > Git SSH Url</ Label >
25
- < Field name = "gitSshUrl" component = { this . renderInput } type = "text" placeholder = "[email protected] :checkr/codeflow.git" />
44
+ < Label > Protocol</ Label >
45
+ < FormGroup tag = "fieldset" >
46
+ < FormGroup check >
47
+ < Label check >
48
+ < Field className = "form-check-input" name = { 'gitProtocol' } component = { this . renderInput } type = "radio" value = "SSH" /> SSH
49
+ </ Label >
50
+ < FormText color = "muted" > Use SSH for private repositories</ FormText >
51
+ </ FormGroup >
52
+ < FormGroup check >
53
+ < Label check >
54
+ < Field className = "form-check-input" name = { 'gitProtocol' } component = { this . renderInput } type = "radio" value = "HTTPS" /> HTTPS
55
+ </ Label >
56
+ < FormText color = "muted" > Use HTTPS for public repositories</ FormText >
57
+ </ FormGroup >
58
+ </ FormGroup >
26
59
</ FormGroup >
27
- < FormGroup check >
28
- < Label check >
60
+ { this . renderGitUrl ( ) }
61
+ < FormGroup >
62
+ < Label >
29
63
< Field name = "bookmarked" component = { this . renderCheckbox } type = "checkbox" /> Add to my bookmarks
30
64
</ Label >
31
65
</ FormGroup >
@@ -36,6 +70,13 @@ class AddProjectForm extends Component {
36
70
}
37
71
}
38
72
39
- export default reduxForm ( {
73
+ const AddProjectForm = reduxForm ( {
40
74
form : 'addProject'
41
- } ) ( AddProjectForm )
75
+ } ) ( AddProject )
76
+
77
+ export default connect (
78
+ state => {
79
+ const formValues = state . form . addProject
80
+ return { formValues : formValues , initialValues : { gitProtocol : "SSH" , bookmarked : true } }
81
+ }
82
+ ) ( AddProjectForm )
0 commit comments