JIRA ticket: LIMS-1753

Summary:

When viewing a plate (eg https://ispyb.diamond.ac.uk/containers/cid/338352 ) it would be nice to click a button to show all the formulatrix images next to each other, as a long vertical list of full size images, The button could be next to the Inspections dropdown as it would show all images from a particular inspection.

Changes:

• Edit backend so that requesting images for a plate also gives the location for each, and can be sorted by location
• Add a See All Images button next to the inspections dropdown
• Add a dialog that opens, showing all the images from that inspection, and their location (in order)
• Fix callback logic in xhrimage.js to allow loading of images after dialog is created
• Use IntersectionObserver to lazy load the images
• Destroy the dialog on closure to ensure the observers are disconnected

To test:

• Go to a plate inspection page, eg /containers/cid/341680, check there is a "See All Images" button next to the inspections dropdown
• Check it brings up a dialog displaying all 192 inspection images
• Check the images are loaded lazily as you scroll down
• Check that scrolling is disabled on the page behind the dialog
• Close the dialog using either the [x], the close button, or the escape key, check scrolling is re-enabled
• Check changing the inspection dropdown gives different images (check network requests for this)
• Check other dialogs are unaffected, eg the Add Inspection dialog still allows scrolling