Files
freeCodeCamp/common/app/routes/challenges/Bug-Modal.jsx
Berkeley Martinez f4443e16dd feat(nav): make navbar static (#13673)
* 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
2017-03-13 18:17:07 -05:00

91 lines
2.4 KiB
JavaScript
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

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);