feat: background image focal point

[GeronimoJohn]

Description

Issue

Users currently face challenges uploading images with exact proportions, making background image editing difficult. To improve the user experience, we're introducing the ability for users to set a focal point for background images.

Solution

To support this enhancement, we need to add two new fields—focalTop and focalLeft—to the Image Block. These fields will allow users to specify the focal point of the background image.

The following changes are made:

1. Add focalTop and focalLeft to the block model in Schema.Prisma within the api-journeys package.
2. Update the GraphQL schema to include these new fields in the Image Block.
3. Create a FocalPoint component that enables the users to set the focal point of an image

[linear[bot]]

ENG-1060 Background Images should have a focal point

[github-actions[bot]]

	Fails
:no_entry_sign:	Please request a reviewer for this PR.

Generated by :no_entry_sign: dangerJS against ca58dd8ea7737ebee36edb4453b0f873c4cc8bca

[github-actions[bot]]

The latest updates on your projects.

Name	Status	Preview	Updated (UTC)
watch	✅ Ready	watch preview	Thu Oct 17 17:20:47 NZDT 2024

[github-actions[bot]]

The latest updates on your projects.

Name	Status	Preview	Updated (UTC)
journeys-admin	✅ Ready	journeys-admin preview	Thu Oct 17 17:21:52 NZDT 2024

[github-actions[bot]]

The latest updates on your projects.

Name	Status	Preview	Updated (UTC)
videos-admin	✅ Ready	videos-admin preview	Thu Oct 17 17:20:57 NZDT 2024

[github-actions[bot]]

The latest updates on your projects.

Name	Status	Preview	Updated (UTC)
arclight	✅ Ready	arclight preview	Thu Oct 17 16:39:00 NZDT 2024

[github-actions[bot]]

The latest updates on your projects.

Name	Status	Preview	Updated (UTC)
journeys	✅ Ready	journeys preview	Thu Oct 17 17:21:22 NZDT 2024

[codecov[bot]]

Codecov Report

Attention: Patch coverage is 42.59259% with 31 lines in your changes missing coverage. Please review.

Project coverage is 79.41%. Comparing base (ea03adc) to head (ca58dd8). Report is 1 commits behind head on main.

Files with missing lines	Patch %	Lines
...rd/BackgroundMedia/Image/FocalPoint/FocalPoint.tsx	38.00%	30 Missing and 1 partial :warning:

Additional details and impacted files

```diff @@ Coverage Diff @@ ## main #3667 +/- ## ========================================== + Coverage 75.38% 79.41% +4.03% ========================================== Files 886 988 +102 Lines 14611 15954 +1343 Branches 1935 2085 +150 ========================================== + Hits 11014 12670 +1656 + Misses 3303 2973 -330 - Partials 294 311 +17 ``` | [Flag](https://app.codecov.io/gh/JesusFilm/core/pull/3667/flags?src=pr&el=flags&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=JesusFilm) | Coverage Δ | | |---|---|---| | [apps.api-analytics](https://app.codecov.io/gh/JesusFilm/core/pull/3667/flags?src=pr&el=flag&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=JesusFilm) | `?` | | | [apps.api-journeys](https://app.codecov.io/gh/JesusFilm/core/pull/3667/flags?src=pr&el=flag&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=JesusFilm) | `87.87% <ø> (ø)` | | | [apps.api-languages](https://app.codecov.io/gh/JesusFilm/core/pull/3667/flags?src=pr&el=flag&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=JesusFilm) | `?` | | | [apps.api-media](https://app.codecov.io/gh/JesusFilm/core/pull/3667/flags?src=pr&el=flag&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=JesusFilm) | `78.85% <ø> (ø)` | | | [apps.journeys](https://app.codecov.io/gh/JesusFilm/core/pull/3667/flags?src=pr&el=flag&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=JesusFilm) | `41.33% <ø> (?)` | | | [apps.journeys-admin](https://app.codecov.io/gh/JesusFilm/core/pull/3667/flags?src=pr&el=flag&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=JesusFilm) | `70.56% <42.59%> (-0.16%)` | :arrow_down: | | [apps.watch](https://app.codecov.io/gh/JesusFilm/core/pull/3667/flags?src=pr&el=flag&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=JesusFilm) | `59.66% <ø> (?)` | | | [libs.journeys.ui](https://app.codecov.io/gh/JesusFilm/core/pull/3667/flags?src=pr&el=flag&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=JesusFilm) | `74.66% <ø> (?)` | | 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=JesusFilm#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.