feat(announcements): add markdown support#1371
Conversation
|
Example of announcements : announcements:
- timestamp: 2025-08-15T14:00:00Z
type: outage
message: "Scheduled maintenance on database servers from 14:00 to 16:00 UTC"
- timestamp: 2025-08-15T16:15:00Z
type: operational
message: "Database maintenance completed successfully. All systems operational. [google link](https://google.fr)"
- timestamp: 2025-08-15T12:00:00Z
type: information
message: "New *monitoring* dashboard features <br />will be deployed <br />next week" |
Also resolved misalignment of timeline thanks to e2f06e92
|
Multiline timeline resolved by #1373 |
|
@Sworyz hah, I'm surprised somebody noticed that I fixed the multiline timeline issue. Alright, I'm sorry for being difficult, but I'm second guessing whether it's worth it to add an entire dependency for markdown, when realistically speaking, users will likely only care about adding support for links, bold text, italic text, and maybe headers. What do you think? Would it make sense to just create some code in the frontend to support those, as opposed to importing an entire markdown dependency? |
|
Hi @TwiN, Yes, the multiline issue bothered me and I was glad to seen it resolved so I really wanted to mention it! No worries about you being difficult, it’s a good thing and I really appreciate it. 👍 I’m going talk about our use case for this PR : we scrape incident and issue data from Jira using a sidecar container and write it to YAML. The markdown support is really valuable for formatting this data into clear, readable announcements. Without it, we may have a harder time presenting the information effectively. Marked and Dompurify seems to be very widely used without too much dependencies (one for dompurify only). Hence why I’ve gone with them to make this working. I also tend to agree that many users might only need basic formatting like links, bold text, and headers. However, I'm a little concerned that limiting the markdown support too much could restrict users to a single announcement structure impacting the presentation of the information to only one or two structures that may not fit everyone use case. I was also thinking before adding markdown this simple thing : just adding a link to the announcement yaml part and making the announcement bubble clickable, but it wasn’t enough for our use case. |
|
@Sworyz Alright, what you're saying makes sense to me. I'll review the code when I get a minute |
|
I just added support for archiving announcements (past announcements) in #1382 @Sworyz Could you please resolve the conflicts & regenerate the static assets with the new changes from the master branch? I think you'll also need to update the new
Sorry again for the trouble! |
|
Hi @TwiN, I've done the resolution of the merge conflict; a quick fix for a markdown link rendering issue and the past announcement that can now use md. I've also rebuilt the static files like you wanted!
|
| const escapeHtml = (value) => { | ||
| if (value === null || value === undefined) { | ||
| return '' | ||
| } | ||
|
|
||
| return String(value) | ||
| .replace(/&/g, '&') | ||
| .replace(/</g, '<') | ||
| .replace(/>/g, '>') | ||
| .replace(/"/g, '"') | ||
| .replace(/'/g, ''') | ||
| } |
There was a problem hiding this comment.
There's probably a more secure way to do this and I'm sure some security scan will complain, but since the content of the announcement is controlled by the configuration file, XSS isn't a concern.
| const titleAttribute = resolvedTitle ? ` title="${escapeHtml(resolvedTitle)}"` : '' | ||
| const linkText = resolvedText || '' | ||
|
|
||
| return `<a href="${url}" target="_blank" rel="noopener noreferrer"${titleAttribute}>${linkText}</a>` |
There was a problem hiding this comment.
Is there a reason why you don't specify tailwind classes here instead of using the <style> tag in the same file?
Also, now that there's two files where announcement messages are rendered with markdown, this duplicated code should probably be extracted to a shared utility file. I'll merge this and take care of it myself in a little bit
|
Thank you for the contribution! |
|
Made a few improvements in 379ec29 |
|
The feature basically is nice to have. Can it be hidden? |
|
@amai2012 This comment is under the wrong PR, but to answer your question, if there are no archived announcements, the Past Announcement section is hidden. This is explained in the documentation. |
This PR contains the following updates: | Package | Update | Change | |---|---|---| | [ghcr.io/twin/gatus](https://github.com/TwiN/gatus) | minor | `v5.30.0` -> `v5.31.0` | --- ### Release Notes <details> <summary>TwiN/gatus (ghcr.io/twin/gatus)</summary> ### [`v5.31.0`](https://github.com/TwiN/gatus/releases/tag/v5.31.0) [Compare Source](TwiN/gatus@v5.30.0...v5.31.0) Highlight of this release are the ability to mark announcements as "archived", which renders said announcements in a new `Past Announcements` section at the bottom of the status page (only rendered if there is at least 1 archived announcements), support for markdown in announcements and support for monitoring gRPC health endpoints. <img width="1166" height="556" alt="image" src="https://github.com/user-attachments/assets/d22a0ea7-c035-4c35-a148-6de097a357b7" /> #### What's Changed * feat(announcements): Add support for archived announcements and add past announcement section in UI by @​TwiN in TwiN/gatus#1382 * feat(announcements): add markdown support by @​Sworyz in TwiN/gatus#1371 * feat(client): Add support for monitoring gRPC endpoints by @​diamanat in TwiN/gatus#1376 * fix(client): update icmp/ping logic to determine pinger privileged mode by @​h3mmy in TwiN/gatus#1346 * fix(api): Escape endpoint key in URL for raw APIs by @​Nedra1998 in TwiN/gatus#1381 * docs(readme): adds ECS fargate module in README by @​GiamPy5 in TwiN/gatus#1377 #### New Contributors * @​GiamPy5 made their first contribution in TwiN/gatus#1377 * @​h3mmy made their first contribution in TwiN/gatus#1346 * @​diamanat made their first contribution in TwiN/gatus#1376 * @​Nedra1998 made their first contribution in TwiN/gatus#1381 * @​Sworyz made their first contribution in TwiN/gatus#1371 **Full Changelog**: <TwiN/gatus@v5.30.0...v5.31.0> </details> --- ### Configuration 📅 **Schedule**: Branch creation - At any time (no schedule defined), Automerge - At any time (no schedule defined). 🚦 **Automerge**: Disabled by config. Please merge this manually once you are satisfied. ♻ **Rebasing**: Whenever PR is behind base branch, or you tick the rebase/retry checkbox. 🔕 **Ignore**: Close this PR and you won't be reminded about this update again. --- - [ ] <!-- rebase-check -->If you want to rebase/retry this PR, check this box --- This PR has been generated by [Renovate Bot](https://github.com/renovatebot/renovate). <!--renovate-debug:eyJjcmVhdGVkSW5WZXIiOiI0Mi41LjAiLCJ1cGRhdGVkSW5WZXIiOiI0Mi41LjAiLCJ0YXJnZXRCcmFuY2giOiJtYWluIiwibGFiZWxzIjpbImltYWdlIl19--> Reviewed-on: https://gitea.alexlebens.dev/alexlebens/infrastructure/pulls/2008 Co-authored-by: Renovate Bot <renovate-bot@alexlebens.net> Co-committed-by: Renovate Bot <renovate-bot@alexlebens.net>




Summary
Add markdown support to announcements to allow link and more format to be written here. The idea was from #1319 .
One problem that seems to stay on multi-line is this :
Putting height: 11rem fix the problem as we add 2 more lines.
Checklist
It was tested with a build.
README.md, if applicable.