From 2a063a43535947fc1fa43500d94109a80d81c217 Mon Sep 17 00:00:00 2001
From: Maksym Bykovskyy <maksym@bykovskyy.com>
Date: Thu, 13 Feb 2020 17:18:23 -0800
Subject: [PATCH] Added JSON output to compile command

---
 .../webide/packages/client/public/index.html  |  1 -
 .../client/src/components/compile-pane.tsx    | 26 ++++++++++++++--
 .../client/src/redux/actions/compile.ts       |  3 +-
 .../packages/client/src/redux/compile.ts      | 25 +++++++++++++---
 .../webide/packages/client/src/redux/share.ts |  8 +++--
 .../packages/client/src/services/api.ts       | 16 ++++++++--
 .../server/src/handlers/shared-link.ts        |  4 +--
 tools/webide/packages/server/src/index.ts     |  6 ++--
 .../webide/packages/server/src/load-state.ts  | 30 +++++++++++++++----
 .../packages/server/src/schemas/migration.ts  |  4 ++-
 10 files changed, 98 insertions(+), 25 deletions(-)

diff --git a/tools/webide/packages/client/public/index.html b/tools/webide/packages/client/public/index.html
index 1ac8ec87b..ef36e557c 100644
--- a/tools/webide/packages/client/public/index.html
+++ b/tools/webide/packages/client/public/index.html
@@ -6,7 +6,6 @@
     <meta name="viewport" content="width=device-width, initial-scale=1" />
     <meta name="theme-color" content="#000000" />
     <meta name="description" content="The LIGO Playground for learning LIGO" />
-    <link rel="apple-touch-icon" href="logo192.png" />
     <!--
       manifest.json provides metadata used when your web app is installed on a
       user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
diff --git a/tools/webide/packages/client/src/components/compile-pane.tsx b/tools/webide/packages/client/src/components/compile-pane.tsx
index cd938c0b3..31d05fd01 100644
--- a/tools/webide/packages/client/src/components/compile-pane.tsx
+++ b/tools/webide/packages/client/src/components/compile-pane.tsx
@@ -3,16 +3,25 @@ import { useDispatch, useSelector } from 'react-redux';
 import styled from 'styled-components';
 
 import { AppState } from '../redux/app';
-import { ChangeEntrypointAction, CompileState } from '../redux/compile';
-import { Group, Input, Label } from './inputs';
+import { ChangeEntrypointAction, ChangeMichelsonFormatAction, CompileState, MichelsonFormat } from '../redux/compile';
+import { CheckboxComponent } from './checkbox';
+import { Group, HGroup, Input, Label } from './inputs';
 
 const Container = styled.div``;
 
+const Checkbox = styled(CheckboxComponent)`
+  margin-right: 0.3em;
+`;
+
 export const CompilePaneComponent = () => {
   const dispatch = useDispatch();
   const entrypoint = useSelector<AppState, CompileState['entrypoint']>(
     state => state.compile.entrypoint
   );
+  const michelsonFormat = useSelector<
+    AppState,
+    CompileState['michelsonFormat']
+  >(state => state.compile.michelsonFormat);
 
   return (
     <Container>
@@ -26,6 +35,19 @@ export const CompilePaneComponent = () => {
           }
         ></Input>
       </Group>
+      <HGroup>
+        <Checkbox
+          checked={michelsonFormat === MichelsonFormat.Json}
+          onChanged={value =>
+            dispatch({
+              ...new ChangeMichelsonFormatAction(
+                value ? MichelsonFormat.Json : MichelsonFormat.Text
+              )
+            })
+          }
+        ></Checkbox>
+        <Label htmlFor="michelsonFormat">Output michelson in JSON format</Label>
+      </HGroup>
     </Container>
   );
 };
