Focus control upstream

[meguiraun]

hi guys,

This is an attempt to bring Biomax's old focus control element into latest mxcube.

WIP because your input is needed on how we handle these kind of components, it technically works as it is.

• Added a new BeamFocus component, it currently has Biomax specific logic but i did not want to generalise too much too early
• Configurable "beam control" elements in the ui

[marcus-oscarsson]

Just a question, how is this control used, is to de-focus the beam to change the beam size ?

[meguiraun]

Just a question, how is this control used, is to de-focus the beam to change the beam size ?

The user selects a beam size appropriate for their crystal size, which corresponds to different beam (de)focus

[meguiraun]

I refactored few things here and there. In essence I added the beam definer information into the beamInfo info dict, and propagate it to the UI.

I based on the ID232 beam definer approach as NState hwobj, and adapted from my previous attempt, now "100x100" is one option in the definer object.

One thing that I have not solved is how to generalize the UI styling (see this ), any suggestion is welcome

I also created a new beam definer mockup:
mxcube/mxcubecore#872

[meguiraun]

I moved down into the hwobj the custom css styling.

please, have a look!

[axelboc]

Looking great! I've got lots of suggestions but don't feel like you have to resolve them — it's all coding style, nothing major.

[axelboc]

I feel like the logic in the render method of BeamDefinerInput would be much simpler if you passed this through the apertureList prop:

apertureList={this.props.sampleViewState.customStyling || this.props.sampleViewState.apertureList}

This way, you can have a single loop to create the optionList array (you may not even need this optionList array at all, since the loop below can be moved directly into the JSX):

const optionList = Object.entries(this.props.apertureList).map((key, value) => {
  // key is the label (e.g. "50x50")
  // value is either the same as the label or an object when `customStyling` is defined, so you can do:
  if (typeof value === 'object') {
    return { ... }; // or return a `<Dropdown.Item />` directly if you move the loop inside the JSX
  }
  return { ... }
});

[marcus-oscarsson]

Just a status check, where are we with this one @meguiraun ?