diff --git a/ui/src/containers/BeamlineActionsContainer.jsx b/ui/src/containers/BeamlineActionsContainer.jsx
index 7b1174f8f..6b08ee6f8 100644
--- a/ui/src/containers/BeamlineActionsContainer.jsx
+++ b/ui/src/containers/BeamlineActionsContainer.jsx
@@ -1,18 +1,14 @@
 import React from 'react';
 import { connect } from 'react-redux';
 import { bindActionCreators } from 'redux';
-import { startAction,
+import {
+  startAction,
   stopAction,
   showActionOutput,
   hideActionOutput,
-  setArgumentValue } from '../actions/beamlineActions';
-import { Row,
-  Col,
-  Modal,
-  Dropdown,
-  Button,
-  Form,
-  Card} from 'react-bootstrap';
+  setArgumentValue,
+} from '../actions/beamlineActions';
+import { Row, Col, Modal, Dropdown, Button, Form, Card } from 'react-bootstrap';
 import BeamlineActionControl from '../components/BeamlineActions/BeamlineActionControl';
 import Plot1D from '../components/Plot1D';
 import { RUNNING } from '../constants';
@@ -76,109 +72,137 @@ class BeamlineActionsContainer extends React.Component {
     const defaultDialogPosition = { x: -100, y: 100 };
 
     return (
-      <Row>
-        <Col xs={12}>
-          <Dropdown
-              title="Beamline Actions"
-              id="beamline-actions-dropdown"
-              variant="outline-secondary"
-              autoClose="outside"
-            >
-              <Dropdown.Toggle variant="outline-secondary" id="beamline-actions-dropdown">
-                Beamline Actions
-              </Dropdown.Toggle>
-                <Dropdown.Menu>
-                  {this.props.actionsList.map((cmd, i) => {
-                    const cmdName = cmd.name;
-                    const cmdUsername = cmd.username;
-                    const cmdState = cmd.state;
-                    let disabled = false;
-                    if (currentActionRunning && (currentActionName !== cmdName)) {
-                      disabled = true;
-                    }
-
-                    return (
-                        <Dropdown.Item
-                          style={{width: '250px' }}
-                          className='d-flex justify-content-between align-items-start'
-                          key={i}
-                        >
-                          <div className="ms-2 me-auto">
-                            <div className="fw-bold">{cmdUsername}</div>
-                          </div>
-                          <BeamlineActionControl cmdName={cmdName}
-                            start={this.startAction}
-                            stop={this.stopAction}
-                            showOutput={this.showOutput}
-                            state={cmdState}
-                            disabled={disabled}
-                            arguments={cmd.arguments}
-                            type={cmd.type}
-                            data={cmd.data}
-                          />
-                        </Dropdown.Item>
-                      );
-                  })}
-              </Dropdown.Menu>
-            </Dropdown>
-        </Col>
-        <DraggableModal id="beamlineActionOutput"
+      <>
+        <Dropdown
+          title="Beamline Actions"
+          id="beamline-actions-dropdown"
+          variant="outline-secondary"
+          autoClose="outside"
+        >
+          <Dropdown.Toggle
+            variant="outline-secondary"
+            id="beamline-actions-dropdown"
+          >
+            Beamline Actions
+          </Dropdown.Toggle>
+          <Dropdown.Menu>
+            {this.props.actionsList.map((cmd, i) => {
+              const cmdName = cmd.name;
+              const cmdUsername = cmd.username;
+              const cmdState = cmd.state;
+              let disabled = false;
+              if (currentActionRunning && currentActionName !== cmdName) {
+                disabled = true;
+              }
+
+              return (
+                <Dropdown.Item
+                  style={{ width: '250px' }}
+                  className="d-flex justify-content-between align-items-start"
+                  key={i}
+                >
+                  <div className="ms-2 me-auto">
+                    <div className="fw-bold">{cmdUsername}</div>
+                  </div>
+                  <BeamlineActionControl
+                    cmdName={cmdName}
+                    start={this.startAction}
+                    stop={this.stopAction}
+                    showOutput={this.showOutput}
+                    state={cmdState}
+                    disabled={disabled}
+                    arguments={cmd.arguments}
+                    type={cmd.type}
+                    data={cmd.data}
+                  />
+                </Dropdown.Item>
+              );
+            })}
+          </Dropdown.Menu>
+        </Dropdown>
+        <DraggableModal
+          id="beamlineActionOutput"
           show={!!this.props.currentAction.show}
           onHide={this.hideOutput}
           defaultpos={defaultDialogPosition}
         >
           <Modal.Header>
-            <Modal.Title>
-              {this.props.currentAction.username}
-            </Modal.Title>
-            </Modal.Header>
-            <Modal.Body className='d-flex' style={{ height: '500px', overflowY: 'auto' }}>
-              <Row >
-                { this.props.currentAction.arguments.map((arg, i) =>
+            <Modal.Title>{this.props.currentAction.username}</Modal.Title>
+          </Modal.Header>
+          <Modal.Body
+            className="d-flex"
+            style={{ height: '500px', overflowY: 'auto' }}
+          >
+            <Row>
+              {this.props.currentAction.arguments.map((arg, i) => (
                 <>
-                    <Col className='mt-2' xs={3} style={{ whiteSpace: 'nowrap' }} component={Form.Label}>{arg.name}</Col>
-                    <Col xs={3}>
-                      <Form.Control
-                        label={arg.name}
-                        type="text"
-                        value={arg.value}
-                        disabled={currentActionRunning}
-                        onChange={(e) => {
-                          this.props.setArgumentValue(currentActionName,
-                            i,
-                            e.target.value);
-                        }}
-                      />
-                    </Col>
-                    </>
-                  )
-                }
-                <Col>
-                  { currentActionRunning ?
-                    <Button variant="danger"
-                      onClick={ () => { this.stopAction(currentActionName); } }
-                    >
-                      Abort
-                    </Button> : <Button disabled={currentActionRunning}
-                      variant="primary"
-                      onClick={ () => { this.startAction(currentActionName); } }
-                    >
-                      Run
-                    </Button>
-                  }
+                  <Col
+                    className="mt-2"
+                    xs={3}
+                    style={{ whiteSpace: 'nowrap' }}
+                    component={Form.Label}
+                  >
+                    {arg.name}
                   </Col>
-                </Row>
-             <hr />
-             <Plot1D displayedPlotCallback={this.newPlotDisplayed}
-               plotId={this.plotIdByAction[currentActionName]} autoNext={currentActionRunning}
-             />
-             { this.props.currentAction.messages.length > 0 ? (<Card>
-               {this.props.currentAction.messages.map(message => <p>{message.message}</p>)}
-             </Card>) : '' }
+                  <Col xs={3}>
+                    <Form.Control
+                      label={arg.name}
+                      type="text"
+                      value={arg.value}
+                      disabled={currentActionRunning}
+                      onChange={(e) => {
+                        this.props.setArgumentValue(
+                          currentActionName,
+                          i,
+                          e.target.value
+                        );
+                      }}
+                    />
+                  </Col>
+                </>
+              ))}
+              <Col>
+                {currentActionRunning ? (
+                  <Button
+                    variant="danger"
+                    onClick={() => {
+                      this.stopAction(currentActionName);
+                    }}
+                  >
+                    Abort
+                  </Button>
+                ) : (
+                  <Button
+                    disabled={currentActionRunning}
+                    variant="primary"
+                    onClick={() => {
+                      this.startAction(currentActionName);
+                    }}
+                  >
+                    Run
+                  </Button>
+                )}
+              </Col>
+            </Row>
+            <hr />
+            <Plot1D
+              displayedPlotCallback={this.newPlotDisplayed}
+              plotId={this.plotIdByAction[currentActionName]}
+              autoNext={currentActionRunning}
+            />
+            {this.props.currentAction.messages.length > 0 ? (
+              <Card>
+                {this.props.currentAction.messages.map((message) => (
+                  <p>{message.message}</p>
+                ))}
+              </Card>
+            ) : (
+              ''
+            )}
           </Modal.Body>
           <Modal.Footer>
             <Button
-              variant='outline-secondary'
+              variant="outline-secondary"
               onClick={this.hideOutput}
               disabled={currentActionRunning}
             >
@@ -186,14 +210,14 @@ class BeamlineActionsContainer extends React.Component {
             </Button>
           </Modal.Footer>
         </DraggableModal>
-      </Row>
+      </>
     );
   }
 }
 
 function mapStateToProps(state) {
   return {
-    currentAction: state.beamline.currentBeamlineAction
+    currentAction: state.beamline.currentBeamlineAction,
   };
 }
 
