feat(favorites): frontend revisions to pray and pay project

[v-anne]

This is the PR for making frontend changes to the pray and pay user interface.

Mike had some great comments in #4507, so we'll start with them and see what's needed once the low-hanging fruit is done.

Additions include:

• Allowing users to request a document from the recap_document.html page.
• Revamping UI of top_prayers.html to provide better UX.
• Creating user_prayers.html page to allow users to see their open and fulfilled prayers, and also summary statistics about how many requests they've had fulfilled. In a future PR, this will be made similar to tags to allow people (e.g., freelance journalists) to share documents they've requested.
• documentation for how pray and pay project works.
• minor grammar changes to email notifications.

[v-anne]

@ERosendo this is the PR I'm going to build off of.

[mlissner]

Seeing some commit messages around the user-prayer page. Reminds me that it doesn't have to be available in the profile section, just like tags aren't. The user prayers page could just be linked from the mouseover for each emoji or from the most-wanted page, for example.

[v-anne]

Yeah, tags are what I am aiming to emulate.

[v-anne]

I'm having some issues getting the three buttons to display inline with each other in `recap_document.html`. Ideally, the prayer button would be to the right of the other two.

[v-anne]

Having same issue with the button on the modal. There's also a related issue where if I click the prayer button repeatedly, the count will increase despite having exhausted the quota.

I gather this is an issue with the CSS, but I tried making some changes and was unsuccessful.

[mlissner]

@ERosendo, do you think you could help, please?

[ERosendo]

@mlissner sure! 👍

[v-anne]

@ERosendo in addition to those two issues with the buttons, I've mostly finished a MVP of the user_prayers.html page.

This is what it currently looks like. The status column is broken; I can't figure out why the backend isn't passing the information through to the template. I intend to add a button to allow users to delete requests and one for them to download available documents as well.

[ERosendo]

@albertisfu Thanks for your feedback. I've implemented all your suggestions.

[albertisfu]

Thanks @ERosendo this looks great.

Just left a couple of additional comments and suggestions.

[albertisfu]

In this line: {{ docket_entry.datetime_filed|datetime_in_utc|date:"M j, Y" }}, an empty value is displayed.

I believe the issue is that the datetime_in_utc filter handles the date format internally, so applying an additional format causes it to fail. If we want to display a different format here, we might need to use a different approach, such as modifying datetime_in_utc to accept an optional custom format.

Same for the .txt version

[ERosendo]

we can pass timezone as a template variable instead of using the datetime_in_utc filter and use this custom format, right?

[albertisfu]

yeah, that's also a valid approach!

[albertisfu]

I think we can avoid the duplicate code in this method and in get_lifetime_prayer_stats by encapsulating the shared logic into a separate method, something like:

async def compute_cost(queryset):
    return await (
        queryset.values("recap_document")
        .distinct()
        .annotate(
            price=Case(
                When(recap_document__is_free_on_pacer=True, then=Value(0.0)),
                When(
                    recap_document__page_count__gt=0,
                    then=Least(
                        Value(3.0),
                        F("recap_document__page_count") * Value(0.10),
                    ),
                ),
                default=Value(0.0),
            )
        )
        .aaggregate(Sum("price", default=0.0))
    )

And then just using:
cost = await compute_cost(filtered_list)

OR:

total_cost = await compute_cost(prayer_by_status.select_related("recap_document"))

[ERosendo]

You're correct! I'll create this new helper function.

[albertisfu]

Can we use the same key names here as in PrayerStats?

I believe if we do something like:

Suggested change

	"count": prayer_count,
	"num_distinct_purchases": distinct_prayers,
	"total_cost": f"{total_cost:,.2f}",
	"prayer_count": prayer_count,
	"distinct_count": distinct_prayers,
	"total_cost": f"{total_cost:,.2f}",

Then in both returns we can do:
return PrayerStats(**data)

[ERosendo]

You're correct! Thanks for bringing this to my attention.

[ERosendo]

@albertisfu Ready for another review 😃

[albertisfu]

Thanks! this now looks good to me

[mlissner]

Right on. Into the maw it goes!! Thank you all for the teamwork polishing and refining this one. I'm looking forward to giving it a try.