Merge branch 'master' into vscodeeffect

Author: christianalfoni

.all-contributorsrc

@@ -1440,6 +1440,15 @@
       "contributions": [
         "code"
       ]
+    },
+    {
+      "login": "22PoojaGaur",
+      "name": "Pooja Gaur",
+      "avatar_url": "https://avatars2.githubusercontent.com/u/43316760?v=4",
+      "profile": "https://github.com/22PoojaGaur",
+      "contributions": [
+        "code"
+      ]
     }
   ],
   "contributorsPerLine": 7,

README.md

@@ -240,12 +240,12 @@ Thanks goes to these wonderful people
     <td align="center"><a href="https://github.com/milap1296"><img src="https://avatars2.githubusercontent.com/u/19545730?v=4" width="100px;" alt="milap1296"/><br /><sub><b>milap1296</b></sub></a><br /><a href="https://github.com/codesandbox/codesandbox-client/commits?author=milap1296" title="Code">💻</a></td>
     <td align="center"><a href="http://yevhenorlov.com"><img src="https://avatars2.githubusercontent.com/u/17388747?v=4" width="100px;" alt="yevhen orlov"/><br /><sub><b>yevhen orlov</b></sub></a><br /><a href="https://github.com/codesandbox/codesandbox-client/commits?author=yevhenorlov" title="Code">💻</a></td>
     <td align="center"><a href="https://github.com/NileshPatel17"><img src="https://avatars2.githubusercontent.com/u/27020381?v=4" width="100px;" alt="Nilesh Patel"/><br /><sub><b>Nilesh Patel</b></sub></a><br /><a href="https://github.com/codesandbox/codesandbox-client/commits?author=NileshPatel17" title="Code">💻</a></td>
+    <td align="center"><a href="https://github.com/22PoojaGaur"><img src="https://avatars2.githubusercontent.com/u/43316760?v=4" width="100px;" alt="Pooja Gaur"/><br /><sub><b>Pooja Gaur</b></sub></a><br /><a href="https://github.com/codesandbox/codesandbox-client/commits?author=22PoojaGaur" title="Code">💻</a></td>
   </tr>
 </table>
 
 <!-- markdownlint-enable -->
 <!-- prettier-ignore-end -->
-
 <!-- ALL-CONTRIBUTORS-LIST:END -->
 
 ## Backers

packages/app/scripts/deploy.js

@@ -15,7 +15,10 @@ fetch('https://deployment-api.lbogdan.ro/image', {
 })
   .then(x => {
     if (!x.ok) {
-      throw new Error('Request failed');
+      return x.json().then(res => {
+        console.error(res);
+        throw new Error('Request failed');
+      });
     }
 
     return x.json();

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

@@ -946,9 +946,7 @@ class MonacoEditor extends React.Component<Props, State> implements Editor {
       ),
       options: {
         inlineClassName: classification.type
-          ? `${classification.kind} ${classification.type}-of-${
-              classification.parentKind
-            }`
+          ? `${classification.kind} ${classification.type}-of-${classification.parentKind}`
           : classification.kind,
       },
     }));

packages/app/src/app/overmind/actions.ts

@@ -76,7 +76,8 @@ type ModalName =
   | 'preferences'
   | 'share'
   | 'searchDependencies'
