Przeglądaj źródła

resolved merge conflicts

jusrhee 5 lat temu
rodzic
commit
75504e6b55
2 zmienionych plików z 77 dodań i 0 usunięć
  1. 74 0
      dashboard/src/lib/YamlEditor.jsx
  2. 3 0
      dashboard/src/main/Login.tsx

+ 74 - 0
dashboard/src/lib/YamlEditor.jsx

@@ -0,0 +1,74 @@
+import React from 'react';
+import styled from 'styled-components';
+import AceEditor from 'react-ace';
+
+import 'ace-builds/src-noconflict/mode-yaml';
+import 'ace-builds/src-noconflict/theme-monokai';
+
+class YamlEditor extends React.Component {
+  constructor(props) {
+    super(props);
+    this.state = {
+      yaml: ``,
+    }
+    this.handleChange = this.handleChange.bind(this);
+    this.handleSubmit = this.handleSubmit.bind(this);
+  }
+
+  // Uses the yaml-lint library to determine if a given string is valid yaml.
+  // If the code is invalid, it returns an error message detailing what went wrong.
+  checkYaml = (y) => {
+    /*
+    yamlLint.lint(y).then(() => {
+      alert('Valid YAML file.');
+    }).catch((error) => {
+      alert(error.message);
+    });
+    */
+  }
+
+  // Calls checkYaml and passes in the value from the textarea
+  handleChange = (e) => {
+    this.setState({ yaml: e });
+  }
+  handleSubmit = (e) => {
+    this.checkYaml(this.state.yaml);
+    e.preventDefault();
+  }
+
+  render() {
+    return (
+      <Holder>
+        <Editor onSubmit={this.handleSubmit}>
+          <AceEditor
+            mode='yaml'
+            theme='monokai'
+            onChange={this.handleChange}
+            name='codeEditor'
+            editorProps={{ $blockScrolling: true }}
+            width='100%'
+            defaultValue={`# If you are using certificate files, include those explicitly`}
+            style={{ 
+              borderRadius: '5px',
+            }}
+          />
+        </Editor>
+      </Holder>
+    );
+  }
+}
+
+export default YamlEditor;
+
+const Editor = styled.form`
+  margin-top: 0px;
+  margin-bottom: 12px;
+  width: calc(100% - 0px);
+  border-radius: 5px;
+  border: 1px solid #ffffff22;
+  height: 295px;
+  overflow: auto;
+`;
+
+const Holder = styled.div`
+`;

+ 3 - 0
dashboard/src/main/Login.tsx

@@ -74,7 +74,10 @@ const Prompt = styled.div`
 const Logo = styled.img`
   width: 150px;
   margin-top: 63px;
+<<<<<<< HEAD
   user-select: none;
+=======
+>>>>>>> 00bdb9028faac5bb0c17eabe2b90abe0400be933
 `;
 
 const FormWrapper = styled.div`