feat: CE-686 - Refactor Animal Form and Related Components

[jeznorth]

Description

Refactored the 'Outcome by Animal' view and form components to provide responsive / support for viewing and managing data for this section on iPad / potentially smaller device sizes.

Fixes # (issue)

How Has This Been Tested?

Please describe the tests that you ran to verify your changes. Provide instructions so we can reproduce. Please also list any relevant details for your test configuration

• Manually Verified
• Related cypress tests pass

Checklist

• I have added tests that prove my fix is effective or that my feature works
• New and existing unit tests pass locally with my changes

Further comments

---

Thanks for the PR!

Any successful deployments (not always required) will be available below.
Backend available
Frontend available

Once merged, code will be promoted and handed off to following workflow run.
Main Merge Workflow

---

Thanks for the PR!

Deployments, as required, will be available below:

• Frontend
• Backend

Please create PRs in draft mode. Mark as ready to enable:

• Analysis Workflow

After merge, new images are deployed in:

• Merge Workflow

---

Thanks for the PR!

Deployments, as required, will be available below:

• Frontend
• Backend

Please create PRs in draft mode. Mark as ready to enable:

• Analysis Workflow

After merge, new images are deployed in:

• Merge Workflow

[Scarlett-Truong]

@jeznorth I like the new layout! Tho I wish the border of each animal section is bolder, cuz the separation lines inside has the same colour and is kinda long, and may mistaken as the bottom border. That's just my thought for the design.

Functionality: there's just one issue you might need to address:

• When you add an animal with outcome (for ex: select "Dead on arrival") -> click Save -> then click Edit -> the previous selected outcome ("Dead on arrival") is not displayed

[jeznorth]

@jeznorth I like the new layout! Tho I wish the border of each animal section is bolder, cuz the separation lines inside has the same colour and is kinda long, and may mistaken as the bottom border. That's just my thought for the design.

Functionality: there's just one issue you might need to address:

• When you add an animal with outcome (for ex: select "Dead on arrival") -> click Save -> then click Edit -> the previous selected outcome ("Dead on arrival") is not displayed

I've reconciled the issue you noticed. Regarding the UI, it needs a significant rework. Nested forms of this complexity aren't the most user-friendly, however our "roller-skates" version here is to ensure the layout is responsive at a bare minimum.

[sonarqubecloud]

Quality Gate passed

Issues
0 New issues
0 Accepted issues

Measures
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarCloud