diff --git a/frontend/src/blocks/alert.css b/frontend/src/blocks/alert.css
new file mode 100644
index 0000000..524e196
--- /dev/null
+++ b/frontend/src/blocks/alert.css
@@ -0,0 +1,9 @@
+.alert {
+ overflow: auto;
+ margin: 0 0 20px 0;
+ color: #fff;
+ border-radius: 4px;
+ padding: 10px;
+}
+
+.alert.error { background-color: #f55; }
diff --git a/frontend/src/blocks/alert.js b/frontend/src/blocks/alert.js
new file mode 100644
index 0000000..6a81160
--- /dev/null
+++ b/frontend/src/blocks/alert.js
@@ -0,0 +1,14 @@
+import React, { Component } from 'react';
+
+import './alert.css';
+
+export default class Alert extends Component {
+ render() {
+ if (!this.props.message) {
+ return null
+ }
+ return (
+
{this.props.message}
+ )
+ }
+}
diff --git a/frontend/src/pages/command.css b/frontend/src/pages/command.css
index 97636cf..1aa64ab 100644
--- a/frontend/src/pages/command.css
+++ b/frontend/src/pages/command.css
@@ -75,12 +75,3 @@ a.history {
text-align: center;
border-radius: 4px;
}
-
-.error {
- overflow: auto;
- margin: 0 0 20px 0;
- background-color: #f55;
- color: #fff;
- border-radius: 4px;
- padding: 10px;
-}
diff --git a/frontend/src/pages/command.js b/frontend/src/pages/command.js
index aba5e50..9431216 100644
--- a/frontend/src/pages/command.js
+++ b/frontend/src/pages/command.js
@@ -3,6 +3,7 @@ import { Link } from 'react-router-dom'
import Nav from '../blocks/nav.js'
import Output from '../blocks/output.js'
+import Alert from '../blocks/alert.js'
import { api, httpPOST } from '../http.js'
import './command.css'
@@ -43,7 +44,7 @@ export default class Command extends Component {
query={this.props.query} onQueryChange={this.props.onQueryChange} />
{this.renderForm()}
- {this.renderError()}
+
@@ -110,15 +111,6 @@ export default class Command extends Component {
}
}
- renderError() {
- if (this.state.error === null) {
- return null
- }
- return (
- {this.state.error}
- )
- }
-
submitHandler(event) {
event.preventDefault()
httpPOST(api("/exec"), formQuery(this.state.form),