Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Comma seperated display for tags on the job details section #473

Merged
merged 1 commit into from
Feb 24, 2017
Merged

Comma seperated display for tags on the job details section #473

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
6 changes: 3 additions & 3 deletions genie-web/src/main/resources/static/scripts/Application.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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" },
Expand All @@ -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
}))
Expand All @@ -38,7 +38,7 @@ export default class Application extends Page {
name: "sortOrder",
value: "desc",
type: "sortOption",
optionValues: [ "desc", "asc" ]
optionValues: ["desc", "asc"]
}
];
}
Expand Down
6 changes: 3 additions & 3 deletions genie-web/src/main/resources/static/scripts/Cluster.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,15 +19,15 @@ 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" },
{
label: "Sort By",
name: "sort",
value: "",
type: "select",
selectFields: [ "name", "status", "tag" ].map(field => ({
selectFields: ["name", "status", "tag"].map(field => ({
value: field,
label: field
}))
Expand All @@ -37,7 +37,7 @@ export default class Cluster extends Page {
name: "sortOrder",
value: "desc",
type: "sortOption",
optionValues: [ "desc", "asc" ]
optionValues: ["desc", "asc"]
}
];
}
Expand Down
6 changes: 3 additions & 3 deletions genie-web/src/main/resources/static/scripts/Command.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,15 +20,15 @@ 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" },
{
label: "Sort By",
name: "sort",
value: "",
type: "select",
selectFields: [ "name", "user", "status", "tag" ].map(field => ({
selectFields: ["name", "user", "status", "tag"].map(field => ({
value: field,
label: field
}))
Expand All @@ -38,7 +38,7 @@ export default class Command extends Page {
name: "sortOrder",
value: "desc",
type: "sortOption",
optionValues: [ "desc", "asc" ]
optionValues: ["desc", "asc"]
}
];
}
Expand Down
8 changes: 4 additions & 4 deletions genie-web/src/main/resources/static/scripts/Job.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -36,23 +36,23 @@ export default class Job extends Page {
name: "startTime",
value: [],
type: "timeRange",
queryMapping: [ "minStarted", "maxStarted" ],
queryMapping: ["minStarted", "maxStarted"],
mapper: x => moment(parseInt(x, 10)).utc()
},
{
label: "Finished Range",
name: "finishedTime",
value: [],
type: "timeRange",
queryMapping: [ "minFinished", "maxFinished" ],
queryMapping: ["minFinished", "maxFinished"],
mapper: x => moment(parseInt(x, 10)).utc()
},
{
label: "Size",
name: "size",
value: 25,
type: "option",
optionValues: [ 10, 25, 50, 100 ]
optionValues: [10, 25, 50, 100]
},
{
label: "Sort By",
Expand All @@ -76,7 +76,7 @@ export default class Job extends Page {
name: "sortOrder",
value: "desc",
type: "sortOption",
optionValues: [ "desc", "asc" ]
optionValues: ["desc", "asc"]
}
];
}
Expand Down
42 changes: 18 additions & 24 deletions genie-web/src/main/resources/static/scripts/OutputDirectory.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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,
Expand Down Expand Up @@ -71,38 +71,32 @@ export default class OutputDirectory extends React.Component {
return (
<div>
<SiteHeader headers={this.state.headers} infos={this.state.infos} />
{
this.state.error ? <div className="container job-output-directory">
{this.state.error
? <div className="container job-output-directory">
Output not found
<div>
<Link to="/jobs">← back</Link>
</div>
</div> : <div className="container job-output-directory">
{
this.state.fetching && !this.state.error ? <Loading /> : <div>
</div>
: <div className="container job-output-directory">
{this.state.fetching && !this.state.error
? <Loading />
: <div>
<Navigation url={this.state.url} />
{
this.state.output.files.length === 0 &&
this.state.output.directories.length === 0
? <div>Empty directory</div>
: <div>
{this.state.output.files.length === 0 &&
this.state.output.directories.length === 0
? <div>Empty directory</div>
: <div>
<Table>
<TableHeader
headers={[
"Name",
"Size",
"Last Modified (UTC)"
]}
headers={["Name", "Size", "Last Modified (UTC)"]}
/>
<TableBody output={this.state.output} />
</Table>
<DirectoryInfo output={this.state.output} />
</div>
}
</div>
}
</div>
}
</div>}
</div>}
</div>}
<SiteFooter />
</div>
);
Expand Down Expand Up @@ -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(
Expand Down
51 changes: 24 additions & 27 deletions genie-web/src/main/resources/static/scripts/Page.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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")) {
Expand All @@ -83,12 +82,12 @@ export default class Page extends React.Component {
render() {
const sideBar = this.state.showSearchForm
? <SearchForm
query={this.state.query}
formFields={this.formFields}
hiddenFormFields={this.hiddenFormFields}
toggleSearchForm={this.toggleSearchForm}
searchPath={this.searchPath}
/>
query={this.state.query}
formFields={this.formFields}
hiddenFormFields={this.hiddenFormFields}
toggleSearchForm={this.toggleSearchForm}
searchPath={this.searchPath}
/>
: <SearchBar toggleSearchForm={this.toggleSearchForm} />;

let resultPanel = null;
Expand All @@ -97,27 +96,25 @@ export default class Page extends React.Component {
} else {
resultPanel = this.state.data.length > 0
? <div
className={this.state.showSearchForm ? "col-md-10" : "col-md-12"}
>
<Table>
<TableHeader headers={this.tableHeader} />
<TableBody
rows={this.state.data}
rowId={this.state.rowId}
rowType={this.rowType}
detailsTable={this.detailsTable}
toggleRowDetails={this.toggleRowDetails}
className={this.state.showSearchForm ? "col-md-10" : "col-md-12"}
>
<Table>
<TableHeader headers={this.tableHeader} />
<TableBody
rows={this.state.data}
rowId={this.state.rowId}
rowType={this.rowType}
detailsTable={this.detailsTable}
toggleRowDetails={this.toggleRowDetails}
/>
</Table>
<Pagination
page={this.state.page}
pageType={this.searchPath}
links={this.state.links}
/>
</Table>
<Pagination
page={this.state.page}
pageType={this.searchPath}
links={this.state.links}
/>
</div>
: this.state.noSearchResult
? <NoSearchResult />
: <Loading />; // Default to loading...
</div>
: this.state.noSearchResult ? <NoSearchResult /> : <Loading />; // Default to loading...
}

return (
Expand Down
22 changes: 9 additions & 13 deletions genie-web/src/main/resources/static/scripts/components/ApplicationDetails.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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() {
Expand Down Expand Up @@ -91,14 +92,9 @@ export default class ApplicationDetails extends React.Component {
<tr>
<td className="col-xs-2 align-right">Commands:</td>
<td>
{
this.state.commands.length > 0
? <InfoTable
data={this.state.commands}
type="commands"
/>
: <div />
}
{this.state.commands.length > 0
? <InfoTable data={this.state.commands} type="commands" />
: <div />}
</td>
</tr>
<tr>
Expand Down
11 changes: 3 additions & 8 deletions genie-web/src/main/resources/static/scripts/components/ClusterDetails.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -71,14 +71,9 @@ export default class ClusterDetails extends React.Component {
<tr>
<td className="col-xs-2 align-right">Commands:</td>
<td>
{
this.state.commands.length > 0
? <InfoTable
data={this.state.commands}
type="commands"
/>
: <div />
}
{this.state.commands.length > 0
? <InfoTable data={this.state.commands} type="commands" />
: <div />}
</td>
</tr>
<tr>
Expand Down
37 changes: 16 additions & 21 deletions genie-web/src/main/resources/static/scripts/components/CommandDetails.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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() {
Expand Down Expand Up @@ -88,27 +90,20 @@ export default class CommandDetails extends React.Component {
<tr>
<td className="col-xs-2 align-right">Clusters:</td>
<td>
{
this.state.clusters.length > 0
? <InfoTable
data={this.state.clusters}
type="clusters"
/>
: <div />
}
{this.state.clusters.length > 0
? <InfoTable data={this.state.clusters} type="clusters" />
: <div />}
</td>
</tr>
<tr>
<td className="col-xs-2 align-right">Applications:</td>
<td>
{
this.state.applications.length > 0
? <InfoTable
{this.state.applications.length > 0
? <InfoTable
data={this.state.applications}
type="applications"
/>
: <div />
}
: <div />}
</td>
</tr>
<tr>
Expand Down