| changeset 95 | 7bc08467c726 |
| parent 93 | 469da13402e2 |
| child 124 | c77570164050 |
| 94:2c2a9c8dc216 | 95:7bc08467c726 |
|---|---|
1 import React, { Component } from 'react'; |
1 import React, { Component } from 'react'; |
2 import { connect } from 'react-redux'; |
2 import { connect } from 'react-redux'; |
3 import { bindActionCreators } from 'redux'; |
3 import { bindActionCreators } from 'redux'; |
4 import { Grid, Row, Col, ListGroup, ListGroupItem, Button } from 'react-bootstrap'; |
4 import { Grid, Row, Col, ListGroup, ListGroupItem, Button, Modal } from 'react-bootstrap'; |
5 import moment from 'moment'; |
5 import moment from 'moment'; |
6 import '../App.css'; |
6 import '../App.css'; |
7 import Navbar from './Navbar'; |
7 import Navbar from './Navbar'; |
8 import * as sessionsActions from '../actions/sessionsActions'; |
8 import * as sessionsActions from '../actions/sessionsActions'; |
9 import uuidV1 from 'uuid/v1'; |
9 import uuidV1 from 'uuid/v1'; |
10 |
10 |
11 class SessionList extends Component { |
11 class SessionList extends Component { |
12 |
|
13 state = { |
|
14 showModal: false, |
|
15 sessionToDelete: null |
|
16 } |
|
12 |
17 |
13 createSession = () => { |
18 createSession = () => { |
14 const sessionId = uuidV1(); |
19 const sessionId = uuidV1(); |
15 this.props.sessionsActions.createSession(sessionId); |
20 this.props.sessionsActions.createSession(sessionId); |
16 this.props.history.push('/sessions/' + sessionId); |
21 this.props.history.push('/sessions/' + sessionId); |
18 |
23 |
19 onClickDelete(session, e) { |
24 onClickDelete(session, e) { |
20 e.preventDefault(); |
25 e.preventDefault(); |
21 e.stopPropagation(); |
26 e.stopPropagation(); |
22 |
27 |
23 this.props.sessionsActions.deleteSession(session); |
28 this.setState({ |
29 showModal: true, |
|
30 sessionToDelete: session |
|
31 }) |
|
32 } |
|
33 |
|
34 closeModal = () => { |
|
35 this.setState({ showModal: false }) |
|
36 } |
|
37 |
|
38 deleteSession = () => { |
|
39 const { sessionToDelete } = this.state; |
|
40 |
|
41 this.props.sessionsActions.deleteSession(sessionToDelete); |
|
42 |
|
43 this.setState({ |
|
44 showModal: false, |
|
45 sessionToDelete: null |
|
46 }) |
|
24 } |
47 } |
25 |
48 |
26 render() { |
49 render() { |
27 return ( |
50 return ( |
28 <div> |
51 <div> |
44 </ListGroup> |
67 </ListGroup> |
45 <Button bsStyle="success" onClick={this.createSession}>Create new session</Button> |
68 <Button bsStyle="success" onClick={this.createSession}>Create new session</Button> |
46 </Col> |
69 </Col> |
47 </Row> |
70 </Row> |
48 </Grid> |
71 </Grid> |
72 |
|
73 <Modal show={ this.state.showModal } onHide={ this.closeModal }> |
|
74 <Modal.Body> |
|
75 Are you sure? |
|
76 </Modal.Body> |
|
77 <Modal.Footer> |
|
78 <Button bsStyle="primary" onClick={ this.deleteSession }>Confirm</Button> |
|
79 <Button onClick={ this.closeModal }>Close</Button> |
|
80 </Modal.Footer> |
|
81 </Modal> |
|
82 |
|
49 </div> |
83 </div> |
50 ); |
84 ); |
51 } |
85 } |
52 } |
86 } |
53 |
87 |