{/* className="nav__items-left" */}
{items && items.map(({ title, icon, href }) => (
@@ -72,6 +73,8 @@ const Dropdown = ({ items }) => (
);
Dropdown.propTypes = {
+ right: PropTypes.bool,
+ left: PropTypes.bool,
items: PropTypes.arrayOf(PropTypes.shape({
action: PropTypes.func,
icon: PropTypes.func,
@@ -81,6 +84,8 @@ Dropdown.propTypes = {
Dropdown.defaultProps = {
items: [],
+ right: false,
+ left: false,
};
export default Dropdown;
diff --git a/client/components/OverlayManager.jsx b/client/components/OverlayManager.jsx
index 91c2b760..1b3b040c 100644
--- a/client/components/OverlayManager.jsx
+++ b/client/components/OverlayManager.jsx
@@ -1,29 +1,8 @@
-import React, { useRef, useEffect } from 'react';
+import React from 'react';
import PropTypes from 'prop-types';
import { createPortal } from 'react-dom';
-import Dropdown from './Dropdown';
-
-import { PreferencesIcon } from '../common/icons';
-import { useModalBehavior } from '../utils/custom-hooks';
-
-
const OverlayManager = ({ overlay, hideOverlay }) => {
- const headerNavOptions = [
- {
- icon: PreferencesIcon,
- title: 'Preferences',
- href: '/mobile/preferences',
- },
- { icon: PreferencesIcon, title: 'Examples', href: '/mobile/examples' },
- {
- icon: PreferencesIcon,
- title: 'Original Editor',
- href: '/mobile/preferences',
- },
- ];
-
- // const setRef = useModalBehavior(hideOverlay);
// const [visible, trigger, setRef] = useModalBehavior();
const jsx = (
diff --git a/client/components/mobile/Header.jsx b/client/components/mobile/Header.jsx
index cf727b7c..ded0b3be 100644
--- a/client/components/mobile/Header.jsx
+++ b/client/components/mobile/Header.jsx
@@ -31,7 +31,9 @@ const HeaderDiv = styled.div`
const IconContainer = styled.div`
margin-left: ${props => (props.leftButton ? remSize(32) : remSize(4))};
+ list-style: none;
display: flex;
+ flex-direction: horizontal;
`;
diff --git a/client/modules/App/App.jsx b/client/modules/App/App.jsx
index af441a9d..346ea411 100644
--- a/client/modules/App/App.jsx
+++ b/client/modules/App/App.jsx
@@ -34,7 +34,8 @@ class App extends React.Component {
render() {
return (
- {this.state.isMounted && !window.devToolsExtension && getConfig('NODE_ENV') === 'development' && }
+ {/* FIXME: remove false */}
+ {false && this.state.isMounted && !window.devToolsExtension && getConfig('NODE_ENV') === 'development' && }
{this.props.children}
);
diff --git a/client/modules/IDE/pages/MobileIDEView.jsx b/client/modules/IDE/pages/MobileIDEView.jsx
index db256264..1c83ba06 100644
--- a/client/modules/IDE/pages/MobileIDEView.jsx
+++ b/client/modules/IDE/pages/MobileIDEView.jsx
@@ -67,13 +67,9 @@ const MobileIDEView = (props) => {
} = props;
const [tmController, setTmController] = useState(null); // eslint-disable-line
- const [overlayName, setOverlay] = useState(null); // eslint-disable-line
- // TODO: Move this to OverlayController (?)
- const hideOverlay = () => setOverlay(null);
- // const overlayRef = useRef({});
- const [triggerNavDropdown, NavDropDown] = useAsModal();
+ const [triggerNavDropdown, NavDropDown] = useAsModal();
return (
@@ -84,12 +80,17 @@ const MobileIDEView = (props) => {
}
>
-
- { startSketch(); }} icon={PlayIcon} aria-label="Run sketch" />
+
+
+
+
+
+ { startSketch(); }} icon={PlayIcon} aria-label="Run sketch" />
+
@@ -107,9 +108,7 @@ const MobileIDEView = (props) => {
editorOptionsVisible={ide.editorOptionsVisible}
showEditorOptions={showEditorOptions}
closeEditorOptions={closeEditorOptions}
- showKeyboardShortcutModal={showKeyboardShortcutModal}
- setUnsavedChanges={setUnsavedChanges}
- isPlaying={ide.isPlaying}
+ showKeyboard={ide.isPlaying}
theme={preferences.theme}
startRefreshSketch={startRefreshSketch}
stopSketch={stopSketch}
@@ -133,12 +132,6 @@ const MobileIDEView = (props) => {
{ide.consoleIsExpanded && }
-
- {/* */}
);
};