Skip to content

Commit d126821

Browse files
ghalestriloghalestrilo
authored
Merge pull request #1564 from ghalestrilo/feature/switch-mobile-desktop
Feature/switch mobile desktop
2 parents 017dd2c + 8b619c6 commit d126821

File tree

18 files changed

+152
-123
lines changed

18 files changed

+152
-123
lines changed

‎client/components/Dropdown.jsx

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -91,7 +91,8 @@ Dropdown.propTypes = {
9191
items: PropTypes.arrayOf(PropTypes.shape({
9292
action: PropTypes.func,
9393
icon: PropTypes.func,
94-
href: PropTypes.string
94+
href: PropTypes.string,
95+
title: PropTypes.string
9596
})),
9697
};
9798

‎client/constants.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -62,6 +62,7 @@ export const COLLAPSE_CONSOLE = 'COLLAPSE_CONSOLE';
6262

6363
export const UPDATE_LINT_MESSAGE = 'UPDATE_LINT_MESSAGE';
6464
export const CLEAR_LINT_MESSAGE = 'CLEAR_LINT_MESSAGE';
65+
export const TOGGLE_FORCE_DESKTOP = 'TOGGLE_FORCE_DESKTOP';
6566

6667
export const UPDATE_FILE_NAME = 'UPDATE_FILE_NAME';
6768
export const DELETE_FILE = 'DELETE_FILE';

‎client/modules/IDE/actions/editorAccessibility.js

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -14,3 +14,9 @@ export function clearLintMessage() {
1414
type: ActionTypes.CLEAR_LINT_MESSAGE
1515
};
1616
}
17+
18+
export function toggleForceDesktop() {
19+
return {
20+
type: ActionTypes.TOGGLE_FORCE_DESKTOP
21+
};
22+
}

‎client/modules/IDE/components/SketchList.jsx

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -263,8 +263,6 @@ class SketchListRowBase extends React.Component {
263263
url = `/${username}/sketches/${slugify(sketch.name, '_')}`;
264264
}
265265

