From 5f0fe40c642edf97ef314162228a56ed94426b0d Mon Sep 17 00:00:00 2001
From: kangwei <bingbing.yb@alibaba-inc.com>
Date: Fri, 15 May 2020 16:08:20 +0800
Subject: [PATCH] fix device

---
 .../src/layouts/workbench.less                |  1 +
 .../src/renderer-view.tsx                     | 33 ++++++++++---------
 .../react-simulator-renderer/src/renderer.ts  |  4 ++-
 3 files changed, 21 insertions(+), 17 deletions(-)

diff --git a/packages/editor-skeleton/src/layouts/workbench.less b/packages/editor-skeleton/src/layouts/workbench.less
index fcc68c8c9..deec754a1 100644
--- a/packages/editor-skeleton/src/layouts/workbench.less
+++ b/packages/editor-skeleton/src/layouts/workbench.less
@@ -232,6 +232,7 @@ body {
       flex-shrink: 0;
       flex-direction: column;
       justify-content: space-between;
+      overflow: hidden;
       &.lc-area-visible {
         display: flex;
       }
diff --git a/packages/react-simulator-renderer/src/renderer-view.tsx b/packages/react-simulator-renderer/src/renderer-view.tsx
index b5c33a78e..c2f2e03ab 100644
--- a/packages/react-simulator-renderer/src/renderer-view.tsx
+++ b/packages/react-simulator-renderer/src/renderer-view.tsx
@@ -47,22 +47,23 @@ export default class SimulatorRendererView extends Component<{ renderer: Simulat
   }
 }
 
-function getDeviceView(view: any, device: string) {
-  if (!view || typeof view === 'string' || device === 'default') {
+function ucfirst(s: string) {
+  return s.charAt(0).toUpperCase() + s.substring(1);
+}
+function getDeviceView(view: any, device: string, mode: string) {
+  if (!view || typeof view === 'string') {
     return view;
   }
 
-  /*
-  const viewport = Viewport.getViewport();
-  if (viewport) {
-    if (view.hasOwnProperty(device)) {
-      view = view[device];
-    }
-
-    if (view.hasOwnProperty(mode)) {
-      view = view[mode];
-    }
-  }*/
+  // compatible vision Mobile | Preview
+  device = ucfirst(device);
+  if (device === 'Mobile' && view.hasOwnProperty(device)) {
+    view = view[device];
+  }
+  mode = ucfirst(mode);
+  if (mode === 'Preview' && view.hasOwnProperty(mode)) {
+    view = view[mode];
+  }
   return view;
 }
 
@@ -91,14 +92,14 @@ class Renderer extends Component<{ renderer: SimulatorRenderer }> {
   }
   render() {
     const { renderer } = this.props;
-    const device = renderer.designMode
+    const { device, designMode } = renderer;
     return (
       <LowCodeRenderer
         schema={renderer.schema}
         components={renderer.components}
         appHelper={renderer.context}
         // context={renderer.context}
-        designMode={renderer.designMode}
+        designMode={designMode}
         suspended={renderer.suspended}
         self={renderer.scope}
         customCreateElement={(Component: any, props: any, children: any) => {
@@ -107,7 +108,7 @@ class Renderer extends Component<{ renderer: SimulatorRenderer }> {
           viewProps._leaf = host.document.getNode(__id);
 
           return createElement(
-            getDeviceView(Component, device),
+            getDeviceView(Component, device, designMode),
             viewProps,
             children == null ? [] : Array.isArray(children) ? children : [children],
           );
diff --git a/packages/react-simulator-renderer/src/renderer.ts b/packages/react-simulator-renderer/src/renderer.ts
index dd3530d88..a5bee9da7 100644
--- a/packages/react-simulator-renderer/src/renderer.ts
+++ b/packages/react-simulator-renderer/src/renderer.ts
@@ -35,6 +35,7 @@ export class SimulatorRenderer implements BuiltinSimulatorRenderer {
       }
 
       // sync designMode
+      this._designMode = host.designMode;
 
       // sync suspended
 
@@ -84,8 +85,9 @@ export class SimulatorRenderer implements BuiltinSimulatorRenderer {
   @computed get context(): any {
     return this._appContext;
   }
+  @obx.ref private _designMode: string = 'design';
   @computed get designMode(): any {
-    return 'preview';
+    return this._designMode;
   }
   @obx.ref private _device: string = 'default';
   @computed get device() {