Photo descriptions

[ygingras]

It would be nice to be able to provide a text description when uploading a photo.

Example usage:

• "John enjoying the rest after the first crux";
• "Route A turn left after the chock stone".

[ygingras]

It does not looks like I have the privileges to add labels, but this would be a feature request.

[vnugent]

@ygingras just sent an invite to the core team which should give you write permission.

[siman4457]

I can pick this up since it's related to #583.

[siman4457]

Currently, new photos are uploaded via a custom hook (usePhotoUploader) in NewPost.tsx. Here's my thought process on what the new flow could look like to incorporate the ability to add a description alongside a photo:

1. Button should open the native file uploader.
2. User uploads a file and a new modal component (imageUploadFormModal) opens.
3. imageUploadFormModal shows a preview of image(s) selected and provides a field for adding a description.
4. User clicks on a submit button.
5. Upload an image to Sirv via the same usePhotoUploader hook
6. If the upload was successful, trigger a request to add data to mongo (sirv URL? & description)

I'm unsure of the schema of a photo or how a photo is linked to a user. Need to look into this. It would be helpful to be able to upload photos from dev environment, but it seems like we don't have permission to do that (getting a 500 status code error in the browser console, and a 401 error in open-tacos logs).

The only flaw I see here is the case where a photo upload to Sirv is successful, but the backend request in step 6 fails. This would mean that we have a "floating" image in Sirv.

@vnugent let me know what you think!

[vnugent]

2. User uploads a file and a new modal component (imageUploadFormModal) opens.

I like the idea of having a preview screen (imageUploadFormModal). We can also prompt users to tag climbs as well as pre-populate the tag if the user uploads from a climb page (see #499)

The only flaw I see here is the case where a photo upload to Sirv is successful, but the backend request in step 6 fails. This would mean that we have a "floating" image in Sirv.

It's ok. In this case it's like uploading photos with a blank description. Users can always go back to the post and add a description.

One thing we also need to reconsider if how many photos we allow a user to upload per post (currently set to 40) https://github.com/OpenBeta/open-tacos/blob/588c11bef10d36c9aae4dd6aa179467e32326a71/src/js/hooks/usePhotoUploader.ts#L95

[siman4457]

We can also prompt users to tag climbs as well as pre-populate the tag if the user uploads from a climb page (see https://github.com/OpenBeta/open-tacos/issues/499)

I definitely intend to include this feature. Should be straightforward to implement, but I'd like to get adding a description completed first.

I think we should reduce maxFiles. Let's see what others have in mind on Discord.

As discussed, adding a description requires some planning for a new Post collection in MongoDB. Attaching a screenshot of what it could look like for documentation