266-
if (this.props.mobile) url = `/mobile${url}`;
267-
268266
const name = (
269267
<React.Fragment>
270268
<Link to={url}>

‎client/modules/IDE/pages/MobileIDEView.jsx

Lines changed: 14 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -63,19 +63,19 @@ const NavItem = styled.li`
6363
position: relative;
6464
`;
6565

66-
const getNavOptions = (username = undefined, logoutUser = () => {}) =>
66+
const getNavOptions = (username = undefined, logoutUser = () => {}, toggleForceDesktop = () => {}) =>
6767
(username
6868
? [
69-
{ icon: PreferencesIcon, title: 'Preferences', href: '/mobile/preferences', },
70-
{ icon: PreferencesIcon, title: 'My Stuff', href: `/mobile/${username}/sketches` },
71-
{ icon: PreferencesIcon, title: 'Examples', href: '/mobile/p5/sketches' },
72-
{ icon: PreferencesIcon, title: 'Original Editor', href: '/', },
69+
{ icon: PreferencesIcon, title: 'Preferences', href: '/preferences', },
70+
{ icon: PreferencesIcon, title: 'My Stuff', href: `/${username}/sketches` },
71+
{ icon: PreferencesIcon, title: 'Examples', href: '/p5/sketches' },
72+
{ icon: PreferencesIcon, title: 'Original Editor', action: toggleForceDesktop, },
7373
{ icon: PreferencesIcon, title: 'Logout', action: logoutUser, },
7474
]
7575
: [
76-
{ icon: PreferencesIcon, title: 'Preferences', href: '/mobile/preferences', },
77-
{ icon: PreferencesIcon, title: 'Examples', href: '/mobile/p5/sketches' },
78-
{ icon: PreferencesIcon, title: 'Original Editor', href: '/', },
76+
{ icon: PreferencesIcon, title: 'Preferences', href: '/preferences', },
77+
{ icon: PreferencesIcon, title: 'Examples', href: '/p5/sketches' },
78+
{ icon: PreferencesIcon, title: 'Original Editor', action: toggleForceDesktop, },
7979
{ icon: PreferencesIcon, title: 'Login', href: '/login', },
8080
]
8181
);
@@ -86,7 +86,8 @@ const MobileIDEView = (props) => {
8686
selectedFile, updateFileContent, files, user, params,
8787
closeEditorOptions, showEditorOptions, logoutUser,
8888
startRefreshSketch, stopSketch, expandSidebar, collapseSidebar, clearConsole, console,
89-
showRuntimeErrorWarning, hideRuntimeErrorWarning, startSketch, getProject, clearPersistedState, setUnsavedChanges
89+
showRuntimeErrorWarning, hideRuntimeErrorWarning, startSketch, getProject, clearPersistedState, setUnsavedChanges,
90+
toggleForceDesktop
9091
} = props;
9192

9293
const [tmController, setTmController] = useState(null); // eslint-disable-line
@@ -112,7 +113,7 @@ const MobileIDEView = (props) => {
112113

113114
// Screen Modals
114115
const [toggleNavDropdown, NavDropDown] = useAsModal(<Dropdown
115-
items={getNavOptions(username, logoutUser)}
116+
items={getNavOptions(username, logoutUser, toggleForceDesktop)}
116117
align="right"
117118
/>);
118119

@@ -131,6 +132,7 @@ const MobileIDEView = (props) => {
131132
subtitle={selectedFile.name}
132133
>
133134
<NavItem>
135+
134136
<IconButton
135137
onClick={toggleNavDropdown}
136138
icon={MoreIcon}
@@ -139,7 +141,7 @@ const MobileIDEView = (props) => {
139141
<NavDropDown />
140142
</NavItem>
141143
<li>
142-
<IconButton to="/mobile/preview" onClick={() => { startSketch(); }} icon={PlayIcon} aria-label="Run sketch" />
144+
<IconButton to="/preview" onClick={() => { startSketch(); }} icon={PlayIcon} aria-label="Run sketch" />
143145
</li>
144146
</Header>
145147

@@ -289,6 +291,7 @@ MobileIDEView.propTypes = {
289291
showRuntimeErrorWarning: PropTypes.func.isRequired,
290292

291293
hideRuntimeErrorWarning: PropTypes.func.isRequired,
294+
toggleForceDesktop: PropTypes.func.isRequired,
292295

293296
user: PropTypes.shape({
294297
authenticated: PropTypes.bool.isRequired,

‎client/modules/IDE/reducers/editorAccessibility.js

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,8 @@
11
import * as ActionTypes from '../../../constants';
22

33
const initialState = {
4-
lintMessages: []
4+
lintMessages: [],
5+
forceDesktop: false
56
};
67
let messageId = 0;
78

@@ -16,6 +17,8 @@ const editorAccessibility = (state = initialState, action) => {
1617
});
1718
case ActionTypes.CLEAR_LINT_MESSAGE:
1819
return Object.assign({}, state, { lintMessages: [] });
20+
case ActionTypes.TOGGLE_FORCE_DESKTOP:
21+
return Object.assign({}, state, { forceDesktop: !(state.forceDesktop) });
1922
default:
2023
return state;
2124
}

‎client/modules/Mobile/MobileDashboardView.jsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -138,8 +138,8 @@ const Panels = {
138138

139139

140140
const navOptions = username => [
141-
{ title: 'Create Sketch', href: '/mobile' },
142-
{ title: 'Create Collection', href: `/mobile/${username}/collections/create` }
141+
{ title: 'Create Sketch', href: '/' },
142+
{ title: 'Create Collection', href: `/${username}/collections/create` }
143143
];
144144

145145

@@ -185,7 +185,7 @@ const MobileDashboard = ({ params, location }) => {
185185
<NavDropdown />
186186

187187
</NavItem>
188-
<IconButton to="/mobile" icon={ExitIcon} aria-label="Return to ide view" />
188+
<IconButton to="/" icon={ExitIcon} aria-label="Return to ide view" />
189189
</Header>
190190

191191

‎client/modules/Mobile/MobilePreferences.jsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -69,7 +69,7 @@ const MobilePreferences = () => {
6969
<Screen fullscreen>
7070
<section>
7171
<Header transparent title="Preferences">
72-
<IconButton to="/mobile" icon={ExitIcon} aria-label="Return to ide view" />
72+
<IconButton to="/" icon={ExitIcon} aria-label="Return to ide view" />
7373
</Header>
7474
<section className="preferences">
7575
<Content>

‎client/modules/Mobile/MobileSketchView.jsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -39,7 +39,7 @@ const MobileSketchView = () => {
3939
return (
4040
<Screen fullscreen>
4141
<Header
42-
leftButton={<IconButton to="/mobile" icon={ExitIcon} aria-label="Return to original editor" />}
42+
leftButton={<IconButton to="/" icon={ExitIcon} aria-label="Return to original editor" />}
4343
title={projectName}
4444
/>
4545
<Content>

‎client/modules/User/components/ResponsiveForm.jsx

Lines changed: 1 addition & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import PropTypes from 'prop-types';
44
import { remSize } from '../../../theme';
55

66

7-
const ResponsiveFormWrapper = styled.div`
7+
const ResponsiveForm = styled.div`
88
.form-container__content {
99
width: unset !important;
1010
padding-top: ${remSize(16)};
@@ -42,23 +42,4 @@ const ResponsiveFormWrapper = styled.div`
4242
}
4343
`;
4444

45-
const ResponsiveForm = props =>
46-
(props.mobile === true
47-
? (
48-
<ResponsiveFormWrapper>
49-
{props.children}
50-
</ResponsiveFormWrapper>
51-
52-
)
53-
: props.children);
54-
55-
ResponsiveForm.propTypes = {
56-
mobile: PropTypes.bool,
57-
children: PropTypes.oneOfType([PropTypes.node, PropTypes.array]),
58-
};
59-
ResponsiveForm.defaultProps = {
60-
mobile: false,
61-
children: []
62-
};
63-
6445
export default ResponsiveForm;

0 commit comments

Comments
 (0)