TODO

Edge case issues

The library we're useing (as far as I could see) has no mechanism for re-drawing the overlay on screen resize. This means that when you open the QR reader on a given screen size, the overlay will be calculated so that it fits nicely, but if you make the screen wider or narrower, it will overflow. One way to solve this would be to close the QR reader and reopen it on resize events, but I think that might cause noticable performance problems
Because of the way we're displaying the video stream on the window, we're losing some part of the video input, meaning we have to reduce the scannable area. This is usually fine, but using devices with maybe lower resolution, and on windows that are very thin, or very long, the QR code may have difficulty being read. This should only affect desktop, so it's probably not a big issue
I noticed that when I changed the device on my desktop (it only has one camera, but I changed the code to test the button more easily), the camera feed would flip horizontally. I could only reproduce this on desktop however, on mobile I had no flipping issues. Something to keep in mind maybe

There was a bug I left in from the full screen view (only noticed when testing on mobile), whereby the view wasn't scrollable, this was coming from ionic setting overflow: hidden on everything. I added an overflow: auto to the full screen mode