Upgrade to Bootstrap v5

[BenjaminCharmes]

Closes #32:

• New <button /> class used to close Modal
• Replace ml-2 (doesn't exist in Bootstrap v5) by gap-2 (d-flex) for DynamicDataTableButtons (could also use me-2 from bootstrap instead) (Bootstrap left and right replaced by start and end)
• I had color: black to FormattedItemName because badge light display text in white now
• Edit every Modal (Item, Batch, Collection, Equipment ...) to stay the same
• Edit every datablock (and also Bokeh block with querySelector)
• and more ...

Closes #620:

• CompactConstituentTable.vue is now responsive.
• The EditPage and CollectionPage navbar now use a dropdown on small screen
• DynamicDataTabeButtons also use a dropdown on small screen
• and more ...

Cypress:

• Improving tests using Modal and vue-select
• Add a few utility functions
• Lot of refactoring
• There are still a lot of cy.wait() that could (should?) be removed (I haven't removed them, waiting feedback).

[codecov]

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 71.09%. Comparing base (e8b7c5a) to head (4ef783e).
Report is 10 commits behind head on main.

Additional details and impacted files

@@           Coverage Diff           @@
##             main    #1028   +/-   ##
=======================================
  Coverage   71.09%   71.09%           
=======================================
  Files          65       65           
  Lines        4300     4300           
=======================================
  Hits         3057     3057           
  Misses       1243     1243           

Files with missing lines	Coverage Δ
pydatalab/src/pydatalab/bokeh_plots.py	81.81% <100.00%> (ø)

🚀 New features to boost your workflow:

• ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

[cypress]

datalab    Run #3362

Run Properties:   Passed #3362  •  92e8a06b7f ℹ️: Merge 4ef783ec6825c2a9d9385a4ffc7d4a482d013a3f into e8b7c5a7d9a67867ff8d52781906...

Project	datalab
Branch Review	bc/update-bootstrap5
Run status	Passed #3362
Run duration	08m 45s
Commit	92e8a06b7f ℹ️: Merge 4ef783ec6825c2a9d9385a4ffc7d4a482d013a3f into e8b7c5a7d9a67867ff8d52781906...
Committer	Ben Charmes
View all properties for this run ↗︎

---

Test results
Failures	0
Flaky	0
Pending	0
Skipped	0
Passing	504
View all changes introduced in this branch ↗︎

[ml-evs]

I've built and played around with the new version and only have a few minor comments of mine (and we can go through yours) -- just a comment below about the deps!

[BenjaminCharmes]

Everything works! 🎉 I still need to refactor the e2e tests a bit (I added a lot of functions) and clean things up, and then the PR will be ready.

[ml-evs]

I'm going to collect general comments as I explore the UI without trying to be mega picky, and without referencing any particular changes. These may also be issues present in the existing UI. I'll tag them as 🔴 (needs fixing), 🟡 (needs discussion) and 🟢 (probably fine or an existing issue, just noting the change).

• 🟢 button-left on the DynamicDataTable seems to fill to a different height to button-right (38px vs 42px for me). There is now uniformity between e.g., the search bar and the multi-select, which wasn't the case before (i.e., a good thing!)
• 🟡 / 🟢 The button-left and button-right groups still do not scale very nicely in small windows
• 🟢 item badges have slightly more padding now (not necessarily bad but might need to be reduced slightly as it decreases the font size)
• 🔴 submit button in modal has new (worse, IMO) colour -- black on rich blue rather than white on a darkish teal
• 🔴 Router links (e.g., About | Samples | Collections) are now underlined even when they are not selected
• 🔴 / 🟡 Bokeh plots in some blocks like XRD are now much wider by default (maybe too large), though previously I think this was hardcoded on the Python side which is also not optimal
• 🟡 The margin for the block names in the add a block menu is quite a lot larger
• 🔴 Synthesis information tables now reactive (great!) but the unit column is now too large and it gets broken by samples with long names as it no longer wraps (see screenshot) -- this actually breaks all the rows above it too.
  

[BenjaminCharmes]

I've made most of the changes asked, whenever you have time to take a look @ml-evs .
And awaiting discussion on the others.

[ml-evs]

Great work @BenjaminCharmes, this is looking really nice from my side! I'm going to approve this now, but we should hold off merging it until the 0.5.3 release is out. Then this can be the first PR merged for the 0.6.0 series.