diff --git a/tools/webide/packages/client/src/redux/actions/compile.ts b/tools/webide/packages/client/src/redux/actions/compile.ts
index 33566d6fc..2c3f21a29 100644
--- a/tools/webide/packages/client/src/redux/actions/compile.ts
+++ b/tools/webide/packages/client/src/redux/actions/compile.ts
@@ -16,7 +16,8 @@ export class CompileAction extends CancellableAction {
         const michelsonCode = await compileContract(
           editor.language,
           editor.code,
-          compileState.entrypoint
+          compileState.entrypoint,
+          compileState.michelsonFormat
         );
 
         if (this.isCancelled()) {
diff --git a/tools/webide/packages/client/src/redux/compile.ts b/tools/webide/packages/client/src/redux/compile.ts
index 2c4564362..732cc5bf8 100644
--- a/tools/webide/packages/client/src/redux/compile.ts
+++ b/tools/webide/packages/client/src/redux/compile.ts
@@ -6,11 +6,13 @@ export enum MichelsonFormat {
 }
 
 export enum ActionType {
-  ChangeEntrypoint = 'compile-change-entrypoint'
+  ChangeEntrypoint = 'compile-change-entrypoint',
+  ChangeMichelsonFormat = 'compile-change-michelson-format'
 }
 
 export interface CompileState {
   entrypoint: string;
+  michelsonFormat: MichelsonFormat;
 }
 
 export class ChangeEntrypointAction {
@@ -18,10 +20,19 @@ export class ChangeEntrypointAction {
   constructor(public payload: CompileState['entrypoint']) {}
 }
 
-type Action = ChangeEntrypointAction | ChangeSelectedExampleAction;
+export class ChangeMichelsonFormatAction {
+  public readonly type = ActionType.ChangeMichelsonFormat;
+  constructor(public payload: CompileState['michelsonFormat']) {}
+}
+
+type Action =
+  | ChangeEntrypointAction
+  | ChangeMichelsonFormatAction
+  | ChangeSelectedExampleAction;
 
 const DEFAULT_STATE: CompileState = {
-  entrypoint: ''
+  entrypoint: '',
+  michelsonFormat: MichelsonFormat.Text
 };
 
 export default (state = DEFAULT_STATE, action: Action): CompileState => {
@@ -36,6 +47,12 @@ export default (state = DEFAULT_STATE, action: Action): CompileState => {
         ...state,
         entrypoint: action.payload
       };
+    case ActionType.ChangeMichelsonFormat:
+      return {
+        ...state,
+        michelsonFormat: action.payload
+      };
+    default:
+      return state;
   }
-  return state;
 };
diff --git a/tools/webide/packages/client/src/redux/share.ts b/tools/webide/packages/client/src/redux/share.ts
index 103601add..5c807e48c 100644
--- a/tools/webide/packages/client/src/redux/share.ts
+++ b/tools/webide/packages/client/src/redux/share.ts
@@ -1,4 +1,8 @@
-import { ActionType as CompileActionType, ChangeEntrypointAction as ChangeCompileEntrypointAction } from './compile';
+import {
+  ActionType as CompileActionType,
+  ChangeEntrypointAction as ChangeCompileEntrypointAction,
+  ChangeMichelsonFormatAction,
+} from './compile';
 import {
   ActionType as DeployActionType,
   ChangeEntrypointAction as ChangeDeployEntrypointAction,
@@ -40,6 +44,7 @@ type Action =
   | ChangeCodeAction
   | ChangeLanguageAction
   | ChangeCompileEntrypointAction
+  | ChangeMichelsonFormatAction
   | ChangeDeployEntrypointAction
   | ChangeDeployStorageAction
   | UseTezBridgeAction
@@ -61,7 +66,6 @@ export default (state = DEFAULT_STATE, action: Action): ShareState => {
     case CompileActionType.ChangeEntrypoint:
     case DeployActionType.ChangeEntrypoint:
     case DeployActionType.ChangeStorage:
-    case DeployActionType.UseTezBridge:
     case DryRunActionType.ChangeEntrypoint:
     case DryRunActionType.ChangeParameters:
     case DryRunActionType.ChangeStorage:
diff --git a/tools/webide/packages/client/src/services/api.ts b/tools/webide/packages/client/src/services/api.ts
index ba197802b..14d89b391 100644
--- a/tools/webide/packages/client/src/services/api.ts
+++ b/tools/webide/packages/client/src/services/api.ts
@@ -30,7 +30,7 @@ export async function compileExpression(
 ) {
   const response = await axios.post('/api/compile-expression', {
     syntax,
-    expression,
+    expression: `${expression}`,
     format
   });
   return response.data;
@@ -64,14 +64,24 @@ export async function share({
   evaluateValue,
   evaluateFunction
 }: Partial<AppState>) {
-  const response = await axios.post('/api/share', {
+  const params = {
     editor,
     compile,
     dryRun,
     deploy,
     evaluateValue,
     evaluateFunction
-  });
+  };
+
+  // We don't want to store the following configuration
+  if (params.compile) {
+    delete params.compile.michelsonFormat;
+  }
+  if (params.deploy) {
+    delete params.deploy.useTezBridge;
+  }
+
+  const response = await axios.post('/api/share', params);
   return response.data;
 }
 
diff --git a/tools/webide/packages/server/src/handlers/shared-link.ts b/tools/webide/packages/server/src/handlers/shared-link.ts
index c66e7cece..5eca09844 100644
--- a/tools/webide/packages/server/src/handlers/shared-link.ts
+++ b/tools/webide/packages/server/src/handlers/shared-link.ts
@@ -1,12 +1,12 @@
 import { Request, Response } from 'express';
 
 import { loadDefaultState } from '../load-state';
+import { logger } from '../logger';
 import latestSchema from '../schemas/share-latest';
 import { storage } from '../storage';
 import { FileNotFoundError } from '../storage/interface';
-import { logger } from '../logger';
 
-export function createSharedLinkHandler(
+export function sharedLinkHandler(
   appBundleDirectory: string,
   template: (state: string) => string
 ) {
diff --git a/tools/webide/packages/server/src/index.ts b/tools/webide/packages/server/src/index.ts
index 71f4ec49a..642ec46f0 100644
--- a/tools/webide/packages/server/src/index.ts
+++ b/tools/webide/packages/server/src/index.ts
@@ -9,9 +9,9 @@ import { dryRunHandler } from './handlers/dry-run';
 import { evaluateValueHandler } from './handlers/evaluate-value';
 import { runFunctionHandler } from './handlers/run-function';
 import { shareHandler } from './handlers/share';
-import { createSharedLinkHandler } from './handlers/shared-link';
+import { sharedLinkHandler } from './handlers/shared-link';
 import { loadDefaultState } from './load-state';
-import { loggerMiddleware, errorLoggerMiddleware } from './logger';
+import { errorLoggerMiddleware, loggerMiddleware } from './logger';
 
 var bodyParser = require('body-parser');
 var escape = require('escape-html');
@@ -47,7 +47,7 @@ app.use('^/$', async (_, res) =>
 app.use(express.static(appBundleDirectory));
 app.get(
   `/p/:hash([0-9a-zA-Z\-\_]+)`,
-  createSharedLinkHandler(appBundleDirectory, template)
+  sharedLinkHandler(appBundleDirectory, template)
 );
 app.post('/api/compile-contract', compileContractHandler);
 app.post('/api/compile-expression', compileExpressionHandler);
diff --git a/tools/webide/packages/server/src/load-state.ts b/tools/webide/packages/server/src/load-state.ts
index bce15c277..2b71128d1 100644
--- a/tools/webide/packages/server/src/load-state.ts
+++ b/tools/webide/packages/server/src/load-state.ts
@@ -37,12 +37,30 @@ export async function loadDefaultState(appBundleDirectory: string) {
     );
     const defaultExample = JSON.parse(example);
 
-    defaultState.compile = defaultExample.compile;
-    defaultState.dryRun = defaultExample.dryRun;
-    defaultState.deploy = defaultExample.deploy;
-    defaultState.evaluateValue = defaultExample.evaluateValue;
-    defaultState.evaluateFunction = defaultExample.evaluateFunction;
-    defaultState.editor = defaultExample.editor;
+    defaultState.compile = {
+      ...defaultState.compile,
+      ...defaultExample.compile
+    };
+    defaultState.dryRun = {
+      ...defaultState.dryRun,
+      ...defaultExample.dryRun
+    };
+    defaultState.deploy = {
+      ...defaultState.deploy,
+      ...defaultExample.deploy
+    };
+    defaultState.evaluateValue = {
+      ...defaultState.evaluateValue,
+      ...defaultExample.evaluateValue
+    };
+    defaultState.evaluateFunction = {
+      ...defaultState.evaluateFunction,
+      ...defaultExample.evaluateFunction
+    };
+    defaultState.editor = {
+      ...defaultState.editor,
+      ...defaultExample.editor
+    };
     defaultState.examples.selected = defaultExample;
   }
 
diff --git a/tools/webide/packages/server/src/schemas/migration.ts b/tools/webide/packages/server/src/schemas/migration.ts
index 06bdc150c..6f6752ad9 100644
--- a/tools/webide/packages/server/src/schemas/migration.ts
+++ b/tools/webide/packages/server/src/schemas/migration.ts
@@ -18,7 +18,9 @@ export abstract class Migration {
       }
 
       throw new Error(
-        `Unable to migrate ${data}. Reached the end of the migration chain.`
+        `Unable to migrate ${JSON.stringify(
+          data
+        )}. Reached the end of the migration chain.`
       );
     }
     return value;