Feature: add campaign comments block

[JoshuaHungDinh]

Resolves: GIVE-1394

Description

Reference: Zeplin

This add the Campaign Comments block.

• New route registered: GetCampaignComments.php.

Visuals

comments.mov

Testing Instructions

• Create a campaign.
• Add block & test out the controls.
• Anonymous donations can be filtered out and should not show any personal information if displayed.
• Empty Comments do not show.
• Avatar(Gravatar) can be hidden.
• Name can be hidden.
• Date can be hidden.
• Comment length can be truncated.
• Title can be edited.
• Read more button text can be edited.
• Read more button should not show if actual comment is less then the set comment length.
• Amount of comments to be shown per-page can be chosen.

Pre-review Checklist

• Acceptance criteria satisfied and marked in related issue
• Relevant @unreleased tags included in DocBlocks
• Includes unit tests
• Reviewed by the designer (if follows a design)
• Self Review of code and UX completed

[alaca]

Hey @JoshuaHungDinh
I hope you don't mind me checking your PR. I left a comment regarding assets loading.

[alaca]

Instead of loading assets on the backend, this is a new approach we are using now (block.json). With this approach you don't need loadScripts method.

[JoshuaHungDinh]

Hey yea thanks, I've been having difficulties localizing the window without registering it here. Any suggestions or thoughts?

[alaca]

Hey Joshua, I'd suggest registering a new route - /campaign/(?P<id>\d+)/comments and then fetch data from the block app. For data fetching you can use useSWR which is great. Here is an example of how to use it

givewp/src/Campaigns/Blocks/DonateButton/edit.tsx

Line 32 in eab7e73

const campaignForms = (() => {

Also, the current approach might not be the best if we want to introduce pagination for comments. Imagine there are hundreds of comments, which is unlikely but, the current approach won't be that efficient because all comments data will be loaded every single time. And if there are multiple blocks on the same page, but from different campaigns, every single one of them will use the same global object GiveCampaignCommentsBlockWindowData.

[jonwaldstein]

@alaca I think that's a good suggestion for now, however in the future we should consider using the donations endpoint to get the comments (when those endpoints are ready). We can then filter by campaignId and HAL to include donor data, checkout the slack thread on this topic https://lw.slack.com/archives/C04SLRDD9CK/p1738879925746179

[JoshuaHungDinh]

Thanks @jonwaldstein I also cleaned up the empty state UI . 3e625cd

[jonwaldstein]

@JoshuaHungDinh nice job man!