♻️ cleanup routes.jsx

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,10 +34,7 @@ const onRouteChange = (store) => {
   store.dispatch(stopSketch());
 };
 
-const routes = (store) => {
-  const mobileFirst = createMobileFirst(store);
-
-  return (
+const routes = store => (
   <Route path="/" component={App} onChange={() => { onRouteChange(store); }}>
     <IndexRoute onEnter={checkAuth(store)} component={mobileFirst(MobileIDEView, IDEView)} />
 
@@ -73,6 +70,5 @@ const routes = (store) => {
 
   </Route>
 );
-};
 
 export default routes;

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 (
     <MediaQuery minWidth={770}>
-      {matches => ((matches || (store && forceDesktop) || (!mobileEnabled()))
+      {matches => ((matches || forceDesktop || (!mobileEnabled()))
         ? <Fallback {...props} />
         : <MobileComponent {...props} />)}
     </MediaQuery>