diff --git a/client/routes.jsx b/client/routes.jsx index 5eeed0a4..15f631e4 100644 --- a/client/routes.jsx +++ b/client/routes.jsx @@ -20,7 +20,7 @@ import MobileDashboardView from './modules/Mobile/MobileDashboardView'; import { getUser } from './modules/User/actions'; import { stopSketch } from './modules/IDE/actions/ide'; import { userIsAuthenticated, userIsNotAuthenticated, userIsAuthorized } from './utils/auth'; -import { createMobileFirst, responsiveForm } from './utils/responsive'; +import { mobileFirst, responsiveForm } from './utils/responsive'; const checkAuth = (store) => { store.dispatch(getUser()); @@ -34,45 +34,41 @@ const onRouteChange = (store) => { store.dispatch(stopSketch()); }; -const routes = (store) => { - const mobileFirst = createMobileFirst(store); +const routes = store => ( + { onRouteChange(store); }}> + - return ( - { onRouteChange(store); }}> - + + + + + + + + - - - - - - - - + + + + + - - - - - + + - - + + + + - - - - + {/* Mobile-only Routes */} + + - {/* Mobile-only Routes */} - - - - - ); -}; + +); export default routes; diff --git a/client/utils/responsive.jsx b/client/utils/responsive.jsx index 97b14621..05b0d84e 100644 --- a/client/utils/responsive.jsx +++ b/client/utils/responsive.jsx @@ -5,15 +5,11 @@ import ResponsiveForm from '../modules/User/components/ResponsiveForm'; export const mobileEnabled = () => (window.process.env.MOBILE_ENABLED === true); -/** createMobileFirst: Receives the store, and creates a function that chooses between two components, - * aimed at mobile and desktop resolutions, respectively. - * The created function returns a Component (props => jsx) - */ -export const createMobileFirst = store => (MobileComponent, Fallback) => (props) => { +export const mobileFirst = (MobileComponent, Fallback) => (props) => { const { forceDesktop } = useSelector(state => state.editorAccessibility); return ( - {matches => ((matches || (store && forceDesktop) || (!mobileEnabled())) + {matches => ((matches || forceDesktop || (!mobileEnabled())) ? : )}