Show both parent and child relationships on Labware

[StephenHulme]

Closes a long outstanding bug-bear. Possibly improves #645. Dependent on https://github.com/sanger/General-Backlog-Items/issues/405

Changes proposed in this pull request

• Renames Children tab to Relatives
• Displays all immediate parents and childre with purpose, barcode, and state
• Provides easy navigation between relatives
• Removes code that was part of the previous solution
• Removes erroneously copied data-plate-view attribute

Before:

After:

Instructions for Reviewers

[All PRs] - Confirm PR template filled
[Feature Branches] - Review code
[Production Merges to main]
    - Check story numbers included
    - Check for debug code
    - Check version

[codecov[bot]]

Codecov Report

All modified and coverable lines are covered by tests :white_check_mark:

Project coverage is 91.12%. Comparing base (092d685) to head (39a76c7). Report is 103 commits behind head on develop.

Additional details and impacted files

```diff @@ Coverage Diff @@ ## develop #1641 +/- ## =========================================== + Coverage 90.82% 91.12% +0.29% =========================================== Files 359 366 +7 Lines 7423 7978 +555 =========================================== + Hits 6742 7270 +528 - Misses 681 708 +27 ``` | [Flag](https://app.codecov.io/gh/sanger/limber/pull/1641/flags?src=pr&el=flags&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=sanger) | Coverage Δ | | |---|---|---| | [javascript](https://app.codecov.io/gh/sanger/limber/pull/1641/flags?src=pr&el=flag&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=sanger) | `93.48% <ø> (-0.17%)` | :arrow_down: | | [pull_request](https://app.codecov.io/gh/sanger/limber/pull/1641/flags?src=pr&el=flag&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=sanger) | `90.76% <ø> (-0.07%)` | :arrow_down: | | [push](https://app.codecov.io/gh/sanger/limber/pull/1641/flags?src=pr&el=flag&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=sanger) | `90.79% <ø> (-0.04%)` | :arrow_down: | | [ruby](https://app.codecov.io/gh/sanger/limber/pull/1641/flags?src=pr&el=flag&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=sanger) | `90.81% <ø> (+0.39%)` | :arrow_up: | Flags with carried forward coverage won't be shown. [Click here](https://docs.codecov.io/docs/carryforward-flags?utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=sanger#carryforward-flags-in-the-pull-request-comment) to find out more.

:umbrella: View full report in Codecov by Sentry.
:loudspeaker: Have feedback on the report? Share it here.

[StephenHulme]

Good point @andrewsparkes, here's the updated screenshot for a LCA Blood Array plate showing how the 96 parents are handled. I have limited the heights of the parent and children boxes to 40% of the view-port height and added a scrollbar. There is now a number displayed to make it easy to count too.

And here's one for the children on a LRC PBMC Bank plate.

[codeclimate[bot]]

Code Climate has analyzed commit 39a76c79 and detected 2 issues on this pull request.

Here's the issue category breakdown:

Category	Count
Duplication	2

The test coverage on the diff in this pull request is 100.0% (50% is the threshold).

This pull request will bring the total coverage in the repository to 90.3% (-0.1% change).

View more on Code Climate.

[KatyTaylor]

Was this one paused because it broke the integration suite selenium tests? Or was that another one? I would advocate for merging this in if we're happy it works well.

[StephenHulme]

Was this one paused because it broke the integration suite selenium tests? Or was that another one?

Yes, that's right.

Integration suite broke quite badly because it was relying on the undelying .tube-list and .plate-list classes which was refactored out of this PR.

If there is value in fixing IntSuite to try find and parse the barcode names/links themselves, then I'm happy to look at this again.

[KatyTaylor]

Was this one paused because it broke the integration suite selenium tests? Or was that another one?

Yes, that's right.

Integration suite broke quite badly because it was relying on the undelying .tube-list and .plate-list classes which was refactored out of this PR.

If there is value in fixing IntSuite to try find and parse the barcode names/links themselves, then I'm happy to look at this again.

I think there's a lot of value in this PR. Is there an issue in the backlog for this? If not, we could make one and put it forward for prioritisation? Just so that work is tracked, as it may not be trivial!