Merge branch 'dashboard' of github.com:Coding/WebIDE-Frontend into dashboard

Author: veedrin

.babelrc

@@ -12,6 +12,7 @@
       "moduleName": "@babel/runtime"
     }],
     "@babel/plugin-syntax-export-default-from",
+    "@babel/plugin-syntax-dynamic-import",
     ["@babel/plugin-proposal-decorators", { "legacy": true }],
     ["@babel/plugin-proposal-class-properties", { "loose": true }]
   ],

app/components/Editor/components/EditorWidgets/ModeWidget.jsx

@@ -1,6 +1,6 @@
 import React, { Component } from 'react'
 import { observer } from 'mobx-react'
-import * as monaco from 'monaco-editor'
+ 
 import config from 'config'
 import cx from 'classnames'
 import modeInfos from 'components/Editor/components/CodeEditor/addons/mode/modeInfos'

app/components/MonacoEditor/MonacoReact/BaseDiffEditor.js

@@ -1,6 +1,6 @@
 import React, { PureComponent } from 'react'
 import PropTypes from 'prop-types'
-import * as monaco from 'monaco-editor'
+ 
 
 import initialOptions from '../monacoDefaultOptions'
 import { findLanguageByextensions } from '../utils/findLanguage'

app/components/MonacoEditor/MonacoReact/BaseEditor.jsx

@@ -13,9 +13,30 @@ import { findLangueByExt } from '../utils/findLanguage'
 import { EditorInfo } from '../state'
 import initialOptions from '../monacoDefaultOptions'
 import registerCustomLanguages from '../languages'
+import { liftOff } from './grammars/configure-tokenizer'
+import { getTheme, getBase } from '../../../extensions/Editor.ext'
+
+import themes from '../themes'
+
+themes.forEach((themeConfig) => {
+  const { name, theme } = themeConfig
+  const transformedTheme = getTheme(theme)
+  const { colors, rules, type } = transformedTheme
+  monaco.editor.defineTheme(name, {
+    base: getBase(type),
+    inherit: true,
+    colors,
+    rules
+  })
+})
+
+// import 'monaco.languages.css'
+// import '../languageServices/css/monaco.contribution'
 
 registerCustomLanguages()
 
+liftOff(monaco)
+
 function noop () {}
 
 const Div = measure('div')

app/components/MonacoEditor/MonacoReact/grammars/configure-tokenizer.js

@@ -0,0 +1,32 @@
+import { loadWASM } from 'onigasm' // peer dependency of 'monaco-textmate'
+import LanguageRegistry from './monaco-textmate-languages'
+import { wireTmGrammars } from './set-grammars'
+
+import languages from './languages'
+
+const grammars = new Map()
+
+languages.forEach((language) => {
+  grammars.set(language.id.toString(), language.scopeName.toString())
+})
+
+let wasmLoaded = false
+
+export async function liftOff (monaco) {
+  if (!wasmLoaded) {
+    // eslint-disable-next-line global-require
+    await loadWASM(require('onigasm/lib/onigasm.wasm')) // See https://www.npmjs.com/package/onigasm#light-it-up
+    wasmLoaded = true
+  } else {
+    return
+  }
+  const registry = new LanguageRegistry({
+    basePath: 'grammarsDefinition',
+    jsonFetcher: async (uri) => {
+      const relativeUri = uri.replace('/grammars', '')
+      const result = require(`./${relativeUri}`)
+      return JSON.stringify(result)
+    },
+  })
+  await wireTmGrammars(monaco, registry, grammars)
+}

app/components/MonacoEditor/MonacoReact/grammars/grammarsDefinition/applescript/applescript.json

@@ -0,0 +1,7 @@
+{
+  "id": "applescript",
+  "extensions": [".scpt"],
+  "aliases": ["AppleScript", "applescript"],
+  "mimeType": ["application/applescript"],
+  "scopeName": "source.applescript"
+}