Fix joining live session (codesandbox#2608)

The sandbox transform was not called for a sandbox that was received from a live
session, this adds it

Author: CompuIves

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

@@ -23,6 +23,7 @@ import { client } from 'app/graphql/client';
 import { LIST_TEMPLATES } from 'app/pages/Dashboard/queries';
 
 import apiFactory, { Api, ApiConfig } from './apiFactory';
+import { transformSandbox } from '../utils/sandbox';
 
 let api: Api;
 
@@ -65,16 +66,7 @@ export default {
     const sandbox = await api.get<Sandbox>(`/sandboxes/${id}`);
 
     // We need to add client side properties for tracking
-    return {
-      ...sandbox,
-      modules: sandbox.modules.map(module => ({
-        ...module,
-        savedCode: null,
-        isNotSynced: false,
-        errors: [],
-        corrections: [],
-      })),
-    };
+    return transformSandbox(sandbox);
   },
   async forkSandbox(id: string, body?: unknown): Promise<Sandbox> {
     const url = id.includes('/')
@@ -83,16 +75,7 @@ export default {
 
     const sandbox = await api.post<Sandbox>(url, body || {});
 
-    return {
-      ...sandbox,
-      modules: sandbox.modules.map(module => ({
-        ...module,
-        savedCode: null,
-        isNotSynced: false,
-        errors: [],
-        corrections: [],
-      })),
-    };
+    return transformSandbox(sandbox);
   },
   createModule(sandboxId: string, module: Module): Promise<Module> {
     return api.post(`/sandboxes/${sandboxId}/modules`, {

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

@@ -12,6 +12,7 @@ import {
 } from '@codesandbox/common/lib/types';
 import { getTextOperation } from '@codesandbox/common/lib/utils/diff';
 import clientsFactory from './clients';
+import { transformSandbox } from '../utils/sandbox';
 
 type Options = {
   onApplyOperation(args: { moduleShortid: string; operation: any }): void;
@@ -107,9 +108,11 @@ export default {
     return new Promise((resolve, reject) => {
       channel
         .join()
-        .receive('ok', resp =>
-          resolve(camelizeKeys(resp) as JoinChannelResponse)
-        )
+        .receive('ok', resp => {
+          const result = camelizeKeys(resp) as JoinChannelResponse;
+          result.sandbox = transformSandbox(result.sandbox);
+          resolve(result);
+        })
         .receive('error', resp => reject(camelizeKeys(resp)));
     });
   },

packages/app/src/app/overmind/effects/utils/sandbox.ts

@@ -0,0 +1,13 @@
+export function transformSandbox(sandbox: Sandbox) {
+  // We need to add client side properties for tracking
+  return {
+    ...sandbox,
+    modules: sandbox.modules.map(module => ({
+      ...module,
+      savedCode: null,
+      isNotSynced: false,
+      errors: [],
+      corrections: [],
+    })),
+  };
+}