Creating a generic, extensible data block component in Vue

[ml-evs]

cc @BenjaminCharmes -- assigning you to start thinking about this idea, rather than implementing it all yourself!

Essentially, it would be good to build a JS design language for generic blocks, i.e., provide many options to enable multi-file upload, passing arbitrary parameters requested by the schema (or user-specific extensions), handle static plots vs interactive Bokeh plots, and other block interactions that we can reuse everywhere. The Python API can then simply report which features a block implementation needs/can use, so we avoid needing to write a separate vue component per block type.

[ml-evs]

Narrowing this down a bit to a specific task:

let's make a new block abstraction based on DataBlockBase, that can accept a list of properties and their defined types, labels etc.

Example XRD block:

go from hardcoded component in resources.js XRDBlock to DataBlockUI(properties={"wavelength": {"type": "float", "label": "Wavelength (Angstrom)", "default": 1.54}).

Eventually we can return this "block UI schema" from the API and try to generate reasonable block components without the plugin developer needing to write much javascript.

[ml-evs]

Revisiting this: lets try to use/improve the metadata viewer in NMR in the base bokeh block to render any data that appears in the the metadata field of a block response (#1396) -- during this process, try to migrate more blocks away from custom components.

Next step, then propagate switchable FileMultiSelectDropdown component to all base blocks, and update Python code where possible to enable multi-file stitching vs comparison where appropriate.