In Containers/RootContainer.js
add:
<Dropdown />
import React from 'react' | |
import DropdownAlert from 'react-native-dropdownalert' | |
import DropdownAlertReduxActions from '../Redux/DropdownAlertRedux' | |
import I18n from 'react-native-i18n' | |
import { Colors } from '../Themes' | |
import { connect } from 'react-redux' | |
class Dropdown extends React.Component { | |
dropdown: DropdownAlert | |
componentWillReceiveProps ({alert}) { | |
if (!alert) { | |
return | |
} | |
this.dropdown.alertWithType(alert.type, I18n.t(alert.title), I18n.t(alert.message)) | |
} | |
alertClosed () { | |
this.props.clear() | |
} | |
render () { | |
const {alert} = this.props | |
return ( | |
<DropdownAlert | |
warnColor={Colors.primaryYellow} | |
errorColor={Colors.primaryRed} | |
successColor={Colors.primaryGreen} | |
ref={ref => { this.dropdown = ref }} | |
closeInterval={(alert && alert.closeInterval) || 2500} | |
onClose={() => this.alertClosed()} | |
/> | |
) | |
} | |
} | |
const mapStateToProps = (state) => { | |
return { | |
alert: state.dropdownAlert.alert | |
} | |
} | |
const mapDispatchToProps = (dispatch) => { | |
return { | |
clear: () => dispatch(DropdownAlertReduxActions.clearAlert()) | |
} | |
} | |
export default connect(mapStateToProps, mapDispatchToProps)(Dropdown) |
import { createActions, createReducer } from 'reduxsauce' | |
import Immutable from 'seamless-immutable' | |
/* ------------- Types and Action Creators ------------- */ | |
const {Types, Creators} = createActions({ | |
alertError: ['title', 'message', 'closeInterval'], | |
alertInfo: ['title', 'message', 'closeInterval'], | |
alertWarn: ['title', 'message', 'closeInterval'], | |
alertSuccess: ['title', 'message', 'closeInterval'], | |
clearAlert: null | |
}) | |
export const DropdownAlertTypes = Types | |
export default Creators | |
/* ------------- Initial State ------------- */ | |
export const INITIAL_STATE = Immutable({alert: null}) | |
export const log = (state, type, {title, message}) => Immutable({alert: {title, message, type}}) | |
export const error = (state, action) => log(state, 'error', action) | |
export const info = (state, action) => log(state, 'info', action) | |
export const warn = (state, action) => log(state, 'warn', action) | |
export const success = (state, action) => log(state, 'success', action) | |
export const clear = () => INITIAL_STATE | |
/* ------------- Hookup Reducers To Types ------------- */ | |
export const reducer = createReducer(INITIAL_STATE, { | |
[Types.ALERT_ERROR]: error, | |
[Types.ALERT_INFO]: info, | |
[Types.ALERT_WARN]: warn, | |
[Types.ALERT_SUCCESS]: success, | |
[Types.CLEAR_ALERT]: clear | |
}) |