diff --git a/static/js/redux/actions/modal_actions.jsx b/static/js/redux/actions/modal_actions.jsx index 041118bdd9..2aede87b15 100644 --- a/static/js/redux/actions/modal_actions.jsx +++ b/static/js/redux/actions/modal_actions.jsx @@ -145,3 +145,5 @@ export const setUserSettingsModalVisible = () => ({ export const setUserSettingsModalHidden = () => ({ type: ActionTypes.SET_SETTINGS_MODAL_HIDDEN, }); + +export const toggleMockModal = () => ({ type: ActionTypes.TOGGLE_MOCK_MODAL}); \ No newline at end of file diff --git a/static/js/redux/constants/actionTypes.jsx b/static/js/redux/constants/actionTypes.jsx index b8d29a994b..055ea3f099 100644 --- a/static/js/redux/constants/actionTypes.jsx +++ b/static/js/redux/constants/actionTypes.jsx @@ -180,3 +180,6 @@ export const TRIGGER_TOS_MODAL = 'TRIGGER_TOS_MODAL'; export const TRIGGER_TOS_BANNER = 'TRIGGER_TOS_BANNER'; export const DISMISS_TOS_BANNER = 'DISMISS_TOS_BANNER'; export const CLOSE_TOS_MODAL = 'CLOSE_TOS_MODAL'; + +// MOCK MODAL +export const TOGGLE_MOCK_MODAL = 'TOGGLE_MOCK_MODAL'; \ No newline at end of file diff --git a/static/js/redux/reducers/mock_modal_reducer.jsx b/static/js/redux/reducers/mock_modal_reducer.jsx new file mode 100644 index 0000000000..5c3842004c --- /dev/null +++ b/static/js/redux/reducers/mock_modal_reducer.jsx @@ -0,0 +1,13 @@ + +import * as ActionTypes from '../constants/actionTypes'; + +const mockModal = (state = { isVisible: false}, action) => { + switch(action.type) { + case ActionTypes.TOGGLE_MOCK_MODAL: + return { isVisible: !state.isVisible}; + default: + return state; + } +}; + +export default mockModal; \ No newline at end of file diff --git a/static/js/redux/reducers/root_reducer.jsx b/static/js/redux/reducers/root_reducer.jsx index 1662254265..95eea77605 100644 --- a/static/js/redux/reducers/root_reducer.jsx +++ b/static/js/redux/reducers/root_reducer.jsx @@ -34,6 +34,7 @@ import customSlots from './custom_slots_reducer'; import signupModal from './signup_modal_reducer'; import peerModal from './peer_modal_reducer'; import preferenceModal from './preference_modal_reducer'; +import mockModal from './mock_modal_reducer'; import friends from './friends_reducer'; import notificationToken from './notification_token_reducer'; import integrationModal from './integration_modal_reducer'; @@ -64,6 +65,7 @@ const rootReducer = combineReducers({ optionalCourses, peerModal, preferenceModal, + mockModal, preferences, registrar, saveCalendarModal, diff --git a/static/js/redux/ui/calendar.jsx b/static/js/redux/ui/calendar.jsx index 888d58b48c..56eeb6f66d 100644 --- a/static/js/redux/ui/calendar.jsx +++ b/static/js/redux/ui/calendar.jsx @@ -23,6 +23,8 @@ import CellContainer from './containers/cell_container'; import { DAYS } from '../constants/constants'; import { ShareLink } from './master_slot'; import * as SemesterlyPropTypes from '../constants/semesterlyPropTypes'; +import preferenceModal from '../reducers/preference_modal_reducer'; +import mockModal from '../reducers/mock_modal_reducer'; const Row = (props) => { const timeText = props.displayTime ? {props.displayTime} : null; @@ -308,6 +310,28 @@ class Calendar extends React.Component { ); + const mockButton = ( +
+ + + Mock Button + +
+ ); + console.log(mockButton); + const pilotButton = ( @@ -342,6 +366,7 @@ class Calendar extends React.Component { { pilot }
+ { mockButton } { addSISButton } { addCustomEventButton } { shareButton } @@ -452,6 +477,7 @@ Calendar.defaultProps = { Calendar.propTypes = { togglePreferenceModal: PropTypes.func.isRequired, + toggleMockModal: PropTypes.func.isRequired, triggerSaveCalendarModal: PropTypes.func.isRequired, isFetchingShareLink: PropTypes.bool.isRequired, endHour: PropTypes.number.isRequired, diff --git a/static/js/redux/ui/containers/calendar_container.jsx b/static/js/redux/ui/containers/calendar_container.jsx index f0f14a3187..9898cf2623 100644 --- a/static/js/redux/ui/containers/calendar_container.jsx +++ b/static/js/redux/ui/containers/calendar_container.jsx @@ -21,7 +21,7 @@ import { fetchShareTimetableLink, fetchSISTimetableData, } from '../../actions/calendar_actions'; -import { togglePreferenceModal, triggerSaveCalendarModal } from '../../actions/modal_actions'; +import { togglePreferenceModal, triggerSaveCalendarModal, toggleMockModal} from '../../actions/modal_actions'; import { getMaxEndHour } from '../../reducers/root_reducer'; const mapStateToProps = (state) => { @@ -46,6 +46,7 @@ const CalendarContainer = connect( saveTimetable, fetchShareTimetableLink, togglePreferenceModal, + toggleMockModal, triggerSaveCalendarModal, createICalFromTimetable, handleCreateNewTimetable, diff --git a/static/js/redux/ui/containers/modals/mock_modal_container.jsx b/static/js/redux/ui/containers/modals/mock_modal_container.jsx new file mode 100644 index 0000000000..d4f53f5654 --- /dev/null +++ b/static/js/redux/ui/containers/modals/mock_modal_container.jsx @@ -0,0 +1,21 @@ + +import {connect} from 'react-redux'; +import MockModal from '../../modals/mock_modal'; +import { toggleMockModal } from '../../../actions/modal_actions'; +import { toggleConflicts } from '../../../actions/timetable_actions'; + +const mapStateToProps = state => ({ + isVisible: state.mockModal.isVisible, + withConflicts: state.preferences.try_with_conflicts, +}); + +const MockModalContainer = connect( + mapStateToProps, + { + toggleMockModal, + toggleConflicts, + applyPreferences: toggleMockModal, + }, +)(MockModal); + +export default MockModalContainer; \ No newline at end of file diff --git a/static/js/redux/ui/modals/mock_modal.jsx b/static/js/redux/ui/modals/mock_modal.jsx new file mode 100644 index 0000000000..cf2909b75f --- /dev/null +++ b/static/js/redux/ui/modals/mock_modal.jsx @@ -0,0 +1,48 @@ + +import PropTypes from 'prop-types'; +import React from 'react'; +import Modal from 'boron/FadeModal'; + +class MockModal extends React.Component { + componetDidUpdate() { + if (this.props.isVisible) { + this.modal.show(); + } + } + + render() { + const modalHeader = + (
+
+

Timetable Preferences

+
+
); + const modalStyle = { + width: '100%', + }; + //const modalHeader = (); + return ( + { this.modal = c; }} + className="pref-modal max-modal" + modalStyle={modalStyle} + onHide={this.props.toggleMockModal} + > + {modalHeader} + +
+

Mock Modal!

+
+ + ); + } +} + +MockModal.propTypes = { + toggleConflicts: PropTypes.func.isRequired, + withConflicts: PropTypes.bool.isRequired, + isVisible: PropTypes.bool.isRequired, + toggleMockModal: PropTypes.func.isRequired, +}; + +export default MockModal; \ No newline at end of file diff --git a/static/js/redux/ui/modals/user_acquisition_modal.jsx b/static/js/redux/ui/modals/user_acquisition_modal.jsx index 1a83083299..0f13bf30ac 100644 --- a/static/js/redux/ui/modals/user_acquisition_modal.jsx +++ b/static/js/redux/ui/modals/user_acquisition_modal.jsx @@ -118,7 +118,7 @@ class UserAcquisitionModal extends React.Component { - {/* */} + } + + +
); diff --git a/static/js/redux/ui/modals/user_settings_modal.jsx b/static/js/redux/ui/modals/user_settings_modal.jsx index 395d832ae1..2aadb06ab7 100644 --- a/static/js/redux/ui/modals/user_settings_modal.jsx +++ b/static/js/redux/ui/modals/user_settings_modal.jsx @@ -161,7 +161,10 @@ class UserSettingsModal extends React.Component { ) ; */ const preferences = !this.props.userInfo.FacebookSignedUp ? null : ( -
+
+
+

This is your favorite number: {this.props.userInfo.favorite_num}

+