LF-5237 Implement immediate validation for unsupported file formats on upload in Farm Note creation

[kathyavini]

Description

Despite the ticket title, this fix is applied to all image uploads throughout app in this PR

There were two existing patterns:

1. No check for / warning about filetype. This was the pattern in <ImagePicker />'s delayed upload flow (i.e. Farm Image, Help Request image), and inherited by <ImageUploadCapture /> (Farm Notes), which was based on this flow
2. A check for image MIME-type, with an immediate "Failed to upload attachments" snackbar if the file wasn't an image. This was in the original <ImagePickerWrapper /> (crop images) and in the immediate upload flow of <ImagePicker /> using useImagePicker (e.g. animals, market directory). This was fundamentally sound but the snackbar was unhelpful as it didn't explain the cause of the upload error

This PR:

• Creates a single validator function to consolidate the MIME-type checks into a single shared function. It's slightly more permissive than the original checks as it allows specific file extensions if a MIME-type is not present
• Creates a more helpful snackbar that directs towards uploading the right kind of file
• Uses the validator + the snackbar across the various image upload situations in app (should now cover all of them)

Jira link: https://lite-farm.atlassian.net/browse/LF-5237

Type of change

• Bug fix (non-breaking change which fixes an issue)
• New feature (non-breaking change which adds functionality)
• Breaking change (fix or feature that would cause existing functionality to not work as expected)
• This change requires a documentation update

How Has This Been Tested?

• Passes test case
• UI components visually reviewed on desktop view
• UI components visually reviewed on mobile view
• Other (please explain)

Checklist:

• I have commented my code, particularly in hard-to-understand areas
• My changes generate no new warnings
• 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
• The precommit and linting ran successfully
• I have added or updated language tags for text that's part of the UI
• I have ordered translation keys alphabetically (optional: run pnpm i18n to help with this)
• I have added the GNU General Public License to all new files

[kathyavini]

The Feedback Form DOES accept a file currently, and it will never go through imaginary so there is really no issue with uploading a file via the <ImagePicker /> component (it will just get attached to the support email); however, 1) the image preview is broken in the case of a file:

and 2) it doesn't really make sense to use the <ImagePicker /> component for file upload!

I suspect what happened here was that Loïc requested the new upload component when we revamped Feedback Form, and we had ignored or just overlooked that this new component is specific to images so probably shouldn't have been used (at least, without changing the label string as belatedly done here!)

According to Denis, file upload is not really used in support requests anyway. I think we even discussed this before as a team and had talked about restricting to images? In any case, that is what Denis suggested today when we discussed this ticket, so I have gone with that and updated the label accordingly.

[SayakaOno]

Looks good to me!