@@ -203,7 +227,7 @@ function mapDispatchToProps(dispatch) {
     stopAction: bindActionCreators(stopAction, dispatch),
     showOutput: bindActionCreators(showActionOutput, dispatch),
     hideOutput: bindActionCreators(hideActionOutput, dispatch),
-    setArgumentValue: bindActionCreators(setArgumentValue, dispatch)
+    setArgumentValue: bindActionCreators(setArgumentValue, dispatch),
   };
 }
 
@@ -211,4 +235,3 @@ export default connect(
   mapStateToProps,
   mapDispatchToProps
 )(BeamlineActionsContainer);
-
diff --git a/ui/src/containers/BeamlineSetupContainer.jsx b/ui/src/containers/BeamlineSetupContainer.jsx
index 7ceda9e35..cbbe199a5 100644
--- a/ui/src/containers/BeamlineSetupContainer.jsx
+++ b/ui/src/containers/BeamlineSetupContainer.jsx
@@ -17,7 +17,7 @@ import { find, filter } from 'lodash';
 import {
   sendGetAllhardwareObjects,
   sendSetAttribute,
-  sendAbortCurrentAction
+  sendAbortCurrentAction,
 } from '../actions/beamline';
 
 import { sendCommand } from '../actions/sampleChanger';
@@ -53,13 +53,14 @@ class BeamlineSetupContainer extends React.Component {
     const step = this.props.sampleview.motorSteps.beamstop_distance;
 
     if (motor !== undefined && motor.state !== 0) {
-      motorInputList.push((
+      motorInputList.push(
         <div key={`bsao-${motor.name}`} style={{ padding: '0.5em' }}>
           <p className="motor-name"> Beamstop distance: </p>
           <OneAxisTranslationControl
             save={this.props.sampleViewActions.sendMotorPosition}
             value={motor.position}
-            min={motor.limits[0]} max={motor.limits[1]}
+            min={motor.limits[0]}
+            max={motor.limits[1]}
             step={step}
             motorName={motor.name}
             suffix="mm"
@@ -68,17 +69,16 @@ class BeamlineSetupContainer extends React.Component {
             disabled={this.props.beamline.motorInputDisable}
           />
         </div>
-      ));
+      );
     }
 
     if (motorInputList.length > 0) {
-      popover = (<Popover>{motorInputList}</Popover>);
+      popover = <Popover>{motorInputList}</Popover>;
     }
 
     return popover;
   }
 
-
   createActuatorComponent() {
     const acts = [];
 
@@ -95,8 +95,12 @@ class BeamlineSetupContainer extends React.Component {
               acts.push(
                 <Nav.Item key={key} className="ms-3">
                   <InOutSwitch
-                    onText={this.props.beamline.hardwareObjects[key].commands[0]}
-                    offText={this.props.beamline.hardwareObjects[key].commands[1]}
+                    onText={
+                      this.props.beamline.hardwareObjects[key].commands[0]
+                    }
+                    offText={
+                      this.props.beamline.hardwareObjects[key].commands[1]
+                    }
                     labelText={uiprop.label}
                     pkey={key}
                     data={this.props.beamline.hardwareObjects[key]}
@@ -109,8 +113,12 @@ class BeamlineSetupContainer extends React.Component {
               acts.push(
                 <Nav.Item key={key} className="ms-3">
                   <InOutSwitch
-                    onText={this.props.beamline.hardwareObjects[key].commands[0]}
-                    offText={this.props.beamline.hardwareObjects[key].commands[1]}
+                    onText={
+                      this.props.beamline.hardwareObjects[key].commands[0]
+                    }
+                    offText={
+                      this.props.beamline.hardwareObjects[key].commands[1]
+                    }
                     labelText={uiprop.label}
                     pkey={key}
                     data={this.props.beamline.hardwareObjects[key]}
@@ -126,7 +134,6 @@ class BeamlineSetupContainer extends React.Component {
     return acts;
   }
 
-
   dmState() {
     return this.props.beamline.hardwareObjects.diffractometer.state;
   }
@@ -135,42 +142,50 @@ class BeamlineSetupContainer extends React.Component {
     const components = [];
 
     for (const uiprop of uiprop_list) {
-      const beamline_attribute = this.props.beamline.hardwareObjects[uiprop.attribute];
+      const beamline_attribute =
+        this.props.beamline.hardwareObjects[uiprop.attribute];
 
       components.push(
-        <td key={`bs-name-${uiprop.label}`} className="py-1 ps-3 pe-2 align-middle">
-          <span className='me-1'>{uiprop.label}:</span>
-        </td>);
+        <td
+          key={`bs-name-${uiprop.label}`}
+          className="py-1 ps-3 pe-2 align-middle"
+        >
+          <span className="me-1">{uiprop.label}:</span>
+        </td>
+      );
       components.push(
         <td
-        key={`bs-val-${uiprop.label}`}
-        className='pe-3'
-        style={{
-          fontWeight: 'bold',
-          border: '0px',
-          borderRight: uiprop_list.length != uiprop_list.indexOf(uiprop) + 1 ? '1px solid #ddd': '',
-          padding: '0em'}}>
-          { beamline_attribute.readonly ?
-            (<LabeledValue
+          key={`bs-val-${uiprop.label}`}
+          className="pe-3 align-middle"
+          style={{
+            fontWeight: 'bold',
+            borderRight:
+              uiprop_list.length != uiprop_list.indexOf(uiprop) + 1
+                ? '1px solid #ddd'
+                : '',
+          }}
+        >
+          {beamline_attribute.readonly ? (
+            <LabeledValue
               suffix={uiprop.suffix}
               precision={uiprop.precision}
               format={uiprop.format || ''}
               name=""
               value={beamline_attribute.value}
               level="light"
-            />)
-            :
-            (<PopInput
+            />
+          ) : (
+            <PopInput
               name=""
-              pkey= {uiprop.attribute}
-              suffix={uiprop.suffix }
-              precision={ uiprop.precision }
+              pkey={uiprop.attribute}
+              suffix={uiprop.suffix}
+              precision={uiprop.precision}
               inputSize="10"
-              data={ beamline_attribute }
-              onSave= { this.setAttribute }
-              onCancel= { this.onCancelHandler }
-            />)
-          }
+              data={beamline_attribute}
+              onSave={this.setAttribute}
+              onCancel={this.onCancelHandler}
+            />
+          )}
         </td>
       );
     }
@@ -185,49 +200,47 @@ class BeamlineSetupContainer extends React.Component {
       return null;
     }
 
-
     const uiprops = this.props.uiproperties.beamline_setup.components;
-    const uiprop_list = filter(uiprops, (o) =>
-    o.value_type === 'MOTOR' || o.value_type === 'ACTUATOR'
+    const uiprop_list = filter(
+      uiprops,
+      (o) => o.value_type === 'MOTOR' || o.value_type === 'ACTUATOR'
     );
 
     return (
-    <Navbar
-      style={{
-        background: '#FAFAFA',
-        borderBottom: '1px solid lightgray',
-        paddingBottom: '0em',
-      }}
-      className="beamline-status ps-3 pe-3"
-      id="bmstatus"
-      bg='light'
-      expand="lg"
-    >
+      <Navbar className="beamline-status" id="bmstatus" expand="lg">
         <Navbar.Toggle aria-controls="basic-navbar-nav" />
         <Navbar.Collapse id="basic-navbar-nav">
           <Nav className="d-flex  me-auto my-2 my-lg-0">
             <Nav.Item className=" d-flex justify-content-start">
               <span className="blstatus-item" style={{ marginRight: '1em' }}>
-                <BeamlineActions actionsList={this.props.beamline.beamlineActionsList} />
+                <BeamlineActions
+                  actionsList={this.props.beamline.beamlineActionsList}
+                />
               </span>
             </Nav.Item>
           </Nav>
           <Nav className="me-auto my-2 my-lg-0">
-            <Nav.Item className="d-flex justify-content-start" >
+            <Nav.Item className="d-flex justify-content-start">
               <Table
                 borderless
                 responsive
                 style={{
-                  margin: '0px', fontWeight: 'bold',
-                  paddingLeft: '7em', paddingRight: '7em'
+                  margin: 0,
+                  fontWeight: 'bold',
+                  paddingLeft: '7em',
+                  paddingRight: '7em',
                 }}
               >
                 <tbody>
                   <tr>
-                    {this.render_table_row(uiprop_list.slice(0, (uiprop_list.length / 2).toFixed(0)))}
+                    {this.render_table_row(
+                      uiprop_list.slice(0, (uiprop_list.length / 2).toFixed(0))
+                    )}
                   </tr>
                   <tr>
-                    {this.render_table_row(uiprop_list.slice((uiprop_list.length / 2).toFixed(0)))}
+                    {this.render_table_row(
+                      uiprop_list.slice((uiprop_list.length / 2).toFixed(0))
+                    )}
                     {/* <td style={{ border: '0px', borderLeft: '1px solid #ddd', paddingLeft: '1em' }} />
                     <td style={{ border: '0px' }} /> */}
                   </tr>
@@ -239,7 +252,9 @@ class BeamlineSetupContainer extends React.Component {
             <Nav.Item>
               <DeviceState
                 labelText="Detector"
-                data={this.props.beamline.hardwareObjects.detector.state.acq_satus}
+                data={
+                  this.props.beamline.hardwareObjects.detector.state.acq_satus
+                }
               />
             </Nav.Item>
           </Nav>
@@ -252,19 +267,17 @@ class BeamlineSetupContainer extends React.Component {
               />
             </Nav.Item>
           </Nav>
-          <Nav className="me-3">
-            {this.createActuatorComponent()}
-          </Nav>
+          <Nav className="me-3">{this.createActuatorComponent()}</Nav>
           <Nav className="">
             <Nav.Item>
               <span className="blstatus-item">
-                {this.props.beamline.hardwareObjects.machine_info ?
+                {this.props.beamline.hardwareObjects.machine_info ? (
                   <MachInfo
-                    info={this.props.beamline.hardwareObjects.machine_info.value}
+                    info={
+                      this.props.beamline.hardwareObjects.machine_info.value
+                    }
                   />
-                  :
-                  null
-                }
+                ) : null}
               </span>
             </Nav.Item>
           </Nav>
@@ -274,28 +287,28 @@ class BeamlineSetupContainer extends React.Component {
   }
 }
 
-
 function mapStateToProps(state) {
   return {
     uiproperties: state.uiproperties,
     beamline: state.beamline,
     sampleview: state.sampleview,
-    sampleChanger: state.sampleChanger
+    sampleChanger: state.sampleChanger,
   };
 }
 
-
 function mapDispatchToProps(dispatch) {
   return {
-    getAllhardwareObjects: bindActionCreators(sendGetAllhardwareObjects, dispatch),
+    getAllhardwareObjects: bindActionCreators(
+      sendGetAllhardwareObjects,
+      dispatch
+    ),
     sampleViewActions: bindActionCreators(SampleViewActions, dispatch),
     setAttribute: bindActionCreators(sendSetAttribute, dispatch),
     sendCommand: bindActionCreators(sendCommand, dispatch),
-    abortCurrentAction: bindActionCreators(sendAbortCurrentAction, dispatch)
+    abortCurrentAction: bindActionCreators(sendAbortCurrentAction, dispatch),
   };
 }
 
-
 export default connect(
   mapStateToProps,
   mapDispatchToProps