fix(Router): Link should use reselect

This commit is contained in:
Berkeley Martinez
2017-12-03 13:38:52 -08:00
parent 63875316d9
commit bf706e9bf2
2 changed files with 16 additions and 10 deletions

View File

@ -1,18 +1,26 @@
import React from 'react'; import React from 'react';
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import { connect } from 'react-redux'; import { connect } from 'react-redux';
import { selectLocationState } from 'redux-first-router'; import { createSelector } from 'reselect';
import toUrl from './to-url.js'; import toUrl from './to-url.js';
import createHandler from './handle-press.js'; import createHandler from './handle-press.js';
import { langSelector } from './redux'; import { routesMapSelector, langSelector } from './redux';
const mapStateToProps = createSelector(
langSelector,
routesMapSelector,
(lang, routesMap) => ({ lang, routesMap })
);
const propTypes = { const propTypes = {
children: PropTypes.node, children: PropTypes.node,
dispatch: PropTypes.func, dispatch: PropTypes.func,
lang: PropTypes.string,
onClick: PropTypes.func, onClick: PropTypes.func,
redirect: PropTypes.bool, redirect: PropTypes.bool,
replace: PropTypes.bool, replace: PropTypes.bool,
routesMap: PropTypes.object,
shouldDispatch: PropTypes.bool, shouldDispatch: PropTypes.bool,
target: PropTypes.string, target: PropTypes.string,
to: PropTypes.oneOfType([ PropTypes.object, PropTypes.string ]).isRequired to: PropTypes.oneOfType([ PropTypes.object, PropTypes.string ]).isRequired
@ -22,19 +30,16 @@ export const Link = (
{ {
children, children,
dispatch, dispatch,
lang,
onClick, onClick,
redirect, redirect,
replace, replace,
routesMap,
shouldDispatch = true, shouldDispatch = true,
target, target,
to to
}, }
{ store }
) => { ) => {
const state = store.getState();
const lang = langSelector(state);
const location = selectLocationState(state);
const { routesMap } = location;
const url = toUrl(to, routesMap, lang); const url = toUrl(to, routesMap, lang);
const handler = createHandler( const handler = createHandler(
url, url,
@ -77,4 +82,4 @@ Link.contextTypes = {
}; };
Link.propTypes = propTypes; Link.propTypes = propTypes;
export default connect()(Link); export default connect(mapStateToProps)(Link);

View File

@ -4,4 +4,5 @@ export const paramsSelector = state => selectLocationState(state).payload || {};
export const locationTypeSelector = export const locationTypeSelector =
state => selectLocationState(state).type || ''; state => selectLocationState(state).type || '';
export const langSelector = state => paramsSelector(state).lang || 'en'; export const langSelector = state => paramsSelector(state).lang || 'en';
export const routesMapSelector = state => paramsSelector(state).routesMap || {}; export const routesMapSelector = state =>
selectLocationState(state).routesMap || {};