Fix/remounting (codesandbox#577)

* Enable our old emmet mechanism as well

* Find culprit of full remount on work

* Fix remounting routes

* Clean up diff

* Fix route changes

* Fix loading other sandboxes

* Move load statement

Author: CompuIves

package.json

@@ -7,7 +7,8 @@
     "build": "yarn build:dependents && yarn build:prod",
     "build:prod": "lerna run build --scope app --scope homepage --parallel && gulp",
     "build:dependents": "lerna run build --ignore app --ignore homepage --parallel",
-    "start": "lerna run start --parallel",
+    "start": "lerna run build --scope codesandbox-browserfs --stream && lerna run start --parallel",
+    "start:fast": "lerna run start --scope app --stream",
     "start:test": "lerna run start:test --scope app --stream",
     "start:dev_api": "lerna run start --parallel --ignore app & lerna run start:dev_api --scope app --stream",
     "test": "lerna run test --ignore codesandbox-browserfs",

packages/app/config/webpack.common.js

@@ -25,9 +25,7 @@ const ESLINT_PLUGIN_VUE_INDEX = `module.exports = {
     .filter(filename => path.extname(filename) === '.js')
     .map(filename => {
       const ruleId = path.basename(filename, '.js');
-      return `        "${ruleId}": require("eslint-plugin-vue/lib/rules/${
-        filename
-      }"),`;
+      return `        "${ruleId}": require("eslint-plugin-vue/lib/rules/${filename}"),`;
     })
     .join('\n')}
   },
@@ -147,6 +145,15 @@ module.exports = {
           flags: 'g',
         },
       },
+      // Remove dynamic require in jest circus
+      {
+        test: /format_node_assert_errors\.js/,
+        loader: 'string-replace-loader',
+        options: {
+          search: `assert = require.call(null, 'assert');`,
+          replace: `throw new Error('module assert not found')`,
+        },
+      },
       // JSON is not enabled by default in Webpack but both Node and Browserify
       // allow it implicitly so we also enable it.
       {

packages/app/src/app/pages/Sandbox/Editor/Workspace/Project/index.js

@@ -220,7 +220,7 @@ class Project extends React.Component {
             <PropertyName>Forked From</PropertyName>
             <PropertyValue>
               <ConfirmLink
-                enabled={store.editor.isAllModulesSynced}
+                enabled={!store.editor.isAllModulesSynced}
                 message="You have unsaved changes. Are you sure you want to navigate away?"
                 to={sandboxUrl(sandbox.forkedFromSandbox)}
               >

packages/app/src/app/pages/index.js

@@ -2,7 +2,7 @@
 import * as React from 'react';
 import { inject, observer } from 'mobx-react';
 import Loadable from 'react-loadable';
-import { Route, Switch, Redirect, withRouter } from 'react-router-dom';
+import { Route, Switch, Redirect } from 'react-router-dom';
 
 import _debug from 'app/utils/debug';
 import Notifications from 'app/pages/common/Notifications';
@@ -68,6 +68,12 @@ class Routes extends React.Component<Props> {
     this.props.signals.appUnmounted();
   }
 
+  shouldComponentUpdate() {
+    // Without this the app won't update on route changes, we've tried using
+    // `withRouter`, but it caused the app to remount on every route change.
+    return true;
+  }
+
   render() {
     return (
       <Container>
@@ -110,4 +116,4 @@ class Routes extends React.Component<Props> {
   }
 }
 
-export default inject('signals', 'store')(withRouter(observer(Routes)));
+export default inject('signals', 'store')(observer(Routes));