diff --git a/demo/beamstop.xml b/demo/beamstop.xml
index 3fd47819d..2487d28f4 100644
--- a/demo/beamstop.xml
+++ b/demo/beamstop.xml
@@ -1,5 +1,5 @@
 <object class="ExporterNStateMockup">
   <username>beamstop</username>
-  <values>{"OUT": "OFF", "IN": "BEAM"}</values>
+  <values>{"IN": "BEAM", "OUT": "OFF"}</values>
   <use_hwstate>True</use_hwstate>
 </object>
diff --git a/demo/mxcube-web/ui.yaml b/demo/mxcube-web/ui.yaml
index 672b8bda8..cb164f485 100644
--- a/demo/mxcube-web/ui.yaml
+++ b/demo/mxcube-web/ui.yaml
@@ -100,9 +100,9 @@ beamline_setup:
   id: beamline_setup
   components:
     - label: Beamstop
-      attribute: beamstop
+      attribute: diffractometer.beamstop
     - label: Capillary
-      attribute: capillary
+      attribute: diffractometer.capillary
     - label: Fast Shutter
       attribute: fast_shutter
     - label: Safety shutter
diff --git a/ui/src/components/MotorInput/BaseMotorInput.jsx b/ui/src/components/MotorInput/BaseMotorInput.jsx
index fb801e6a6..6b85da13a 100644
--- a/ui/src/components/MotorInput/BaseMotorInput.jsx
+++ b/ui/src/components/MotorInput/BaseMotorInput.jsx
@@ -62,7 +62,7 @@ function BaseMotorInput(props) {
     state === HW_STATE.OFF;
 
   return (
-    <form noValidate onSubmit={handleSubmit}>
+    <form className="d-flex" noValidate onSubmit={handleSubmit}>
       <Form.Control
         className={className}
         style={style}
@@ -72,7 +72,7 @@ function BaseMotorInput(props) {
         max={max}
         min={min}
         disabled={disabled || !isReady}
-        data-testId={testId}
+        data-testid={testId}
         data-dirty={isEdited || undefined}
         data-busy={isBusy || undefined}
         data-warning={isWarning || undefined}
diff --git a/ui/src/components/MotorInput/OneAxisTranslationControl.jsx b/ui/src/components/MotorInput/OneAxisTranslationControl.jsx
index a1c840b51..d9e0bdb14 100644
--- a/ui/src/components/MotorInput/OneAxisTranslationControl.jsx
+++ b/ui/src/components/MotorInput/OneAxisTranslationControl.jsx
@@ -34,7 +34,7 @@ function OneAxisTranslationControl(props) {
         className={`${styles.input} rw-input`}
         style={{
           width: `${Number.parseFloat(precision) + 2}em`,
-          height: '2.1em',
+          height: 'auto',
           display: 'inline-block',
           marginLeft: '5px',
           marginRight: '5px',
diff --git a/ui/src/containers/BeamlineSetupContainer.jsx b/ui/src/containers/BeamlineSetupContainer.jsx
index 6983319be..415c4c0ff 100644
--- a/ui/src/containers/BeamlineSetupContainer.jsx
+++ b/ui/src/containers/BeamlineSetupContainer.jsx
@@ -9,7 +9,6 @@ import InOutSwitch from '../components/InOutSwitch/InOutSwitch';
 import DeviceState from '../components/DeviceState/DeviceState';
 import MachInfo from '../components/MachInfo/MachInfo';
 import OneAxisTranslationControl from '../components/MotorInput/OneAxisTranslationControl';
-import * as sampleViewActions from '../actions/sampleview'; // eslint-disable-line import/no-namespace
 
 import { find, filter } from 'lodash';
 
@@ -23,32 +22,27 @@ function BeamlineSetupContainer(props) {
     beamline,
     sampleChanger,
     sampleview,
-    sampleViewActions,
     uiproperties,
     setAttribute,
     stopBeamlineAction,
     sendCommand,
   } = props;
 
-  function handleSetAttribute(name, value) {
-    setAttribute(name, value);
-  }
-
   function renderBeamstopAlignmentOverlay() {
     const { hardwareObjects } = beamline;
     const motorInputList = [];
     let popover = null;
 
-    const motor = hardwareObjects.beamstop_alignemnt_x;
+    const motor = hardwareObjects['diffractometer.beamstop_distance'];
     const step = sampleview.motorSteps.beamstop_distance;
 
-    if (motor !== undefined && motor.state !== 0) {
+    if (motor) {
       motorInputList.push(
-        <div key={`bsao-${motor.name}`} style={{ padding: '0.5em' }}>
-          <p className="motor-name"> Beamstop distance: </p>
+        <div key={`bsao-${motor.name} d-flex`} style={{ padding: '0.5em' }}>
+          <p className="motor-name mb-1"> Beamstop distance:</p>
           <OneAxisTranslationControl
-            save={sampleViewActions.updateMotorPosition}
-            value={motor.position}
+            save={setAttribute}
+            value={motor.value}
             min={motor.limits[0]}
             max={motor.limits[1]}
             step={step}
@@ -92,7 +86,7 @@ function BeamlineSetupContainer(props) {
                     labelText={uiprop.label}
                     pkey={key}
                     value={beamline.hardwareObjects[key].value}
-                    onSave={handleSetAttribute}
+                    onSave={setAttribute}
                     optionsOverlay={renderBeamstopAlignmentOverlay()}
                   />
                 </Nav.Item>,
@@ -108,7 +102,7 @@ function BeamlineSetupContainer(props) {
                     labelText={uiprop.label}
                     pkey={key}
                     value={beamline.hardwareObjects[key].value}
-                    onSave={handleSetAttribute}
+                    onSave={setAttribute}
                   />
                 </Nav.Item>,
               );
@@ -164,7 +158,7 @@ function BeamlineSetupContainer(props) {
             format={uiprop.format}
             precision={uiprop.precision}
             suffix={uiprop.suffix}
-            onSave={(value) => handleSetAttribute(uiprop.attribute, value)}
+            onSave={(value) => setAttribute(uiprop.attribute, value)}
             onCancel={() => stopBeamlineAction(uiprop.attribute)}
           />
         </td>,
@@ -268,7 +262,6 @@ function mapStateToProps(state) {
 
 function mapDispatchToProps(dispatch) {
   return {
-    sampleViewActions: bindActionCreators(sampleViewActions, dispatch),
     setAttribute: bindActionCreators(setAttribute, dispatch),
     sendCommand: bindActionCreators(sendCommand, dispatch),
     stopBeamlineAction: bindActionCreators(stopBeamlineAction, dispatch),