@maap-jupyterlab/dps-jupyter-extension
Version:
A JupyterLab extension for submitting and viewing jobs.
35 lines (34 loc) • 2.77 kB
JavaScript
import React from 'react';
import { Nav, Tab } from 'react-bootstrap';
import { useSelector } from 'react-redux';
import { GeneralJobInfoTable } from './GeneralJobInfoTable';
import { InputsJobInfoTable } from './InputsJobInfoTable';
import { selectJobs } from '../redux/slices/jobsSlice';
import { MetricsJobInfoTable } from './MetricsJobInfoTable';
import '../../style/JobDetailsContainer.css';
import { ErrorsJobInfoTable } from './ErrorsJobInfoTable';
import { OutputsJobInfoTable } from './OutputsJobInfoTable';
export const JobDetailsContainer = () => {
// Redux
const { selectedJob } = useSelector(selectJobs);
return (React.createElement("div", { className: "job-details-container" },
React.createElement("h2", null, "Job Details"),
React.createElement(Tab.Container, { id: "left-tabs-example", defaultActiveKey: "general" },
React.createElement(Nav, { variant: "pills", className: "nav-menu" },
React.createElement(Nav.Item, null,
React.createElement(Nav.Link, { eventKey: "general" }, "General")),
React.createElement(Nav.Item, null,
React.createElement(Nav.Link, { eventKey: "inputs" }, "Inputs")),
React.createElement(Nav.Item, null,
React.createElement(Nav.Link, { eventKey: "outputs" }, "Outputs")),
React.createElement(Nav.Item, null,
React.createElement(Nav.Link, { eventKey: "errors" }, "Errors")),
React.createElement(Nav.Item, null,
React.createElement(Nav.Link, { eventKey: "metrics" }, "Metrics"))),
React.createElement(Tab.Content, { className: "content-padding" },
React.createElement(Tab.Pane, { eventKey: "general" }, selectedJob ? React.createElement(GeneralJobInfoTable, null) : React.createElement("div", { className: 'subtext' }, "No job selected")),
React.createElement(Tab.Pane, { eventKey: "inputs" }, selectedJob ? React.createElement(InputsJobInfoTable, null) : React.createElement("span", { className: 'subtext' }, "No job selected")),
React.createElement(Tab.Pane, { eventKey: "outputs" }, selectedJob ? React.createElement(OutputsJobInfoTable, null) : React.createElement("span", { className: 'subtext' }, "No job selected")),
React.createElement(Tab.Pane, { eventKey: "errors" }, selectedJob ? React.createElement(ErrorsJobInfoTable, null) : React.createElement("span", { className: 'subtext' }, "No job selected")),
React.createElement(Tab.Pane, { eventKey: "metrics" }, selectedJob ? React.createElement(MetricsJobInfoTable, null) : React.createElement("span", { className: 'subtext' }, "No job selected"))))));
};