🚧 make link to /mobile

Author: ghalestrilo

client/common/Icons.jsx

@@ -9,6 +9,7 @@ import Close from '../images/close.svg';
 import DropdownArrow from '../images/down-filled-triangle.svg';
 import Play from '../images/triangle-arrow-right.svg';
 import Preferences from '../images/preferences.svg';
+import Exit from '../images/exit.svg';
 
 
 // HOC that adds the right web accessibility props
@@ -54,3 +55,4 @@ export const CloseIcon = withLabel(Close);
 export const DropdownArrowIcon = withLabel(DropdownArrow);
 export const PlayIcon = withLabel(Play);
 export const PreferencesIcon = withLabel(Preferences);
+export const ExitIcon = withLabel(Exit);

client/modules/IDE/pages/IDEViewMobile.jsx

@@ -31,7 +31,6 @@ import Header from '../../../components/mobile/Header';
 import Screen from '../../../components/mobile/MobileScreen';
 import Footer from '../../../components/mobile/Footer';
 
-const background = prop('Button.default.background');
 const textColor = prop('primaryTextColor');
 
 const Content = styled.div`
@@ -79,9 +78,11 @@ const IDEViewMobile = (props) => {
           <IconButton onClick={() => setOverlay('preferences')}>
             <PreferencesIcon focusable="false" aria-hidden="true" />
           </IconButton>
-          <IconButton onClick={() => setOverlay('runSketch')}>
-            <PlayIcon viewBox="-1 -1 7 7" focusable="false" aria-hidden="true" />
-          </IconButton>
+          <Link to="/mobile/preview">
+            <IconButton>
+              <PlayIcon viewBox="-1 -1 7 7" focusable="false" aria-hidden="true" />
+            </IconButton>
+          </Link>
         </div>
       </Header>
 

client/modules/Mobile/MobileSketchView.jsx

@@ -1,16 +1,24 @@
 import React, { useState } from 'react';
-
+import { Link } from 'react-router';
+import styled from 'styled-components';
 import Header from '../../components/mobile/Header';
 import Screen from '../../components/mobile/MobileScreen';
+import { ExitIcon } from '../../common/Icons';
+
+const IconLinkWrapper = styled(Link)`
+  width: 2rem;
+  margin-right: 1.25rem;
+  margin-left: none;
+`;
 
 const MobileSketchView = (props) => {
   const [overlay, setOverlay] = useState(null);
   return (
     <Screen>
       <Header>
-        {/* <IconLinkWrapper to="/mobile" aria-label="Return to original editor">
-        <CloseIcon viewBox="20 21 60 60" />
-      </IconLinkWrapper> */}
+        <IconLinkWrapper to="/mobile" aria-label="Return to original editor">
+          <ExitIcon viewBox="0 0 16 16" />
+        </IconLinkWrapper>
         <div>
           <h2>Hello</h2>
           {/* <h3>{selectedFile.name}</h3> */}