🚧 change mobile breakpoint to 800px

This commit is contained in:
ghalestrilo 2020-08-19 17:53:51 -03:00
parent ddc95fa488
commit 26336a24a8

View file

@ -27,20 +27,12 @@ const checkAuth = (store) => {
store.dispatch(getUser()); store.dispatch(getUser());
}; };
// const MobileFirstRoute = props => ( const mobileFirst = (MobileComponent, Fallback) => props => (
// <Route path={props.path} {...props}> <MediaQuery minDeviceWidth={800}>
// <MediaQuery minDeviceWidth={1224}> {matches => (matches
// {matches => (matches ? <Fallback {...props} />
// ? props.component(props) : <MobileComponent {...props} />)}
// : props.fallback(props))} </MediaQuery>);
// </MediaQuery>
// </Route>);
// MobileFirstRoute.propTypes = {
// path: PropTypes.string.isRequired,
// component: PropTypes.any.isRequired, // eslint-disable-line
// fallback: PropTypes.any.isRequired // eslint-disable-line
// };
// TODO: This short-circuit seems unnecessary - using the mobile <Switch /> navigator (future) should prevent this from being called // TODO: This short-circuit seems unnecessary - using the mobile <Switch /> navigator (future) should prevent this from being called
const onRouteChange = (store) => { const onRouteChange = (store) => {
@ -52,15 +44,7 @@ const onRouteChange = (store) => {
const routes = store => ( const routes = store => (
<Route path="/" component={App} onChange={() => { onRouteChange(store); }}> <Route path="/" component={App} onChange={() => { onRouteChange(store); }}>
<IndexRoute <IndexRoute onEnter={checkAuth(store)} component={mobileFirst(MobileIDEView, IDEView)} />
onEnter={checkAuth(store)}
component={props => (
<MediaQuery minDeviceWidth={1224}>
{matches => (matches
? <IDEView {...props} />
: <MobileIDEView {...props} />)}
</MediaQuery>)}
/>
<Route path="/login" component={userIsNotAuthenticated(LoginView)} /> <Route path="/login" component={userIsNotAuthenticated(LoginView)} />
<Route path="/signup" component={userIsNotAuthenticated(SignupView)} /> <Route path="/signup" component={userIsNotAuthenticated(SignupView)} />