From 07fc8db9ffc7f40c80fc77228e76e440e9efa54b Mon Sep 17 00:00:00 2001
From: rbokhorst <rbokhorst@astron.nl>
Date: Tue, 12 Feb 2019 16:28:19 +0000
Subject: [PATCH] OSB-38: Processed review comments
---
.gitattributes | 28 ++--
.../src/components/AutoLoadWrapper/index.js | 5 +
.../index.js | 15 +-
.../index.js | 20 ++-
.../components/MultiSelectDropdown/index.js | 68 ++++++---
.../{Header => NavigationBar}/index.js | 17 +--
.../styles.module.scss | 0
.../src/components/PopoverWithTitle/index.js | 14 +-
.../src/components/StationList/index.js | 142 ------------------
.../src/components/StationList/styles.css | 4 -
.../Toolbar/AntennaIdSelector/index.js | 3 +-
.../Toolbar/ErrorTypesSelector/index.js | 4 +-
.../Toolbar/StationGroupSelector/index.js | 6 +-
.../src/components/Toolbar/index.js | 4 +-
.../LatestObservations/ObsRow/index.js | 3 +-
.../components/LatestObservations/index.js | 6 +-
.../components/StationOverview/Badge/index.js | 19 ++-
.../StationOverview/RTSMBadge/index.js | 15 --
.../StationOverview/StationTestBadge/index.js | 21 +--
.../StationStatistics/Toolbar/index.js | 4 +
.../StationTestRow/index.js | 8 +-
.../src/pages/LandingPage/index.js | 8 +-
.../components/StationTestChildView/index.js | 4 +-
.../StationTestView/ComponentType/index.js | 4 +-
.../GenericStatusTd/index.js | 22 +--
.../GenericStatusTd/styles.module.css | 0
.../GenericStatusTd/styles.module.scss | 2 +-
.../GenericTestRow/index.js | 0
.../GenericTestRow/styles.module.css | 0
.../GenericTestRow/styles.module.scss | 2 +-
.../{ComponentType => }/RTSMRows/index.js | 7 +-
.../RTSMRows/styles.module.css | 0
.../RTSMRows/styles.module.scss | 0
.../components/StationTestView/index.js | 7 +-
.../src/pages/StationOverviewPage/index.js | 4 +-
.../components/AntennaErrorDetails/index.js | 4 +-
.../AntennaView/AntennaErrorRow/index.js | 1 -
.../AntennaView/GenericStatusTd/index.js | 10 ++
.../TilesPage/components/AntennaView/index.js | 34 +++--
.../src/pages/TilesPage/index.js | 4 +-
.../reducers/stationOverviewPageReducers.js | 1 -
41 files changed, 223 insertions(+), 297 deletions(-)
rename LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/{PictureWithModal => EnlargeableImage}/index.js (83%)
rename LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/{FillHeightDiv => FillViewportHeightDiv}/index.js (80%)
rename LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/{Header => NavigationBar}/index.js (81%)
rename LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/{Header => NavigationBar}/styles.module.scss (100%)
delete mode 100644 LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/StationList/index.js
delete mode 100644 LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/StationList/styles.css
rename LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/{ComponentType => }/GenericStatusTd/index.js (76%)
rename LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/{ComponentType => }/GenericStatusTd/styles.module.css (100%)
rename LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/{ComponentType => }/GenericStatusTd/styles.module.scss (84%)
rename LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/{ComponentType => }/GenericTestRow/index.js (100%)
rename LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/{ComponentType => }/GenericTestRow/styles.module.css (100%)
rename LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/{ComponentType => }/GenericTestRow/styles.module.scss (82%)
rename LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/{ComponentType => }/RTSMRows/index.js (96%)
rename LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/{ComponentType => }/RTSMRows/styles.module.css (100%)
rename LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/{ComponentType => }/RTSMRows/styles.module.scss (100%)
diff --git a/.gitattributes b/.gitattributes
index 072f4bdd111..1ae33f286de 100644
--- a/.gitattributes
+++ b/.gitattributes
@@ -1856,17 +1856,15 @@ LCU/Maintenance/MDB_WebView/maintenancedb_view/src/App.test.js -text
LCU/Maintenance/MDB_WebView/maintenancedb_view/src/api_configuration.js -text
LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/AutoLoadWrapper/index.js -text
LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/AutoLoadWrapper/styles.module.scss -text
-LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/FillHeightDiv/index.js -text
-LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/Header/index.js -text
-LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/Header/styles.module.scss -text
+LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/EnlargeableImage/index.js -text
+LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/FillViewportHeightDiv/index.js -text
LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/MultiSelectDropdown/index.js -text
LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/MultiSelectDropdown/styles.module.scss -text
+LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/NavigationBar/index.js -text
+LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/NavigationBar/styles.module.scss -text
LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/ObservationInspectTag/index.js -text
LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/ObservationInspectTag/styles.module.scss -text
-LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/PictureWithModal/index.js -text
LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/PopoverWithTitle/index.js -text
-LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/StationList/index.js -text
-LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/StationList/styles.css -text
LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/Toolbar/AntennaIdSelector/index.js -text
LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/Toolbar/AntennaIdSelector/styles.module.scss -text
LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/Toolbar/AntennaTypeSelector/index.js -text
@@ -1907,18 +1905,18 @@ LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/LandingPage/components/
LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/LandingPage/index.js -text
LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestChildView/index.js -text
LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestChildView/styles.module.scss -text
-LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/ComponentType/GenericStatusTd/index.js -text
-LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/ComponentType/GenericStatusTd/styles.module.css -text
-LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/ComponentType/GenericStatusTd/styles.module.scss -text
-LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/ComponentType/GenericTestRow/index.js -text
-LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/ComponentType/GenericTestRow/styles.module.css -text
-LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/ComponentType/GenericTestRow/styles.module.scss -text
-LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/ComponentType/RTSMRows/index.js -text
-LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/ComponentType/RTSMRows/styles.module.css -text
-LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/ComponentType/RTSMRows/styles.module.scss -text
LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/ComponentType/index.js -text
LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/ComponentType/styles.module.css -text
LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/ComponentType/styles.module.scss -text
+LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/GenericStatusTd/index.js -text
+LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/GenericStatusTd/styles.module.css -text
+LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/GenericStatusTd/styles.module.scss -text
+LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/GenericTestRow/index.js -text
+LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/GenericTestRow/styles.module.css -text
+LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/GenericTestRow/styles.module.scss -text
+LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/RTSMRows/index.js -text
+LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/RTSMRows/styles.module.css -text
+LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/RTSMRows/styles.module.scss -text
LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/index.js -text
LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/styles.module.scss -text
LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/index.js -text
diff --git a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/AutoLoadWrapper/index.js b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/AutoLoadWrapper/index.js
index 96f09284607..aad8f7beb5e 100644
--- a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/AutoLoadWrapper/index.js
+++ b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/AutoLoadWrapper/index.js
@@ -16,6 +16,7 @@ function Spinner() {
/**
* ErrorAlert: simple component to show a error message
+ * @arg {string} message - The message text to display
*/
function ErrorAlert({message}) {
return <Alert className="py-1" color="danger">
@@ -27,6 +28,10 @@ function ErrorAlert({message}) {
* AutoLoadWrapper: HOC for automatic reloading of data at a specified interval.
* See defaultProps fro accepted props, other props are passed through to then
* WrappedComponent.
+ * @param {class} WrappedComponent - The component to wrap.
+ * @returns {class} The wrapped component.
+ * @example
+ * const MyComponentWithLoader = AutoLoadWrapper(MyComponent);
*/
function AutoLoadWrapper(WrappedComponent) {
diff --git a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/PictureWithModal/index.js b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/EnlargeableImage/index.js
similarity index 83%
rename from LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/PictureWithModal/index.js
rename to LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/EnlargeableImage/index.js
index e5a5b4fdb59..54fe7310a3e 100644
--- a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/PictureWithModal/index.js
+++ b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/EnlargeableImage/index.js
@@ -8,11 +8,16 @@ import {
ModalBody
} from 'reactstrap';
-// CSS
-//import styles from './styles.module.scss'
-
-class PictureWithModal extends Component {
+/**
+ * EnlargeableImage:
+ * Creates a clickable <img> tag. When the image is clicked, it is opened in a modal
+ * and typically enlarged.
+ *
+ * @prop {string} url - the URL of the image
+ * @prop {string} className - classname applied to the Modal
+ */
+class EnlargeableImage extends Component {
state = {
modal: false,
@@ -66,4 +71,4 @@ class PictureWithModal extends Component {
}
-export default PictureWithModal;
+export default EnlargeableImage;
diff --git a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/FillHeightDiv/index.js b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/FillViewportHeightDiv/index.js
similarity index 80%
rename from LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/FillHeightDiv/index.js
rename to LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/FillViewportHeightDiv/index.js
index 6f10235f5cb..b177de6ff20 100644
--- a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/FillHeightDiv/index.js
+++ b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/FillViewportHeightDiv/index.js
@@ -1,18 +1,24 @@
import React from "react";
-/*
- * FillHeightDiv: Creates a div that fills the remaining height of the viewport.
+/**
+ * FillViewportHeightDiv: Creates a div that fills the remaining height of the viewport.
* Window resize is monitored to scale the div accordingly.
*
* This component uses the 'render prop' pattern where the 'children' prop is used
* as the render function. The height of the div (in an object) is passed to
* the function for use by subcomponents. E.g.:
*
- * <FillHeightDiv>
- * { (props) => <MyComponent hgt={props.height} /> }
- * </FillHeightDiv>
+ * @prop {string} className - Class applied to the container div
+ * @prop {integer} gutterBottom - Bottom margin for the container div
+ * @prop {integer} minHeight - Mininum height of container div
+ * @prop {jsx} children - Content of container div
+ *
+ * @example
+ * <FillViewportHeightDiv>
+ * { (props) => <MyComponent hgt={props.height} /> }
+ * </FillViewportHeightDiv>
*/
-class FillHeightDiv extends React.Component {
+class FillViewportHeightDiv extends React.Component {
static defaultProps = {
className: 'fill-height-container', // classname for the container div
@@ -85,4 +91,4 @@ class FillHeightDiv extends React.Component {
}
};
-export default FillHeightDiv;
+export default FillViewportHeightDiv;
diff --git a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/MultiSelectDropdown/index.js b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/MultiSelectDropdown/index.js
index 0e41514b862..d9387d1597b 100644
--- a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/MultiSelectDropdown/index.js
+++ b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/MultiSelectDropdown/index.js
@@ -6,6 +6,13 @@ import { Dropdown, DropdownToggle, DropdownMenu, DropdownItem } from 'reactstrap
import styles from './styles.module.scss'
+/**
+ * SelectableOption: renders the boilerplate JSX for selectable items in the DropdownMenu.
+ *
+ * @prop {bool} isSelected - if the item is selected
+ * @prop {function} onSelectedItem - callback for click event. Gets the option value as argument.
+ * @prop {jsx} children - label content
+ */
function SelectableOption(props) {
const selectMark = props.isSelected ? <IsSelectIcon /> : null;
@@ -27,6 +34,13 @@ function SelectableOption(props) {
);
}
+/**
+ * MultiSelectDropdown:
+ * Creates a multi-select box. The selectable items are presented in a dropdown.
+ *
+ * @props:
+ * options: list of objects {value, label}
+ */
export class MultiSelectDropdown extends Component{
state = {
@@ -36,34 +50,44 @@ export class MultiSelectDropdown extends Component{
// Toggle the dropdown state
toggle = () => {
- if(!this.state.isOpen)
- {
- this.setState({isOpen:true});
- }else if(!this.state.mouseOverMenu){
+ if (!this.state.isOpen) {
+ this.setState({
+ isOpen: true
+ });
+ }
+ else if (!this.state.mouseOverMenu) {
this.closeMenu()
}
}
closeMenu(){
- this.setState({isOpen:false})
+ this.setState({
+ isOpen:false
+ })
this.props.onSelectionChange(this.getSelectedItemsList())
}
itemSelected = (e) => {
if (e === 'all'){
- this.setState({selectedItems: {}})
+ this.setState({
+ selectedItems: {}
+ })
this.props.onSelectionChange([])
- this.setState({isOpen:false})
+ this.setState({
+ isOpen:false
+ })
}else{
const newSelectedItems = this.state.selectedItems
newSelectedItems[e] = !newSelectedItems[e]
- this.setState({selectedItems: newSelectedItems})
+ this.setState({
+ selectedItems: newSelectedItems
+ })
}
}
getSelectedItemsList (selectedItems) {
- if (selectedItems === undefined){
+ if (selectedItems === undefined) {
selectedItems = this.state.selectedItems;
}
return Object.keys(selectedItems).filter(item => this.state.selectedItems[item]);
@@ -73,34 +97,42 @@ export class MultiSelectDropdown extends Component{
renderLabel(){
const selectedItemsList = this.getSelectedItemsList()
- if(selectedItemsList.length === 0 ){
+ if (selectedItemsList.length === 0 ) {
return this.props.placeHolder;
- }else if(selectedItemsList.length <= 4){
+ }
+ else if (selectedItemsList.length <= 4) {
return selectedItemsList.join(', ')
- }else {
+ } else {
const firstFour = selectedItemsList.slice(0, 4)
return firstFour.join(', ') + ', ...'
}
}
isItemSelected = (e) => {
- if(this.state.selectedItems.hasOwnProperty(e))
+ if (this.state.selectedItems.hasOwnProperty(e)) {
return this.state.selectedItems[e];
+ }
return false
}
componentDidMount() {
const selectedItems = this.state.selectedItems
let update = false
- if(this.props.selectedItems === undefined) return
- for(let item of this.props.selectedItems){
- if(!selectedItems.hasOwnProperty(item) || !selectedItems[item] ){
+ if (this.props.selectedItems === undefined) {
+ return
+ }
+ for (let item of this.props.selectedItems) {
+ if (!selectedItems.hasOwnProperty(item) || !selectedItems[item]) {
selectedItems[item] = true;
update = true
}
}
- if(update) this.setState({selectedItems: selectedItems})
+ if (update) {
+ this.setState({
+ selectedItems: selectedItems
+ })
+ }
}
mouseOverMenu = () => {
@@ -111,7 +143,7 @@ export class MultiSelectDropdown extends Component{
this.setState({mouseOverMenu:false})
}
- render(){
+ render() {
let allOptions = [{value:'all', label:'<ALL>'}].concat(this.props.options)
let options = allOptions.map((item, key) =>
<SelectableOption key={key} value={item.value} isSelected={this.isItemSelected(item.value)} onSelectedItem={this.itemSelected}>
diff --git a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/Header/index.js b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/NavigationBar/index.js
similarity index 81%
rename from LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/Header/index.js
rename to LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/NavigationBar/index.js
index fab2bb89efd..6815e6dc046 100644
--- a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/Header/index.js
+++ b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/NavigationBar/index.js
@@ -11,8 +11,11 @@ import { Collapse,
// CSS
import styles from './styles.module.scss'
-
-class Header extends PureComponent {
+/**
+ * NavigationBar
+ * Creates the top navigation bar with app name and collapsable main menu.
+ */
+class NavigationBar extends PureComponent {
state = {
isOpen: false
@@ -25,7 +28,6 @@ class Header extends PureComponent {
}
check_status(item){
- //console.log(this.props.active_page.pathname)
if (this.props.active_page.pathname === item){
return "active"
}
@@ -57,17 +59,10 @@ class Header extends PureComponent {
<h3>Tiles</h3>
</NavLink>
</NavItem>
- { /*}
- <NavItem className={this.check_status("/details")}>
- <NavLink tag={Link} to="/details">
- <h3>Details</h3>
- </NavLink>
- </NavItem>
- */ }
</Nav>
</Collapse>
</Navbar>);
}
}
-export default Header;
+export default NavigationBar;
diff --git a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/Header/styles.module.scss b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/NavigationBar/styles.module.scss
similarity index 100%
rename from LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/Header/styles.module.scss
rename to LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/NavigationBar/styles.module.scss
diff --git a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/PopoverWithTitle/index.js b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/PopoverWithTitle/index.js
index a78139883e0..b8525a661e7 100644
--- a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/PopoverWithTitle/index.js
+++ b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/PopoverWithTitle/index.js
@@ -1,10 +1,18 @@
import React from 'react';
import {Popover, PopoverHeader, PopoverBody} from 'reactstrap';
-// CSS
-//import {styles} from './styles.module.scss'
-
+/**
+ * PopoverWithTitle:
+ * Function component that renders a Popover with a title
+ *
+ * @props:
+ * target: [string] id of the HTML element that triggers the popover
+ * isOpen: [bool] should the Popover be displayed (true) or hidden (false)
+ * togglePopover: [function] function that is called to toggle the popover
+ * title: [string] title of the Popover
+ * children: [JSX fragment] the body of the Popover
+ */
const PopoverWithTitle = ({target, isOpen, togglePopover, title, children}) => {
if (!isOpen) {
diff --git a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/StationList/index.js b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/StationList/index.js
deleted file mode 100644
index 605c1fd2503..00000000000
--- a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/StationList/index.js
+++ /dev/null
@@ -1,142 +0,0 @@
-import React, { Component } from 'react';
-import { Nav, NavItem, NavLink, InputGroup, Input, InputGroupAddon,
- Container, Row, Table, Pagination, PaginationItem,
- PaginationLink, Badge, Button } from 'reactstrap';
-import StationTestSummary from './StationTestSummary.js'
-import RESTAPI from '../api_configuration.js'
-import { Link } from 'react-router-dom';
-import './StationList.css'
-
-class StationList extends Component {
-
- constructor(props){
- super(props);
- this.state = {
- stations: [],
- isLoading: null,
- query: {
- station_name:'',
- station_type: '',
- from_date:'',
- to_date:''}
- };
- }
-
- fillResultUrl(query){
- let parameters = query;
- let url = RESTAPI.get_url('station_test', this.props.current_page, parameters);
- return url;
- }
-
- fetchData(query){
- this.setState({isLoading:true});
- let current_request = this.fillResultUrl(query)
- console.log(current_request)
- fetch(current_request).then(
- (response) => response.json()).then(
- (content) => {
- this.setState({total_pages:content.total_pages,
- isLoading: false});
- this.setState({stations: content.results});
- }
- );
- }
-
- componentDidMount(){
- this.fetchData(this.state.query);
- }
-
- getNextPageNumber(){
- const current_page = this.props.current_page
- return current_page < this.state.total_pages ?
- current_page + 1 :
- current_page
-
- }
-
- getNextPage(){
- return '/stationtest/' + this.getNextPageNumber();
- }
-
- getPrevPageNumber(){
- const current_page = this.props.current_page
- return current_page > 1 ?
- current_page - 1 :
- current_page
-
- }
-
- getPrevPage(){
- return '/stationtest/' + this.getPrevPageNumber();
- }
-
- stationSelectedEvent(evt){
- let query = this.state.query
- query.station_name = evt.target.value
-
- this.setState({'query': query});
-
- this.fetchData(query);
- }
-
- stationTypeSelectedEvent(evt){
- let query = this.state.query
- query.station_type = evt.target.value
-
- this.setState({'query': query});
- this.fetchData(query);
- }
-
- fromDateSelectedEvent(evt){
- let query = this.state.query
- query.from_date = evt.target.value
-
- this.setState({'query': query});
- this.fetchData(query);
- }
-
- toDateSelectedEvent(evt){
- let query = this.state.query
- query.to_date = evt.target.value
-
- this.setState({'query': query});
- this.fetchData(query);
- }
-
- render() {
- var station_names = this.state.stations.map( (item)=> <StationTestSummary data={item} key={item.id} />);
- const prev_page = this.getPrevPage();
- const next_page = this.getNextPage();
- return (
- <div>
- <InputGroup>
- <Input type='search' placeholder='Station'
- onInput={(evt)=>this.stationSelectedEvent(evt)}></Input>
- <Input placeholder='Station type'
- onChange={(evt)=>this.stationTypeSelectedEvent(evt)}></Input>
- <InputGroupAddon addonType="prepend">From</InputGroupAddon>
- <Input type='date'
- onChange={(evt)=>this.fromDateSelectedEvent(evt)}></Input>
- <InputGroupAddon addonType="prepend">To</InputGroupAddon>
- <Input type='date'
- onChange={(evt)=>this.toDateSelectedEvent(evt)}></Input>
- <Badge>
- <div className='pagenumber'>
- Page {this.props.current_page} / {this.state.total_pages}
- </div>
- </Badge>
- </InputGroup>
- {station_names}
- <Nav className="ml-auto float-right">
- <NavItem>
- <NavLink href={prev_page}><Button>previous</Button></NavLink>
- </NavItem>
- <NavItem>
- <NavLink href={next_page}><Button>next</Button></NavLink></NavItem>
- </Nav>
- </div>
- );
- }
-}
-
-export default StationList;
diff --git a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/StationList/styles.css b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/StationList/styles.css
deleted file mode 100644
index 8e89d534749..00000000000
--- a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/StationList/styles.css
+++ /dev/null
@@ -1,4 +0,0 @@
-.pagenumber {
- position: relative;
- top: 30%;
-}
diff --git a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/Toolbar/AntennaIdSelector/index.js b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/Toolbar/AntennaIdSelector/index.js
index 34aad6cc2ce..c036c55d463 100644
--- a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/Toolbar/AntennaIdSelector/index.js
+++ b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/Toolbar/AntennaIdSelector/index.js
@@ -16,7 +16,8 @@ import styles from './styles.module.scss'
/**
- * Radio buttons for Antenna Id
+ * AntennaIdSelector:
+ * Select box for selecting an antenna Id. This component is part of {@link module:Toolbar}.
*/
class AntennaIdSelectorC extends Component {
diff --git a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/Toolbar/ErrorTypesSelector/index.js b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/Toolbar/ErrorTypesSelector/index.js
index fa9d25067b3..0dd827f386b 100644
--- a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/Toolbar/ErrorTypesSelector/index.js
+++ b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/Toolbar/ErrorTypesSelector/index.js
@@ -8,8 +8,8 @@ import MultiSelectDropdown from 'components/MultiSelectDropdown'
import toolbarStyles from '../styles.module.scss'
/**
- * Class to display a secondary header for selecting data filters.
- * The state is managed by the LandingPage class.
+ * ErrorTypesSelector:
+ * Renders a multi-select dropdown for selecting error types (HIGH_NOISE, LOW_NOISE, ..)
*/
class ErrorTypesSelectorC extends Component {
diff --git a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/Toolbar/StationGroupSelector/index.js b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/Toolbar/StationGroupSelector/index.js
index d3cb485520d..c973010ab25 100644
--- a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/Toolbar/StationGroupSelector/index.js
+++ b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/Toolbar/StationGroupSelector/index.js
@@ -5,9 +5,9 @@ import {setStationGroup} from "redux/actions/mainFiltersActions";
// CSS
import toolbarStyles from '../styles.module.scss'
-
-/*
- *
+/**
+ * StationGroupSelector:
+ * Select box for selecting a station group (all, core, remote, ilt)
*/
class StationGroupSelectorC extends Component {
diff --git a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/Toolbar/index.js b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/Toolbar/index.js
index e05205b9333..9e3f193bbfb 100644
--- a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/Toolbar/index.js
+++ b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/components/Toolbar/index.js
@@ -1,10 +1,12 @@
+/** @module Toolbar */
+
import React from 'react';
// CSS
import styles from './styles.module.scss'
-/*
+/**
* Toolbar: the wrapper for all toolbar components. Use as:
* <Toolbar>
* <StationAutoComplete />
diff --git a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/LandingPage/components/LatestObservations/ObsRow/index.js b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/LandingPage/components/LatestObservations/ObsRow/index.js
index 9e91e18db36..99228bc8529 100644
--- a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/LandingPage/components/LatestObservations/ObsRow/index.js
+++ b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/LandingPage/components/LatestObservations/ObsRow/index.js
@@ -11,7 +11,8 @@ import styles from './styles.module.scss'
/**
- * SORow; Class to render the row for a station in the StationOverview.
+ * ObsRow:
+ * Class to render the (RTSM) row for an observation.
*/
class ObsRow extends Component {
diff --git a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/LandingPage/components/LatestObservations/index.js b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/LandingPage/components/LatestObservations/index.js
index 97d48670489..18a91713fc5 100644
--- a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/LandingPage/components/LatestObservations/index.js
+++ b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/LandingPage/components/LatestObservations/index.js
@@ -10,6 +10,8 @@ import styles from './styles.module.scss'
/**
* TableRows: function component returning the table rows.
+ * LatestObservations class.
+ * Component showing a table with the latest observations and number of errors.
*/
function TableRows({data}) {
return data.map( (stationData) =>
@@ -17,8 +19,10 @@ function TableRows({data}) {
);
}
+
/**
- * StationOverview class.
+ * LatestObservations class.
+ * Component showing a table with the latest observations and number of errors.
*/
class LatestObservationsC extends Component {
diff --git a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/LandingPage/components/StationOverview/Badge/index.js b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/LandingPage/components/StationOverview/Badge/index.js
index f84759adfaa..bc43ec03672 100644
--- a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/LandingPage/components/StationOverview/Badge/index.js
+++ b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/LandingPage/components/StationOverview/Badge/index.js
@@ -1,4 +1,5 @@
import React, {PureComponent} from 'react';
+import classNames from "classnames";
// CSS
import styles from './styles.module.scss'
@@ -10,14 +11,16 @@ class Badge extends PureComponent {
getClass() {
let cnt = this.props.count;
- let color = cnt > 10
- ? "hilite-serious"
- : cnt > 5
- ? "hilite-alarming"
- : cnt > 0
- ? "hilite-warning"
- : "hilite-good";
- return styles.so_pill+" "+color;
+
+ let cls = classNames({
+ [styles.so_pill]: true,
+ 'hilite-serious': cnt > 10,
+ 'hilite-alarming': cnt > 5 && cnt <=10,
+ 'hilite-warning': cnt > 0 && cnt <= 5,
+ 'hilite-good': cnt === 0
+ });
+
+ return cls;
}
render() {
diff --git a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/LandingPage/components/StationOverview/RTSMBadge/index.js b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/LandingPage/components/StationOverview/RTSMBadge/index.js
index 4086e9788b0..2a2cc8e8cd7 100644
--- a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/LandingPage/components/StationOverview/RTSMBadge/index.js
+++ b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/LandingPage/components/StationOverview/RTSMBadge/index.js
@@ -7,9 +7,6 @@ import {Table} from 'reactstrap';
import PopoverWithTitle from 'components/PopoverWithTitle'
import Badge from '../Badge'
-// CSS
-//import {styles} from './styles.module.scss'
-
/**
* RTSMBadge; class to render one RTSM badge in the SORow.
@@ -22,18 +19,6 @@ class RTSMBadge extends Component {
popoverOpen: false
};
- getClass() {
- let total = this.props.data.total_component_errors;
- let color = total > 10
- ? "so-serious"
- : total > 5
- ? "so-alarming"
- : total > 0
- ? "so-warning"
- : "so-good";
- return "so-pill " + color;
- }
-
togglePopover = () => {
this.setState({
popoverOpen: !this.state.popoverOpen
diff --git a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/LandingPage/components/StationOverview/StationTestBadge/index.js b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/LandingPage/components/StationOverview/StationTestBadge/index.js
index 9c74f8a9805..855312d9ad1 100644
--- a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/LandingPage/components/StationOverview/StationTestBadge/index.js
+++ b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/LandingPage/components/StationOverview/StationTestBadge/index.js
@@ -4,6 +4,7 @@ import {unique_id} from 'utils/utils.js'
import * as moment from 'moment';
import {Table} from 'reactstrap';
import { datetime_format } from 'utils/constants'
+import classNames from "classnames";
import PopoverWithTitle from 'components/PopoverWithTitle'
import Badge from '../Badge'
@@ -23,15 +24,17 @@ class StationTestBadgeC extends Component {
};
getClass() {
- let total = this.props.data.total_component_errors;
- let color = total > 10
- ? "hilite-serious"
- : total > 5
- ? "hilite-alarming"
- : total > 0
- ? "hilite-warning"
- : "hilite-good";
- return styles.stationtestbadge + " " +color;
+ let cnt = this.props.data.total_component_errors;
+
+ let cls = classNames({
+ [styles.stationtestbadge]: true,
+ 'hilite-serious': cnt > 10,
+ 'hilite-alarming': cnt > 5 && cnt <=10,
+ 'hilite-warning': cnt > 0 && cnt <= 5,
+ 'hilite-good': cnt === 0
+ });
+
+ return cls;
}
onClick = () => {
diff --git a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/LandingPage/components/StationStatistics/Toolbar/index.js b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/LandingPage/components/StationStatistics/Toolbar/index.js
index 3bb226cdc9b..79d2210cec9 100644
--- a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/LandingPage/components/StationStatistics/Toolbar/index.js
+++ b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/LandingPage/components/StationStatistics/Toolbar/index.js
@@ -10,6 +10,10 @@ import {setStationStatisticsTestType, setStationStatisticsAveragingWindow} from
import styles from './styles.module.scss'
+/**
+ * Toolbar
+ * Toolbar for the station statistics component providing graphing options.
+ */
class ToolbarC extends Component {
state = {
diff --git a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/LandingPage/components/StationTestSummary/StationTestRow/index.js b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/LandingPage/components/StationTestSummary/StationTestRow/index.js
index 98913d7f6af..878373795f2 100644
--- a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/LandingPage/components/StationTestSummary/StationTestRow/index.js
+++ b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/LandingPage/components/StationTestSummary/StationTestRow/index.js
@@ -2,14 +2,10 @@ import React, { Component } from 'react';
import * as moment from 'moment';
import { date_format, time_format } from 'utils/constants'
-//import stdata from '../testdata/station_test_summary.js'
-
-// CSS
-//import './styles.module.scss'
-
/**
- * SORow; Class to render the row for a station in the StationOverview.
+ * StationTestRow
+ * Class to render the row for a station test.
*/
class StationTestRow extends Component {
diff --git a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/LandingPage/index.js b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/LandingPage/index.js
index 691fb243982..f1749c3daab 100644
--- a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/LandingPage/index.js
+++ b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/LandingPage/index.js
@@ -1,5 +1,5 @@
import React, {Component} from 'react';
-import Header from 'components/Header'
+import NavigationBar from 'components/NavigationBar'
import StationOverview from './components/StationOverview';
import StationTestSummary from './components/StationTestSummary';
@@ -21,6 +21,10 @@ import 'react-resizable/css/styles.css';
const ResponsiveGridLayout = WidthProvider(Responsive);
+/**
+ * LandingPage
+ * The 'dashboard' or home page with responsive grid and panels.
+ */
class LandingPageC extends Component {
getStationOverviewURL() {
@@ -97,7 +101,7 @@ class LandingPageC extends Component {
render() {
return (<div>
- <Header active_page={this.props.location}/>
+ <NavigationBar active_page={this.props.location}/>
<Toolbar>
<StationGroupSelector />
<ErrorsOnlySelector />
diff --git a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestChildView/index.js b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestChildView/index.js
index 6647e5b28d5..9739d9a353e 100644
--- a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestChildView/index.js
+++ b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestChildView/index.js
@@ -3,7 +3,7 @@ import {connect} from "react-redux";
import {unpinChildPanelData} from 'redux/actions/stationOverviewPageActions'
import {Badge, Button, Table} from 'reactstrap';
import {IoMdCloseCircleOutline as CloseIcon} from 'react-icons/io';
-import PictureWithModal from 'components/PictureWithModal'
+import EnlargeableImage from 'components/EnlargeableImage'
// CSS
@@ -78,7 +78,7 @@ function ErrorDetailRow({data, rowkey}) {
}
if (data.details.url) {
- img = <PictureWithModal url={data.details.url} />
+ img = <EnlargeableImage url={data.details.url} />
}
return (
diff --git a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/ComponentType/index.js b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/ComponentType/index.js
index 1a515ab95b9..fe74f561f32 100644
--- a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/ComponentType/index.js
+++ b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/ComponentType/index.js
@@ -4,8 +4,8 @@ import React, {
import {Badge} from 'reactstrap';
import ReactTableContainer from "react-table-container";
-import GenericTestRow from './GenericTestRow';
-import RTSMRows from './RTSMRows';
+import GenericTestRow from '../GenericTestRow';
+import RTSMRows from '../RTSMRows';
// CSS
import styles from './styles.module.scss';
diff --git a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/ComponentType/GenericStatusTd/index.js b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/GenericStatusTd/index.js
similarity index 76%
rename from LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/ComponentType/GenericStatusTd/index.js
rename to LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/GenericStatusTd/index.js
index ebf31bb3bb6..474d16ef026 100644
--- a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/ComponentType/GenericStatusTd/index.js
+++ b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/GenericStatusTd/index.js
@@ -2,24 +2,26 @@ import React, {
Component
} from 'react';
import {withRouter} from "react-router";
-
+import classNames from "classnames";
// CSS
import styles from './styles.module.scss';
+/**
+ * GenericStatusTd; render a <td> showing the number of errors for an antenna.
+ * Show the error details in the detail panel on the right on mouse hover.
+ */
class GenericStatusTdC extends Component {
getClass() {
- let cls = styles.status;
- if (this.props.doHighlight) {
- cls += " "+styles.highlight;
- }
- if (this.props.n_errors > 0) {
- cls += ' hilite-serious'
- } else {
- cls += ' hilite-good'
- }
+ let cls = classNames({
+ [styles.status]: true,
+ [styles.highlight]: this.props.doHighlight,
+ 'hilite-serious': this.props.n_errors > 0,
+ 'hilite-good': this.props.n_errors == 0
+ });
+
return cls;
}
diff --git a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/ComponentType/GenericStatusTd/styles.module.css b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/GenericStatusTd/styles.module.css
similarity index 100%
rename from LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/ComponentType/GenericStatusTd/styles.module.css
rename to LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/GenericStatusTd/styles.module.css
diff --git a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/ComponentType/GenericStatusTd/styles.module.scss b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/GenericStatusTd/styles.module.scss
similarity index 84%
rename from LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/ComponentType/GenericStatusTd/styles.module.scss
rename to LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/GenericStatusTd/styles.module.scss
index 3e9e5fa6280..aa9f18de183 100644
--- a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/ComponentType/GenericStatusTd/styles.module.scss
+++ b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/GenericStatusTd/styles.module.scss
@@ -1,4 +1,4 @@
-@import '../../../../../../themes/lofar-variables.scss';
+@import '../../../../../themes/lofar-variables.scss';
:local .status {
diff --git a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/ComponentType/GenericTestRow/index.js b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/GenericTestRow/index.js
similarity index 100%
rename from LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/ComponentType/GenericTestRow/index.js
rename to LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/GenericTestRow/index.js
diff --git a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/ComponentType/GenericTestRow/styles.module.css b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/GenericTestRow/styles.module.css
similarity index 100%
rename from LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/ComponentType/GenericTestRow/styles.module.css
rename to LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/GenericTestRow/styles.module.css
diff --git a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/ComponentType/GenericTestRow/styles.module.scss b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/GenericTestRow/styles.module.scss
similarity index 82%
rename from LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/ComponentType/GenericTestRow/styles.module.scss
rename to LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/GenericTestRow/styles.module.scss
index ac6838ed382..2400c854ff4 100644
--- a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/ComponentType/GenericTestRow/styles.module.scss
+++ b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/GenericTestRow/styles.module.scss
@@ -1,4 +1,4 @@
-@import '../../../../../../themes/lofar-variables.scss';
+@import '../../../../../themes/lofar-variables.scss';
:local .testrow.highlight {
diff --git a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/ComponentType/RTSMRows/index.js b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/RTSMRows/index.js
similarity index 96%
rename from LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/ComponentType/RTSMRows/index.js
rename to LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/RTSMRows/index.js
index 332750cc0b1..55f806c8130 100644
--- a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/ComponentType/RTSMRows/index.js
+++ b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/RTSMRows/index.js
@@ -7,11 +7,10 @@ import {renderDateRange} from 'utils/utils'
import GenericTestRow from '../GenericTestRow'
// CSS
-//import styles from './styles.module.scss';
import rtsmStyles from 'themes/rtsm_collapsable.module.scss';
-/*
+/**
* RTSMSummaryLine: create one table row with percentages of errors per antenna.
*/
function RTSMSummaryLine(props) {
@@ -39,8 +38,8 @@ function RTSMSummaryLine(props) {
);
}
-/*
- * RTSMLines: create summary line + expandable data rows
+/**
+ * RTSMRows: create summary line + expandable data rows
*/
class RTSMRows extends Component {
diff --git a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/ComponentType/RTSMRows/styles.module.css b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/RTSMRows/styles.module.css
similarity index 100%
rename from LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/ComponentType/RTSMRows/styles.module.css
rename to LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/RTSMRows/styles.module.css
diff --git a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/ComponentType/RTSMRows/styles.module.scss b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/RTSMRows/styles.module.scss
similarity index 100%
rename from LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/ComponentType/RTSMRows/styles.module.scss
rename to LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/RTSMRows/styles.module.scss
diff --git a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/index.js b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/index.js
index 9f85f95454f..b9b2272f037 100644
--- a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/index.js
+++ b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/components/StationTestView/index.js
@@ -11,11 +11,10 @@ import {
} from 'reactstrap';
import AutoLoadWrapper from 'components/AutoLoadWrapper'
import * as LOFARDefinitions from 'utils/LOFARDefinitions'
-import FillHeightDiv from 'components/FillHeightDiv';
+import FillViewportHeightDiv from 'components/FillViewportHeightDiv';
import ComponentType from './ComponentType';
// CSS
-//import './StationOverview.css';
import styles from './styles.module.scss';
@@ -92,7 +91,7 @@ class StationTestViewC extends Component {
)
}
</Nav>
- <FillHeightDiv className="border-right">
+ <FillViewportHeightDiv className="border-right">
{ ({height}) => (
<TabContent activeTab={this.state.activeTab}>
{
@@ -108,7 +107,7 @@ class StationTestViewC extends Component {
)}
</TabContent>
)}
- </FillHeightDiv>
+ </FillViewportHeightDiv>
</div>);
}
diff --git a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/index.js b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/index.js
index d43050b541e..0fac2c49260 100644
--- a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/index.js
+++ b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/StationOverviewPage/index.js
@@ -3,7 +3,7 @@ import {connect} from "react-redux";
import {Alert, Container, Row, Col} from 'reactstrap';
import moment from 'moment';
-import Header from 'components/Header'
+import NavigationBar from 'components/NavigationBar'
import StationTestView from './components/StationTestView';
import StationTestChildView from './components/StationTestChildView';
import { composeQueryString } from 'utils/utils.js';
@@ -83,7 +83,7 @@ class StationOverviewPageC extends Component {
return (
<React.Fragment>
- <Header active_page={this.props.location} />
+ <NavigationBar active_page={this.props.location} />
<Toolbar>
<StationAutoComplete />
<TestTypeSelector />
diff --git a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/TilesPage/components/AntennaErrorDetails/index.js b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/TilesPage/components/AntennaErrorDetails/index.js
index e4640967316..427817033c6 100644
--- a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/TilesPage/components/AntennaErrorDetails/index.js
+++ b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/TilesPage/components/AntennaErrorDetails/index.js
@@ -18,7 +18,7 @@ import {pinAntennaError, selectAntennaError} from 'redux/actions/antennaOverview
import {LOFARTESTS} from 'utils/LOFARDefinitions';
import {datetime_format} from 'utils/constants';
import {connect} from "react-redux";
-import PictureWithModal from 'components/PictureWithModal'
+import EnlargeableImage from 'components/EnlargeableImage'
// CSS
import styles from './styles.module.scss'
@@ -127,7 +127,7 @@ class AntennaErrorDetailsC extends Component {
</Row>
</Col>
<Col md="8">
- <PictureWithModal url={RTSMPerPolarization.url} />
+ <EnlargeableImage url={RTSMPerPolarization.url} />
</Col>
</Row>
</Container>
diff --git a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/TilesPage/components/AntennaView/AntennaErrorRow/index.js b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/TilesPage/components/AntennaView/AntennaErrorRow/index.js
index ce2c6809d71..96da2be1fbd 100644
--- a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/TilesPage/components/AntennaView/AntennaErrorRow/index.js
+++ b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/TilesPage/components/AntennaView/AntennaErrorRow/index.js
@@ -10,7 +10,6 @@ import {renderDateRange} from 'utils/utils';
import GenericStatusTd from '../GenericStatusTd'
// CSS
-//import styles from './styles.module.scss'
import rtsmStyles from 'themes/rtsm_collapsable.module.scss';
diff --git a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/TilesPage/components/AntennaView/GenericStatusTd/index.js b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/TilesPage/components/AntennaView/GenericStatusTd/index.js
index 91cf5407741..f26b47acb9a 100644
--- a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/TilesPage/components/AntennaView/GenericStatusTd/index.js
+++ b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/TilesPage/components/AntennaView/GenericStatusTd/index.js
@@ -9,6 +9,16 @@ import {selectAntennaError, pinAntennaError} from 'redux/actions/antennaOverview
import styles from './styles.module.scss';
+/**
+ * GenericStatusTd; render a <td> showing the status for an error. Show the error
+ * details in the detail panel on the right on mouse hover.
+ *
+ * @prop {bool} isGood - indicates if this item has errors
+ * @prop {bool} isPinned - indicates if this item is pinned in the child panel, if so highlight it
+ * @prop {object} data - the data object
+ * @prop {function} pinAntennaError - handler to pin this item
+ * @prop {function} selectAntennaError - mouseOver handler
+ */
class GenericStatusTdC extends Component {
mouseOver = () => {
diff --git a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/TilesPage/components/AntennaView/index.js b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/TilesPage/components/AntennaView/index.js
index 7669cdad607..d829d76e513 100644
--- a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/TilesPage/components/AntennaView/index.js
+++ b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/TilesPage/components/AntennaView/index.js
@@ -6,15 +6,22 @@ import ReactTableContainer from 'react-table-container';
import AutoLoadWrapper from 'components/AutoLoadWrapper';
import {connect} from 'react-redux';
import {componentErrorTypes} from "utils/constants.js";
-import FillHeightDiv from 'components/FillHeightDiv';
+import FillViewportHeightDiv from 'components/FillViewportHeightDiv';
import AntennaErrorRow from './AntennaErrorRow'
// CSS
import styles from './styles.module.scss';
-
-class AntennaViewC extends Component {
+/**
+ * AntennaTable: component with a chronological table of station test and RTSM
+ * results for a selected antenna.
+ *
+ * @prop {object} data - the data object
+ * @prop {array} errorTypes - array of all error types (from appInitData reducer)
+ * @prop {integer} height - height in pixels of the containing <div>
+ */
+class AntennaTable extends Component {
renderHeader() {
const errors_columns = this.props.errorTypes.map((error_type, key) => {
@@ -58,7 +65,7 @@ class AntennaViewC extends Component {
renderBody() {
if (this.props.data.hasOwnProperty('errors')) {
- let groupedData = AntennaViewC.groupData(this.props.data.errors);
+ let groupedData = AntennaTable.groupData(this.props.data.errors);
return groupedData.map((test, id) => <AntennaErrorRow key={id} data={test} update={this.updateIfContentChanges}/>);
}
@@ -79,20 +86,25 @@ class AntennaViewC extends Component {
}
}
-const AntennaViewContent = function(props){
+/**
+ * AntennaViewC; antenna view component to display the test results for a selected antenna.
+ *
+ * It gets the props from the mainFilters and appInitData reducers.
+ */
+const AntennaViewC = function(props){
return (
- <FillHeightDiv className="border-right">
- { ({height}) => <AntennaViewC {...props} height={height} />}
- </FillHeightDiv>
+ <FillViewportHeightDiv className="border-right">
+ { ({height}) => <AntennaTable {...props} height={height} />}
+ </FillViewportHeightDiv>
)
}
-const AntennaViewController = connect(state => {
+const AntennaView = AutoLoadWrapper( connect(state => {
return {
...state.mainFilters,
...state.appInitData
};
-})(AntennaViewContent);
-const AntennaView = AutoLoadWrapper(AntennaViewController);
+})(AntennaViewC) );
+
export default AntennaView;
diff --git a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/TilesPage/index.js b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/TilesPage/index.js
index 055b1884b24..3e9b64346f7 100644
--- a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/TilesPage/index.js
+++ b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/pages/TilesPage/index.js
@@ -1,5 +1,5 @@
import React, { Component } from 'react';
-import Header from 'components/Header'
+import NavigationBar from 'components/NavigationBar'
import moment from 'moment'
import {connect} from "react-redux";
import { Toolbar, StationAutoComplete, DateRangeSelector, TestTypeSelector, AntennaTypeSelector, AntennaIdSelector } from 'components/Toolbar'
@@ -48,7 +48,7 @@ class TilesPageC extends Component {
return (
<div>
- <Header active_page={this.props.location} />
+ <NavigationBar active_page={this.props.location} />
<Toolbar>
<StationAutoComplete />
<AntennaTypeSelector />
diff --git a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/redux/reducers/stationOverviewPageReducers.js b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/redux/reducers/stationOverviewPageReducers.js
index 75d9e46d994..f2994bcac1c 100644
--- a/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/redux/reducers/stationOverviewPageReducers.js
+++ b/LCU/Maintenance/MDB_WebView/maintenancedb_view/src/redux/reducers/stationOverviewPageReducers.js
@@ -3,7 +3,6 @@ import {
UNPIN_CHILD_PANEL_DATA
} from '../actions/stationOverviewPageActions.js'
-//import { SET_STATION } from "../actions/mainFiltersActions";
import { LOCATION_CHANGE } from "connected-react-router";
const initialState = {
--
GitLab