Enhance EmailAgendaItemCard with improved styling, date formatting, and status display.#451
Enhance EmailAgendaItemCard with improved styling, date formatting, and status display.#451Onuiteshi wants to merge 5 commits into
EmailAgendaItemCard with improved styling, date formatting, and status display.#451Conversation
… and status display.
|
🚀 Preview URL for this PR: https://d6384c16-civic-dashboard-web.civic-dashboard.workers.dev |
| import { Heading, Hr, Link, Section, Text } from '@react-email/components'; | ||
| import { Fragment } from 'react'; | ||
|
|
||
| const MAX_ITEMS = 2; |
There was a problem hiding this comment.
just wanted to confirm -- this is on purpose? we want to limit the update emails to just two cards and force readers to click through to the website?
There was a problem hiding this comment.
I don't think we have a limit right now? I think most people would not expect a limit (or would expect a much higher limit)
There was a problem hiding this comment.
Yes this was intentional. Previously there was no limit so a popular tag like "housing" could dump hundreds of items into a single email which isn't a great experience. I bumped it to 5 as a reasonable balance between giving enough context and not overwhelming the inbox.
Also worth noting, the items previously had no guaranteed order so older ones could show up at the top. They now show the most recent first so subscribers always see what's newest. The "And X more results" link at the bottom takes them to the site to see everything.
Was there a specific reason the previous behaviour had no limit? If the team thinks 5 is still too low I can take it higher
There was a problem hiding this comment.
Yes this was intentional. Previously there was no limit so a popular tag like "housing" could dump hundreds of items into a single email which isn't a great experience.
This might be because of the testing in the dev environnment. Once a agenda item has been sent by email to subscribers, we switch it the value of notificationSent to true, and it doesn't get sent again. So normally, it's only the "new" housing element of a single day that is sent, so its not hundreds, but more like just a few.
I'll have few more comments, BRB.
| style={{ fontSize: '16px' }} | ||
| dangerouslySetInnerHTML={{ __html: sanitize(item.agendaItemSummary) }} | ||
| /> | ||
| {formattedStatus && <Text style={statusBadge}>{formattedStatus}</Text>} |
There was a problem hiding this comment.
hmm, i think it'd be nice to prefix this with Status: , as we do on the website. otherwise, it could be confusing. for example with the "no action required" status, readers might think this is saying that there is no action required of them, rather than that being just what the council concluded.
There was a problem hiding this comment.
Yea, I have added the "Status:" prefix to match the website card.
…display in `agendaItemCard`.
3 participants
Description
Resolves #46
The EmailAgendaItemCard component previously only showed the item reference, title, and summary. This PR enhances it to match the information hierarchy of the website card.
Before: Reference + title (as a link) + plain summary text only.
After: Meeting date, decision body, title (as a styled link), status badge (when present), decision recommendations (when present), and summary all inside a card with a left accent border, subtle container border, and consistent typography.
Testing instructions
Local:
npm run docker:start && npm run dev/actions, search "housing"Preview deployment:
/actionsChecklist