From 4820b7c76cb149e40fef6ef781a33d0cfaf73adf Mon Sep 17 00:00:00 2001 From: Abhishek Kapatkar Date: Fri, 24 Feb 2017 12:45:02 -0800 Subject: [PATCH] Comma seperated display for tags on job details section + format code --- .../resources/static/scripts/Application.js | 6 +-- .../main/resources/static/scripts/Cluster.js | 6 +-- .../main/resources/static/scripts/Command.js | 6 +-- .../src/main/resources/static/scripts/Job.js | 8 +-- .../static/scripts/OutputDirectory.js | 42 +++++++-------- .../src/main/resources/static/scripts/Page.js | 51 +++++++++---------- .../scripts/components/ApplicationDetails.js | 22 ++++---- .../scripts/components/ClusterDetails.js | 11 ++-- .../scripts/components/CommandDetails.js | 37 ++++++-------- .../static/scripts/components/JobDetails.js | 39 +++++++------- .../static/scripts/components/JobTableRow.js | 24 ++++----- .../static/scripts/components/SearchForm.js | 24 ++++----- .../static/scripts/components/SiteHeader.js | 8 +-- .../static/scripts/components/TableRow.js | 8 ++- .../main/resources/static/scripts/utils.js | 10 ++-- 15 files changed, 133 insertions(+), 169 deletions(-) diff --git a/genie-web/src/main/resources/static/scripts/Application.js b/genie-web/src/main/resources/static/scripts/Application.js index 7f8f26c4e40..a6028e32f8b 100644 --- a/genie-web/src/main/resources/static/scripts/Application.js +++ b/genie-web/src/main/resources/static/scripts/Application.js @@ -19,7 +19,7 @@ export default class Application extends Page { name: "status", value: "", type: "option", - optionValues: [ "", "ACTIVE", "DEPRECATED", "INACTIVE" ] + optionValues: ["", "ACTIVE", "DEPRECATED", "INACTIVE"] }, { label: "Tag", name: "tag", value: "", type: "input" }, { label: "Type", name: "type", value: "", type: "input" }, @@ -28,7 +28,7 @@ export default class Application extends Page { name: "sort", value: "", type: "select", - selectFields: [ "name", "status", "tag" ].map(field => ({ + selectFields: ["name", "status", "tag"].map(field => ({ value: field, label: field })) @@ -38,7 +38,7 @@ export default class Application extends Page { name: "sortOrder", value: "desc", type: "sortOption", - optionValues: [ "desc", "asc" ] + optionValues: ["desc", "asc"] } ]; } diff --git a/genie-web/src/main/resources/static/scripts/Cluster.js b/genie-web/src/main/resources/static/scripts/Cluster.js index 5ba1283104e..cf76e791504 100644 --- a/genie-web/src/main/resources/static/scripts/Cluster.js +++ b/genie-web/src/main/resources/static/scripts/Cluster.js @@ -19,7 +19,7 @@ export default class Cluster extends Page { name: "status", value: "", type: "option", - optionValues: [ "", "UP", "OUT_OF_SERVICE", "TERMINATED" ] + optionValues: ["", "UP", "OUT_OF_SERVICE", "TERMINATED"] }, { label: "Tag", name: "tag", value: "", type: "input" }, { @@ -27,7 +27,7 @@ export default class Cluster extends Page { name: "sort", value: "", type: "select", - selectFields: [ "name", "status", "tag" ].map(field => ({ + selectFields: ["name", "status", "tag"].map(field => ({ value: field, label: field })) @@ -37,7 +37,7 @@ export default class Cluster extends Page { name: "sortOrder", value: "desc", type: "sortOption", - optionValues: [ "desc", "asc" ] + optionValues: ["desc", "asc"] } ]; } diff --git a/genie-web/src/main/resources/static/scripts/Command.js b/genie-web/src/main/resources/static/scripts/Command.js index c4ae2a36811..4cbf06da992 100644 --- a/genie-web/src/main/resources/static/scripts/Command.js +++ b/genie-web/src/main/resources/static/scripts/Command.js @@ -20,7 +20,7 @@ export default class Command extends Page { name: "status", value: "", type: "option", - optionValues: [ "", "ACTIVE", "DEPRECATED", "INACTIVE" ] + optionValues: ["", "ACTIVE", "DEPRECATED", "INACTIVE"] }, { label: "Tag", name: "tag", value: "", type: "input" }, { @@ -28,7 +28,7 @@ export default class Command extends Page { name: "sort", value: "", type: "select", - selectFields: [ "name", "user", "status", "tag" ].map(field => ({ + selectFields: ["name", "user", "status", "tag"].map(field => ({ value: field, label: field })) @@ -38,7 +38,7 @@ export default class Command extends Page { name: "sortOrder", value: "desc", type: "sortOption", - optionValues: [ "desc", "asc" ] + optionValues: ["desc", "asc"] } ]; } diff --git a/genie-web/src/main/resources/static/scripts/Job.js b/genie-web/src/main/resources/static/scripts/Job.js index 50824dc443f..70002ce4314 100644 --- a/genie-web/src/main/resources/static/scripts/Job.js +++ b/genie-web/src/main/resources/static/scripts/Job.js @@ -36,7 +36,7 @@ export default class Job extends Page { name: "startTime", value: [], type: "timeRange", - queryMapping: [ "minStarted", "maxStarted" ], + queryMapping: ["minStarted", "maxStarted"], mapper: x => moment(parseInt(x, 10)).utc() }, { @@ -44,7 +44,7 @@ export default class Job extends Page { name: "finishedTime", value: [], type: "timeRange", - queryMapping: [ "minFinished", "maxFinished" ], + queryMapping: ["minFinished", "maxFinished"], mapper: x => moment(parseInt(x, 10)).utc() }, { @@ -52,7 +52,7 @@ export default class Job extends Page { name: "size", value: 25, type: "option", - optionValues: [ 10, 25, 50, 100 ] + optionValues: [10, 25, 50, 100] }, { label: "Sort By", @@ -76,7 +76,7 @@ export default class Job extends Page { name: "sortOrder", value: "desc", type: "sortOption", - optionValues: [ "desc", "asc" ] + optionValues: ["desc", "asc"] } ]; } diff --git a/genie-web/src/main/resources/static/scripts/OutputDirectory.js b/genie-web/src/main/resources/static/scripts/OutputDirectory.js index 7dffa9f2d6d..30c9196c516 100644 --- a/genie-web/src/main/resources/static/scripts/OutputDirectory.js +++ b/genie-web/src/main/resources/static/scripts/OutputDirectory.js @@ -35,13 +35,13 @@ export default class OutputDirectory extends React.Component { } get headers() { - return [ { url: "#", name: "GENIE", className: "supress" } ]; + return [{ url: "#", name: "GENIE", className: "supress" }]; } loadData(url) { fetch(`/api/v3/jobs/${url}`) .done(output => { - const [ jobId, ...ignored ] = url.split("/"); + const [jobId, ...ignored] = url.split("/"); this.setState({ output, jobId, @@ -71,38 +71,32 @@ export default class OutputDirectory extends React.Component { return (
- { - this.state.error ?
+ {this.state.error + ?
Output not found
← back
-
:
- { - this.state.fetching && !this.state.error ? :
+
+ :
+ {this.state.fetching && !this.state.error + ? + :
- { - this.state.output.files.length === 0 && - this.state.output.directories.length === 0 - ?
Empty directory
- :
+ {this.state.output.files.length === 0 && + this.state.output.directories.length === 0 + ?
Empty directory
+ :
-
- } -
- } -
- } +
} +
} +
}
); @@ -195,7 +189,7 @@ DirectoryInfo.propTypes = { }; const Navigation = props => { - const [ jobId, output, ...path ] = props.url.split("/"); + const [jobId, output, ...path] = props.url.split("/"); let breadCrumbs = []; // Home Button breadCrumbs.push( diff --git a/genie-web/src/main/resources/static/scripts/Page.js b/genie-web/src/main/resources/static/scripts/Page.js index cb03a37173b..49154d29823 100644 --- a/genie-web/src/main/resources/static/scripts/Page.js +++ b/genie-web/src/main/resources/static/scripts/Page.js @@ -57,7 +57,6 @@ export default class Page extends React.Component { const { rowId = null, showSearchForm = "true" } = query; this.setState({ query, data: [] }); - // Loading state fetch(this.url, query) .done(data => { if (data.hasOwnProperty("_embedded")) { @@ -83,12 +82,12 @@ export default class Page extends React.Component { render() { const sideBar = this.state.showSearchForm ? + query={this.state.query} + formFields={this.formFields} + hiddenFormFields={this.hiddenFormFields} + toggleSearchForm={this.toggleSearchForm} + searchPath={this.searchPath} + /> : ; let resultPanel = null; @@ -97,27 +96,25 @@ export default class Page extends React.Component { } else { resultPanel = this.state.data.length > 0 ?
- - - +
+ + +
+ - - -
- : this.state.noSearchResult - ? - : ; // Default to loading... + + : this.state.noSearchResult ? : ; // Default to loading... } return ( diff --git a/genie-web/src/main/resources/static/scripts/components/ApplicationDetails.js b/genie-web/src/main/resources/static/scripts/components/ApplicationDetails.js index e4f31ed73c1..95304fcfd85 100644 --- a/genie-web/src/main/resources/static/scripts/components/ApplicationDetails.js +++ b/genie-web/src/main/resources/static/scripts/components/ApplicationDetails.js @@ -32,11 +32,12 @@ export default class ApplicationDetails extends React.Component { const { row } = props; const applicationUrl = row._links.self.href; const commandsUrl = row._links.commands.href; - $ - .when(fetch(applicationUrl), fetch(commandsUrl)) - .done((application, commands) => { - this.setState({ application: application[0], commands: commands[0] }); - }); + $.when(fetch(applicationUrl), fetch(commandsUrl)).done(( + application, + commands + ) => { + this.setState({ application: application[0], commands: commands[0] }); + }); } render() { @@ -91,14 +92,9 @@ export default class ApplicationDetails extends React.Component { Commands: - { - this.state.commands.length > 0 - ? - :
- } + {this.state.commands.length > 0 + ? + :
} diff --git a/genie-web/src/main/resources/static/scripts/components/ClusterDetails.js b/genie-web/src/main/resources/static/scripts/components/ClusterDetails.js index e88c5223023..7fa49155d02 100644 --- a/genie-web/src/main/resources/static/scripts/components/ClusterDetails.js +++ b/genie-web/src/main/resources/static/scripts/components/ClusterDetails.js @@ -71,14 +71,9 @@ export default class ClusterDetails extends React.Component { Commands: - { - this.state.commands.length > 0 - ? - :
- } + {this.state.commands.length > 0 + ? + :
} diff --git a/genie-web/src/main/resources/static/scripts/components/CommandDetails.js b/genie-web/src/main/resources/static/scripts/components/CommandDetails.js index e05a0133aeb..5c65571ddb6 100644 --- a/genie-web/src/main/resources/static/scripts/components/CommandDetails.js +++ b/genie-web/src/main/resources/static/scripts/components/CommandDetails.js @@ -32,15 +32,17 @@ export default class CommandDetails extends React.Component { const commandUrl = row._links.self.href; const clustersUrl = `${row._links.clusters.href}?status=UP`; const applicationsUrl = row._links.applications.href; - $ - .when(fetch(commandUrl), fetch(clustersUrl), fetch(applicationsUrl)) - .done((command, clusters, applications) => { - this.setState({ - command: command[0], - clusters: clusters[0], - applications: applications[0] - }); + $.when(fetch(commandUrl), fetch(clustersUrl), fetch(applicationsUrl)).done(( + command, + clusters, + applications + ) => { + this.setState({ + command: command[0], + clusters: clusters[0], + applications: applications[0] }); + }); } render() { @@ -88,27 +90,20 @@ export default class CommandDetails extends React.Component { Clusters: - { - this.state.clusters.length > 0 - ? - :
- } + {this.state.clusters.length > 0 + ? + :
} Applications: - { - this.state.applications.length > 0 - ? 0 + ? - :
- } + :
} diff --git a/genie-web/src/main/resources/static/scripts/components/JobDetails.js b/genie-web/src/main/resources/static/scripts/components/JobDetails.js index 46dbfb38abf..8b4684f5b6e 100644 --- a/genie-web/src/main/resources/static/scripts/components/JobDetails.js +++ b/genie-web/src/main/resources/static/scripts/components/JobDetails.js @@ -17,6 +17,7 @@ export default class JobDetails extends React.Component { command: { id: "", version: "", name: "" }, job: { id: "", + tags: [], _links: { output: "", request: "", @@ -111,7 +112,7 @@ export default class JobDetails extends React.Component { Tags: - {this.state.job.tags} + {this.state.job.tags.join(",")} Status: @@ -212,11 +213,10 @@ export default class JobDetails extends React.Component { - { - (this.state.job.status === "RUNNING" || - this.state.job.status === "INIT") && - !this.state.killJobRequestSent - ? + {(this.state.job.status === "RUNNING" || + this.state.job.status === "INIT") && + !this.state.killJobRequestSent + ?
diff --git a/genie-web/src/main/resources/static/scripts/components/JobTableRow.js b/genie-web/src/main/resources/static/scripts/components/JobTableRow.js index 89250c566b4..b91f37dc6de 100644 --- a/genie-web/src/main/resources/static/scripts/components/JobTableRow.js +++ b/genie-web/src/main/resources/static/scripts/components/JobTableRow.js @@ -62,11 +62,9 @@ export default class TableRow extends React.Component {