-  | 'signInForTemplates';
+  | 'signInForTemplates'
+  | 'userSurvey';
 export const modalOpened: Action<{ modal: ModalName; message?: string }> = (
   { state, effects },
   { modal, message }

packages/app/src/app/overmind/effects/api/index.ts

@@ -68,6 +68,9 @@ export default {
   getCurrentUser(): Promise<CurrentUser> {
     return api.get('/users/current');
   },
+  markSurveySeen(): Promise<void> {
+    return api.post('/users/survey-seen', {});
+  },
   getDependency(name: string): Promise<Dependency> {
     return api.get(`/dependencies/${name}@latest`);
   },

packages/app/src/app/overmind/factories.ts

@@ -30,6 +30,7 @@ export const withLoadApp = <T>(
       state.user = await effects.api.getCurrentUser();
       actions.internal.setPatronPrice();
       actions.internal.setSignedInCookie();
+      actions.internal.showUserSurveyIfNeeded();
       effects.live.connect();
       actions.userNotifications.internal.initialize();
       effects.api.preloadTemplates();
@@ -112,7 +113,7 @@ export const createModals = <
   state?: {
     current: keyof T;
   } & {
-    [K in keyof T]: T[K]['state'] & { isCurrent: IDerive<any, any, boolean> }
+    [K in keyof T]: T[K]['state'] & { isCurrent: IDerive<any, any, boolean> };
   };
   actions?: {
     [K in keyof T]: {
@@ -121,7 +122,7 @@ export const createModals = <
         T[K]['result']
       >;
       close: AsyncAction<T[K]['result']>;
-    }
+    };
   };
 } => {
   function createModal(name, modal) {

packages/app/src/app/overmind/internalActions.ts

@@ -9,6 +9,7 @@ import {
 } from '@codesandbox/common/lib/types';
 import { identify, setUserId } from '@codesandbox/common/lib/utils/analytics';
 
+import { NotificationStatus } from '@codesandbox/notifications';
 import { createOptimisticModule } from './utils/common';
 import getItems from './utils/items';
 import { defaultOpenedModule, mainModule } from './utils/main-module';
@@ -68,6 +69,33 @@ export const setSignedInCookie: Action = ({ state }) => {
   setUserId(state.user.id);
 };
 
+export const showUserSurveyIfNeeded: Action = ({ state, effects, actions }) => {
+  if (state.user.sendSurvey) {
+    // Let the server know that we've seen the survey
+    effects.api.markSurveySeen();
+
+    effects.notificationToast.add({
+      title: 'Help improve CodeSandbox',
+      message:
+        "We'd love to hear your thoughts, it's 7 questions and will only take 2 minutes.",
+      status: NotificationStatus.NOTICE,
+      sticky: true,
+      actions: {
+        primary: [
+          {
+            label: 'Open Survey',
+            run: () => {
+              actions.modalOpened({
+                modal: 'userSurvey',
+              });
+            },
+          },
+        ],
+      },
+    });
+  }
+};
+
 export const addNotification: Action<{
   title: string;
   type: 'notice' | 'success' | 'warning' | 'error';

packages/app/src/app/pages/Dashboard/Sidebar/SandboxesItem/FolderEntry/index.tsx

@@ -7,6 +7,8 @@ import TrashIcon from 'react-icons/lib/md/delete';
 import { Mutation } from 'react-apollo';
 import { DropTarget, DragSource } from 'react-dnd';
 import track from '@codesandbox/common/lib/utils/analytics';
+import { withRouter } from 'react-router-dom';
+import { History } from 'history';
 import { client } from 'app/graphql/client';
 
 import { Animate as ReactShow } from 'react-show';
@@ -60,6 +62,8 @@ type Props = {
   isDragging?: boolean;
   connectDropTarget?: any;
   connectDragSource?: any;
+
+  history?: History;
 };
 
 type State = {
@@ -138,6 +142,7 @@ class FolderEntry extends React.Component<Props, State> {
       onSelect,
       currentPath,
       currentTeamId,
+      history,
     } = this.props;
 
     const children = getDirectChildren(path, folders);
@@ -283,6 +288,14 @@ class FolderEntry extends React.Component<Props, State> {
                             },
                             variables,
                           });
+                          const modifiedPath = path
+                            .split('/')
+                            .slice(0, -1)
+                            .join('/');
+
+                          history.replace(
+                            `${basePath}${modifiedPath}/${input.value}`
+                          );
                         },
                       });
 
@@ -392,8 +405,11 @@ const collectSource = (connect, monitor) => ({
   isDragging: monitor.isDragging(),
 });
 
-DropFolderEntry = DropTarget(['SANDBOX', 'FOLDER'], entryTarget, collectTarget)(
-  DragSource('FOLDER', entrySource, collectSource)(FolderEntry)
-) as any;
+DropFolderEntry = (withRouter(
+  // @ts-ignore Don't know how to mix dnd and react-router with right typings
+  DropTarget(['SANDBOX', 'FOLDER'], entryTarget, collectTarget)(
+    DragSource('FOLDER', entrySource, collectSource)(FolderEntry)
+  )
+) as unknown) as React.ComponentClass<Props, State>;
 
 export { DropFolderEntry };

packages/app/src/app/pages/Profile/Showcase/SandboxInfo/index.js

@@ -13,12 +13,13 @@ import {
   PlayButtonContainer,
 } from './elements';
 
-function SandboxInfo({ sandbox }) {
+function SandboxInfo({ sandbox, isLoggedIn }) {
   return (
     <Container>
       <Row alignItems="center">
         <Title>
-          {getSandboxName(sandbox)} <Like sandbox={sandbox} />
+          {getSandboxName(sandbox)}{' '}
+          {isLoggedIn ? <Like sandbox={sandbox} /> : null}
         </Title>
       </Row>
       <Row alignItems="flex-start">