import React from 'react';
import MonacoEditor from 'react-monaco-editor';
import PropTypes from 'prop-types';

class TextEditor extends React.Component {
  language() {
    switch(this.props.file.name.split('.').pop()) {
      case 'css':
        return 'css';
      case 'sol':
        return 'sol';
      case 'html':
        return 'html';
      case 'json':
        return 'json';
      default:
        return 'javascript';
    }
  }

  extractRowCol(errorMessage) {
    const errorSplit = errorMessage.split(':');
    if (errorSplit.length >= 3) {
      return {row: parseInt(errorSplit[1], 10), col: parseInt(errorSplit[2], 10)};
    }
    return {row: 0, col: 0};
  }

  componentDidUpdate() {
    const {errors, warnings} = this.props.contractCompile;
    const markers = [].concat(errors).concat(warnings).filter((e) => e).map((e) => {
      const {row, col} = this.extractRowCol(e.formattedMessage);
      return {
        startLineNumber: row,
        startColumn: col,
        endLineNumber: row,
        endColumn: col + 1,
        message: e.formattedMessage,
        severity: e.severity
      };
    });
    this.state.monaco.editor.setModelMarkers(this.state.editor.getModel(), 'test', markers);
  }

  editorDidMount(editor, monaco) {
    this.setState({editor, monaco});
  }

  render() {
    return (
      <MonacoEditor
        width="800"
        height="600"
        language={this.language()}
        theme="vs-dark"
        value={this.props.file.content}
        onChange={this.props.onFileContentChange}
        editorDidMount={(editor, monaco) => this.editorDidMount(editor, monaco)}
      />
    );
  }
}

TextEditor.propTypes = {
  onFileContentChange: PropTypes.func,
  file: PropTypes.object,
  contractCompile: PropTypes.object
};

export default TextEditor;

@@ -105,16 +105,76 @@
 ypes';%0A%0A
+const supportedLanguages = %5B'css', 'sol', 'html', 'json'%5D;%0A%0A
 class Te
@@ -231,15 +231,26 @@
     
-switch(
+const extension = 
 this
@@ -286,205 +286,81 @@
 op()
-) %7B%0A      case 'css':%0A        return 'css';%0A      case 'sol':%0A        return 'sol';%0A      case 'html':%0A        return 'html';%0A      case 'json':%0A        return 'json';%0A      default:%0A        return
+;%0A    return supportedLanguages%5BsupportedLanguages.indexOf(extension)%5D %7C%7C
  'ja
@@ -370,22 +370,16 @@
 cript';%0A
-    %7D%0A
   %7D%0A%0A  e

Use supported languages