LB-1688 Feature to thank a user for a pin/recommendation

[Suvid-Singhal]

Problem

This feature aims to add a functionality to thank users for their pins/recommendations
This feature is a work in progress as of now
Backend is mostly complete but frontend needs some work.

The feature request ticket is: LB-1688

Solution

Implemented backend as of now. Didn't have to change the DB schema for it.

Action

I need some help in some places for frontend in order to complete this.

[pep8speaks]

Hello @Suvid-Singhal! Thanks for updating this PR. We checked the lines you've touched for PEP 8 issues, and found:

There are currently no PEP 8 issues detected in this Pull Request. Cheers! 🍻

Comment last updated at 2025-01-23 17:02:11 UTC

[MonkeyDo]

Thank you for opening the PR!

There are a couple of things missing before I can test the feature:

Currently, I am recieveing an error on the back-end and two on the front-end.
The back-end one is crashing the web container preventing my testing.

Back-end error:

File "/code/listenbrainz/listenbrainz/webserver/views/user_timeline_event_api.py", line 731
web-1 | raise APIBadRequest(f"{metadata['event_type']} event with id {
web-1 | SyntaxError: unterminated string literal (detected at line 731)

Front-end errors:

First one is easy and just needs renaming the thankFeedEvent method to avoid name collision:

/code/frontend/js/src/user-feed/UserFeed.tsx
static_builder-1 | 270:15 error 'thankFeedEvent' is already declared in the upper scope on line 268 column 9

Second issue is a typescript type error:

ERROR in ./frontend/js/src/user-feed/UserFeed.tsx:277:27
static_builder-1 | Found 1 error in 13396 ms.
static_builder-1 | TS2339: Property 'blurb_content' does not exist on type 'EventMetadata'.
static_builder-1 | Property 'blurb_content' does not exist on type 'Listen'.

I think at the core of this issue is a misunderstanding of where the thanking logic goes.
The way it is currently set up, clicking on "Thank Event" tries to send a non-existing blurb content via the API (the event you are thanking might not have a blurb content, and if it has one it's not the thank you message).
So instead, clicking on the button should open a modal where the user can write an optional thank you message. The logic for sending the thank-you with the optional blurb content should be implemented in the modal in question instead of the UserFeed page.
A good example of how to do all this is to see how the PersonalRecommendationModal is used in the ListenCard component, and basically use that as an example for the action button and the new modal.