aboutsummaryrefslogtreecommitdiff
path: root/frontend/src/components/Editor.js
diff options
context:
space:
mode:
authorjackyzha0 <[email protected]>2021-03-05 16:53:52 -0800
committerjackyzha0 <[email protected]>2021-03-05 16:53:52 -0800
commit0c2d38a59f890afed6466658e1ad0341656137c8 (patch)
tree930fb412655daa5243e38f06b94757ce965a0892 /frontend/src/components/Editor.js
parentfix(typo): public api docs endpoint (diff)
downloadctrl-v-0c2d38a59f890afed6466658e1ad0341656137c8.tar.xz
ctrl-v-0c2d38a59f890afed6466658e1ad0341656137c8.zip
title refactor
Diffstat (limited to 'frontend/src/components/Editor.js')
-rw-r--r--frontend/src/components/Editor.js29
1 files changed, 29 insertions, 0 deletions
diff --git a/frontend/src/components/Editor.js b/frontend/src/components/Editor.js
new file mode 100644
index 0000000..83d8464
--- /dev/null
+++ b/frontend/src/components/Editor.js
@@ -0,0 +1,29 @@
+import React from 'react';
+import Editor from 'react-simple-code-editor';
+import { highlight, languages } from 'prismjs/components/prism-core';
+import 'prismjs/components/prism-clike';
+import 'prismjs/components/prism-javascript';
+
+const code = `function add(a, b) {
+ return a + b;
+}
+`;
+
+class App extends React.Component {
+ state = { code };
+
+ render() {
+ return (
+ <Editor
+ value={this.state.code}
+ onValueChange={code => this.setState({ code })}
+ highlight={code => highlight(code, languages.js)}
+ padding={10}
+ style={{
+ fontFamily: '"JetBrains Mono", monospace',
+ fontSize: 12,
+ }}
+ />
+ );
+ }
+} \ No newline at end of file