Extract common to a lib (codesandbox#1653)

Allows homepage and dynamic-pages to work standalone

Author: CompuIves

.yarnrc

@@ -1 +1 @@
-workspaces-experimental true
+

package.json

@@ -8,7 +8,7 @@
     "build:prod": "lerna run build  --scope homepage --stream && lerna run build --scope app --stream && gulp",
     "build:embed": "lerna run build:embed --scope app --stream && gulp",
     "build:clean": "lerna run build:clean --scope app --scope homepage && rimraf www",
-    "build:deps": "lerna run build:dev --scope codesandbox-api && lerna run build:dev --scope common && lerna run build:dev --scope vscode-textmate --scope codesandbox-browserfs --scope node-services && lerna run build:dev --scope sse-hooks",
+    "build:deps": "lerna run build:dev --scope codesandbox-api && lerna run build:dev --scope @codesandbox/common && lerna run build:dev --scope vscode-textmate --scope codesandbox-browserfs --scope node-services && lerna run build:dev --scope sse-hooks",
     "build:dynamic": "lerna run build --scope dynamic-pages --stream",
     "start": "yarn build:deps && lerna run start --scope app --stream",
     "start:fast": "lerna run start --scope app --stream",

packages/app/config/webpack.common.js

@@ -7,8 +7,8 @@ const CaseSensitivePathsPlugin = require('case-sensitive-paths-webpack-plugin');
 const CopyWebpackPlugin = require('copy-webpack-plugin');
 const HappyPack = require('happypack');
 const WatchMissingNodeModulesPlugin = require('../scripts/utils/WatchMissingNodeModulesPlugin');
-const env = require('common/lib/config/env');
-const getHost = require('common/lib/utils/host');
+const env = require('@codesandbox/common/lib/config/env');
+const getHost = require('@codesandbox/common/lib/utils/host');
 
 const babelDev = require('./babel.dev');
 const babelProd = require('./babel.prod');

packages/app/package.json

@@ -159,7 +159,7 @@
     "cerebral": "^4.0.0",
     "circular-json": "^0.4.0",
     "codemirror": "^5.27.4",
-    "codesandbox-api": "^0.0.20",
+    "codesandbox-api": "^0.0.22",
     "codesandbox-import-utils": "2.1.1",
     "color": "^0.11.4",
     "compare-versions": "^3.1.0",
@@ -247,7 +247,6 @@
     "sha1": "^1.1.1",
     "shelljs": "^0.7.8",
     "shortid": "^2.2.8",
-    "socket.io-client": "^2.1.1",
     "store": "^2.0.12",
     "string-replace-loader": "^2.1.1",
     "styled-components": "^4.1.2",

packages/app/src/app/components/Alert/index.js

@@ -1,6 +1,6 @@
 import React from 'react';
 
-import { Button } from 'common/lib/components/Button';
+import { Button } from '@codesandbox/common/lib/components/Button';
 import { Container, Title, Text, Buttons } from './elements';
 
 function Alert({ title, body, onCancel, onDelete }) {

packages/app/src/app/components/CodeEditor/CodeMirror/elements.js

@@ -1,5 +1,5 @@
 import styled, { css, keyframes } from 'styled-components';
-import theme from 'common/lib/theme';
+import theme from '@codesandbox/common/lib/theme';
 
 const fadeInAnimation = keyframes`
   0%   { background-color: #374140; }

packages/app/src/app/components/CodeEditor/CodeMirror/index.js

@@ -4,7 +4,7 @@ import * as React from 'react';
 import CodeMirror from 'codemirror';
 import { withTheme } from 'styled-components';
 
-import type { ModuleError, Module } from 'common/lib/types';
+import type { ModuleError, Module } from '@codesandbox/common/lib/types';
 import { getCodeMirror } from 'app/utils/codemirror';
 
 import 'codemirror/addon/dialog/dialog';

packages/app/src/app/components/CodeEditor/Configuration/index.tsx

@@ -1,11 +1,11 @@
 import React from 'react';
 import { TextOperation } from 'ot';
-import { Module } from 'common/lib/types';
-import getUI from 'common/lib/templates/configuration/ui';
+import { Module } from '@codesandbox/common/lib/types';
+import getUI from '@codesandbox/common/lib/templates/configuration/ui';
 import getType from 'app/utils/get-type';
 import EntryIcons from 'app/pages/Sandbox/Editor/Workspace/Files/DirectoryEntry/Entry/EntryIcons';
-import Tooltip from 'common/lib/components/Tooltip';
-import { ConfigurationFile } from 'common/lib/templates/configuration/types';
+import Tooltip from '@codesandbox/common/lib/components/Tooltip';
+import { ConfigurationFile } from '@codesandbox/common/lib/templates/configuration/types';
 
 import CodeIcon from 'react-icons/lib/md/code';
 

packages/app/src/app/components/CodeEditor/FilePath/elements.js

@@ -1,7 +1,7 @@
 import styled from 'styled-components';
 import ChevronLeft from 'react-icons/lib/md/chevron-left';
 import ExitZen from 'react-icons/lib/md/fullscreen-exit';
-import { withTooltip } from 'common/lib/components/Tooltip';
+import { withTooltip } from '@codesandbox/common/lib/components/Tooltip';
 
 export const Container = styled.div`
   background-color: rgba(0, 0, 0, 0.3);

packages/app/src/app/components/CodeEditor/FilePath/index.js

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { getModulePath } from 'common/lib/sandbox/modules';
+import { getModulePath } from '@codesandbox/common/lib/sandbox/modules';
 import EntryIcons from 'app/pages/Sandbox/Editor/Workspace/Files/DirectoryEntry/Entry/EntryIcons';
 import getType from 'app/utils/get-type';