diff --git a/frontend/src/blocks/alert.js b/frontend/src/blocks/alert.js
index 6a81160..23320bb 100644
--- a/frontend/src/blocks/alert.js
+++ b/frontend/src/blocks/alert.js
@@ -1,5 +1,4 @@
import React, { Component } from 'react';
-
import './alert.css';
export default class Alert extends Component {
diff --git a/frontend/src/blocks/header.js b/frontend/src/blocks/header.js
index 1326051..3b6a35c 100644
--- a/frontend/src/blocks/header.js
+++ b/frontend/src/blocks/header.js
@@ -1,21 +1,19 @@
-import React, { Component } from 'react';
+import React, { Component } from 'react'
+import './header.css'
-import './header.css';
-
-class Header extends Component {
+export default class Header extends Component {
render() {
+ let user = this.props.user
return (
go-apicommands
-
{this.props.user.name}
-
+
{user.name}
+
- );
+ )
}
}
-
-export default Header;
diff --git a/frontend/src/blocks/job_list.js b/frontend/src/blocks/job_list.js
index d4cb412..196d618 100644
--- a/frontend/src/blocks/job_list.js
+++ b/frontend/src/blocks/job_list.js
@@ -1,13 +1,13 @@
-import React, { Component } from 'react';
-import { Link } from 'react-router-dom';
+import React, { Component } from 'react'
+import { Link } from 'react-router-dom'
-import Timestamp from './timestamp.js';
-import './job_list.css';
+import Timestamp from './timestamp.js'
+import './job_list.css'
export default class JobList extends Component {
render() {
if (this.props.jobs === undefined) {
- return null;
+ return null
}
return (
@@ -26,7 +26,7 @@ export default class JobList extends Component {
}
renderJob(job) {
- let shortID = job.id.substring(0, 8);
+ let shortID = job.id.substring(0, 8)
return (
@@ -36,7 +36,7 @@ export default class JobList extends Component {
- );
+ )
}
}
diff --git a/frontend/src/blocks/nav.js b/frontend/src/blocks/nav.js
index 951e211..026904e 100644
--- a/frontend/src/blocks/nav.js
+++ b/frontend/src/blocks/nav.js
@@ -1,40 +1,37 @@
-import React, { Component } from 'react';
-import { Link } from 'react-router-dom';
+import React, { Component } from 'react'
+import { Link } from 'react-router-dom'
-import './nav.css';
+import './nav.css'
export default class Nav extends Component {
constructor(props) {
- super(props);
- this.state = {
- query: "",
- };
+ super(props)
+ this.state = {query: ""}
}
+
render() {
return (
- );
+ )
+ }
+
+ renderItem(name) {
+ let cmd = this.props.commands[name]
+ if (cmd.name.indexOf(this.props.query) === -1) {
+ return null
+ }
+
+ let className = this.props.active && cmd.name === this.props.active ? "active" : ""
+ return (
+
+ {cmd.name}
+
+ )
}
}
diff --git a/frontend/src/blocks/output.js b/frontend/src/blocks/output.js
index 38b3049..a4ea8b7 100644
--- a/frontend/src/blocks/output.js
+++ b/frontend/src/blocks/output.js
@@ -1,75 +1,75 @@
-import React, { Component } from 'react';
-import { Link } from 'react-router-dom';
+import React, { Component } from 'react'
+import { Link } from 'react-router-dom'
-import Timestamp from './timestamp.js';
-import { api, httpGET, httpStreamGET } from '../http.js';
-import './output.css';
+import Timestamp from './timestamp.js'
+import { api, httpGET, httpStreamGET } from '../http.js'
+import './output.css'
export default class Output extends Component {
constructor(props) {
- super(props);
+ super(props)
this.state = {
job: null,
xhr: null
- };
+ }
}
componentDidMount() {
- let jobID = this.props.jobID;
+ let jobID = this.props.jobID
if (jobID !== null) {
- this.loadCommandLog(jobID);
- this.loadJobDetails(jobID);
+ this.loadCommandLog(jobID)
+ this.loadJobDetails(jobID)
}
}
componentWillUnmount() {
if (this.state.xhr !== null) {
- this.state.xhr.abort();
+ this.state.xhr.abort()
}
}
loadJobDetails(id) {
if (id === null) {
- return;
+ return
}
httpGET(api("/jobs/" + id),
(status, body) => {
- this.setState({job: JSON.parse(body)});
+ this.setState({job: JSON.parse(body)})
},
(error) => {
- console.log("Failed to load job details:", error);
+ console.log("Failed to load job details:", error)
}
- );
+ )
}
loadCommandLog(id) {
if (id === null || this.state.xhr !== null) {
- return;
+ return
}
let xhr = httpStreamGET(api("/jobs/" + id + "/log"),
(chunk) => { // Progress
- let target = this.refs["output"];
- target.innerHTML += chunk.replace(/\n/g, "
");
- this.autoScroll();
+ let target = this.refs["output"]
+ target.innerHTML += chunk.replace(/\n/g, "
")
+ this.autoScroll()
},
(status) => { // Complete
// Request cancelled
if (status === 0) {
- return;
+ return
}
// Reload job details
- this.setState({xhr: null});
- this.loadJobDetails(id);
+ this.setState({xhr: null})
+ this.loadJobDetails(id)
},
(error) => {
- let target = this.refs["output"];
- target.innerHTML = "Failed to fetch command log: "+ error;
+ let target = this.refs["output"]
+ target.innerHTML = "Failed to fetch command log: "+ error
}
- );
- this.setState({xhr: xhr});
+ )
+ this.setState({xhr: xhr})
}
autoScroll() {
@@ -77,32 +77,28 @@ export default class Output extends Component {
}
render() {
- var outputClass = "output";
- if (this.state.job) {
- outputClass += " visible";
- }
-
+ let className = this.state.job ? "output visible" : "output"
return (
{this.renderJobDetails()}
-
+
- );
+ )
}
renderJobDetails() {
- let details = this.state.job;
+ let details = this.state.job
if (!details) {
- return ();
+ return null
}
- // let shortID = details.id.substring(0, 8);
- var state = details.state;
- state = state.charAt(0).toUpperCase() + state.substr(1);
+ // let shortID = details.id.substring(0, 8)
+ var state = details.state
+ state = state.charAt(0).toUpperCase() + state.substr(1)
- var args;
+ var args
if (details.args !== "") {
- args = {details.args};
+ args = {details.args}
}
return (
@@ -126,34 +122,34 @@ export default class Output extends Component {
{this.renderStarted()}
{this.renderFinished()}
- );
+ )
}
renderStarted() {
- let details = this.state.job;
+ let details = this.state.job
return (
- );
+ )
}
renderFinished() {
- let details = this.state.job;
- if (details.finished_at !== null) {
- return [
- ,
-
- ];
- } else {
- return null;
+ let details = this.state.job
+ if (details.finished_at === null) {
+ return null
}
+
+ return [
+ ,
+
+ ]
}
}
diff --git a/frontend/src/blocks/user.js b/frontend/src/blocks/user.js
index 19fcbec..43246e9 100644
--- a/frontend/src/blocks/user.js
+++ b/frontend/src/blocks/user.js
@@ -1,46 +1,52 @@
-import React, { Component } from 'react';
+import React, { Component } from 'react'
-import { api, httpGET } from '../http.js';
-import './user.css';
+import { api, httpGET } from '../http.js'
+import './user.css'
export default class User extends Component {
constructor(props) {
- super(props);
- this.state = {user: undefined};
+ super(props)
+ this.state = {user: undefined}
}
componentDidMount() {
- if (this.props.id === undefined || this.props.id === null) {
- return;
+ if (!this.props.id) {
+ return
}
+
httpGET(api("/users/"+ this.props.id),
(status, body) => {
- this.setState({user: JSON.parse(body)});
+ this.setState({user: JSON.parse(body)})
},
(error) => {
- console.log("Failed to load user details:", error);
+ console.log("Failed to load user details:", error)
}
- );
+ )
}
render() {
- if (this.props.id === undefined || this.props.id === null || this.state.user === undefined) {
- return null;
- } else if (this.state.user === null) {
- let shortID = this.props.id.substring(0, 8);
- return (
-
- );
- } else {
- let details = this.state.user;
- return (
-
-
-
{details.name}
-
- );
+ let details = this.state.user
+ if (!this.props.id || details === undefined) {
+ return null
}
+ if (details === null) {
+ return this.renderUnknownUser()
+ }
+
+ return (
+
+
+
{details.name}
+
+ )
+ }
+
+ renderUnknownUser() {
+ let shortID = this.props.id.substring(0, 8)
+ return (
+
+ )
}
}