* feat(nav): make navbar static make the navbar in react layout and the static layout stick to the top of the screen * feat(challenges): Make classic view flex Classic view now uses flex to control it's height. This was necessary to control view and allow navbar to be static on other pages. This breaks mobile view and other non-classic challenge views * feat(app): Add logic to make screen expand on tablet * fix(app): let routes define their content structure * fix(less): use American spelling of gray * fix(classic-preview): make preview smaller to prevent scroll * feat(classic-frame): Make frame border less distinct * fix(challenges): scope test suite less to challenges * feat(challenges): make generic ChallengeTitle component
91 lines
2.4 KiB
JavaScript
91 lines
2.4 KiB
JavaScript
import React, { PropTypes } from 'react';
|
||
import { connect } from 'react-redux';
|
||
import { Button, Modal } from 'react-bootstrap';
|
||
import PureComponent from 'react-pure-render/component';
|
||
|
||
import ns from './ns.json';
|
||
|
||
import { createIssue, openIssueSearch, closeBugModal } from './redux/actions';
|
||
|
||
const mapStateToProps = state => ({ isOpen: state.challengesApp.isBugOpen });
|
||
const mapDispatchToProps = { createIssue, openIssueSearch, closeBugModal };
|
||
const bugLink = 'http://forum.freecodecamp.com/t/how-to-report-a-bug/19543';
|
||
|
||
const propTypes = {
|
||
closeBugModal: PropTypes.func,
|
||
createIssue: PropTypes.func,
|
||
isOpen: PropTypes.bool,
|
||
openIssueSearch: PropTypes.func
|
||
};
|
||
|
||
export class BugModal extends PureComponent {
|
||
render() {
|
||
const {
|
||
isOpen,
|
||
closeBugModal,
|
||
openIssueSearch,
|
||
createIssue
|
||
} = this.props;
|
||
return (
|
||
<Modal
|
||
show={ isOpen }
|
||
>
|
||
<Modal.Header className={ `${ns}-list-header` }>
|
||
Did you find a bug?
|
||
<span
|
||
className='close closing-x'
|
||
onClick={ closeBugModal }
|
||
>
|
||
×
|
||
</span>
|
||
</Modal.Header>
|
||
<Modal.Body className='text-center'>
|
||
<h3>
|
||
Before you submit a new issue,
|
||
read "How to Report a Bug" and
|
||
browse other issues with this challenge.
|
||
</h3>
|
||
<Button
|
||
block={ true }
|
||
bsSize='lg'
|
||
bsStyle='primary'
|
||
href={ bugLink }
|
||
target='_blank'
|
||
>
|
||
Read "How to Report a Bug"
|
||
</Button>
|
||
<Button
|
||
block={ true }
|
||
bsSize='lg'
|
||
bsStyle='primary'
|
||
onClick={ openIssueSearch }
|
||
>
|
||
Browse other issues with this challenge
|
||
</Button>
|
||
<Button
|
||
block={ true }
|
||
bsSize='lg'
|
||
bsStyle='primary'
|
||
onClick={ createIssue }
|
||
>
|
||
Create my GitHub issue
|
||
</Button>
|
||
<Button
|
||
block={ true }
|
||
bsSize='lg'
|
||
bsStyle='primary'
|
||
onClick={ closeBugModal }
|
||
>
|
||
Cancel
|
||
</Button>
|
||
</Modal.Body>
|
||
</Modal>
|
||
);
|
||
}
|
||
}
|
||
|
||
BugModal.displayName = 'BugModal';
|
||
BugModal.propTypes = propTypes;
|
||
|
||
export default connect(mapStateToProps, mapDispatchToProps)(BugModal);
|