Skip to content

Commit 8d9f94f

Browse files
ghalestriloghalestrilo
committed
♻️ cleanup routes.jsx
1 parent f4d654a commit 8d9f94f

File tree

2 files changed

+33
-41
lines changed

2 files changed

+33
-41
lines changed

‎client/routes.jsx

Lines changed: 31 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@ import MobileDashboardView from './modules/Mobile/MobileDashboardView';
2020
import { getUser } from './modules/User/actions';
2121
import { stopSketch } from './modules/IDE/actions/ide';
2222
import { userIsAuthenticated, userIsNotAuthenticated, userIsAuthorized } from './utils/auth';
23-
import { createMobileFirst, responsiveForm } from './utils/responsive';
23+
import { mobileFirst, responsiveForm } from './utils/responsive';
2424

2525
const checkAuth = (store) => {
2626
store.dispatch(getUser());
@@ -34,45 +34,41 @@ const onRouteChange = (store) => {
3434
store.dispatch(stopSketch());
3535
};
3636

37-
const routes = (store) => {
38-
const mobileFirst = createMobileFirst(store);
37+
const routes = store => (
38+
<Route path="/" component={App} onChange={() => { onRouteChange(store); }}>
39+
<IndexRoute onEnter={checkAuth(store)} component={mobileFirst(MobileIDEView, IDEView)} />
3940

40-
return (
41-
<Route path="/" component={App} onChange={() => { onRouteChange(store); }}>
42-
<IndexRoute onEnter={checkAuth(store)} component={mobileFirst(MobileIDEView, IDEView)} />
41+
<Route path="/login" component={userIsNotAuthenticated(mobileFirst(responsiveForm(LoginView), LoginView))} />
42+
<Route path="/signup" component={userIsNotAuthenticated(mobileFirst(responsiveForm(SignupView), SignupView))} />
43+
<Route path="/reset-password" component={userIsNotAuthenticated(ResetPasswordView)} />
44+
<Route path="/verify" component={EmailVerificationView} />
45+
<Route
46+
path="/reset-password/:reset_password_token"
47+
component={NewPasswordView}
48+
/>
49+
<Route path="/projects/:project_id" component={IDEView} />
50+
<Route path="/:username/full/:project_id" component={FullView} />
51+
<Route path="/full/:project_id" component={FullView} />
4352

44-
<Route path="/login" component={userIsNotAuthenticated(mobileFirst(responsiveForm(LoginView), LoginView))} />
45-
<Route path="/signup" component={userIsNotAuthenticated(mobileFirst(responsiveForm(SignupView), SignupView))} />
46-
<Route path="/reset-password" component={userIsNotAuthenticated(ResetPasswordView)} />
47-
<Route path="/verify" component={EmailVerificationView} />
48-
<Route
49-
path="/reset-password/:reset_password_token"
50-
component={NewPasswordView}
51-
/>
52-
<Route path="/projects/:project_id" component={IDEView} />
53-
<Route path="/:username/full/:project_id" component={FullView} />
54-
<Route path="/full/:project_id" component={FullView} />
53+
<Route path="/:username/assets" component={userIsAuthenticated(userIsAuthorized(mobileFirst(MobileDashboardView, DashboardView)))} />
54+
<Route path="/:username/sketches" component={mobileFirst(MobileDashboardView, DashboardView)} />
55+
<Route path="/:username/sketches/:project_id" component={mobileFirst(MobileIDEView, IDEView)} />
56+
<Route path="/:username/sketches/:project_id/add-to-collection" component={mobileFirst(MobileIDEView, IDEView)} />
57+
<Route path="/:username/collections" component={mobileFirst(MobileDashboardView, DashboardView)} />
5558

56-
<Route path="/:username/assets" component={userIsAuthenticated(userIsAuthorized(mobileFirst(MobileDashboardView, DashboardView)))} />
57-
<Route path="/:username/sketches" component={mobileFirst(MobileDashboardView, DashboardView)} />
58-
<Route path="/:username/sketches/:project_id" component={mobileFirst(MobileIDEView, IDEView)} />
59-
<Route path="/:username/sketches/:project_id/add-to-collection" component={mobileFirst(MobileIDEView, IDEView)} />
60-
<Route path="/:username/collections" component={mobileFirst(MobileDashboardView, DashboardView)} />
59+
<Route path="/:username/collections/create" component={DashboardView} />
60+
<Route path="/:username/collections/:collection_id" component={CollectionView} />
6161

62-
<Route path="/:username/collections/create" component={DashboardView} />
63-
<Route path="/:username/collections/:collection_id" component={CollectionView} />
62+
<Route path="/sketches" component={createRedirectWithUsername('/:username/sketches')} />
63+
<Route path="/assets" component={createRedirectWithUsername('/:username/assets')} />
64+
<Route path="/account" component={userIsAuthenticated(AccountView)} />
65+
<Route path="/about" component={IDEView} />
6466

65-
<Route path="/sketches" component={createRedirectWithUsername('/:username/sketches')} />
66-
<Route path="/assets" component={createRedirectWithUsername('/:username/assets')} />
67-
<Route path="/account" component={userIsAuthenticated(AccountView)} />
68-
<Route path="/about" component={IDEView} />
67+
{/* Mobile-only Routes */}
68+
<Route path="/preview" component={MobileSketchView} />
69+
<Route path="/preferences" component={MobilePreferences} />
6970

70-
{/* Mobile-only Routes */}
71-
<Route path="/preview" component={MobileSketchView} />
72-
<Route path="/preferences" component={MobilePreferences} />
73-
74-
</Route>
75-
);
76-
};
71+
</Route>
72+
);
7773

7874
export default routes;

‎client/utils/responsive.jsx

Lines changed: 2 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -5,15 +5,11 @@ import ResponsiveForm from '../modules/User/components/ResponsiveForm';
55

66
export const mobileEnabled = () => (window.process.env.MOBILE_ENABLED === true);
77

8-
/** createMobileFirst: Receives the store, and creates a function that chooses between two components,
9-
* aimed at mobile and desktop resolutions, respectively.
10-
* The created function returns a Component (props => jsx)
11-
*/
12-
export const createMobileFirst = store => (MobileComponent, Fallback) => (props) => {
8+
export const mobileFirst = (MobileComponent, Fallback) => (props) => {
139
const { forceDesktop } = useSelector(state => state.editorAccessibility);
1410
return (
1511
<MediaQuery minWidth={770}>
16-
{matches => ((matches || (store && forceDesktop) || (!mobileEnabled()))
12+
{matches => ((matches || forceDesktop || (!mobileEnabled()))
1713
? <Fallback {...props} />
1814
: <MobileComponent {...props} />)}
1915
</MediaQuery>

0 commit comments

Comments
 (0)