Files
twenty/packages/twenty-apps
nitin 7b81d9ab83 Fix call-recorder REC badge rendering as empty boxes (#23415)
## What was wrong

The bot camera image draws a "REC" pill on top of the workspace logo.
The label used an SVG `<text>` element, and sharp resolves SVG text
through the host's fonts. The runtimes that execute app logic functions
ship no fonts, so every character fell back to an empty box: the badge
showed "▯▯▯" instead of "REC" in real meetings. It looked fine locally
because dev machines have fonts.

## The fix

Draw the label as vector outlines instead of text. "REC" is outlined
once from Inter SemiBold and stored as an SVG path constant, so the
badge renders the same on any host with no font lookup. The pill width
is derived from its contents instead of hardcoded, and tests fail if
`<text>` or `font-family` ever comes back.

<img width="2120" height="1191" alt="CleanShot 2026-07-28 at 19 16 46"
src="https://github.com/user-attachments/assets/c5fa0958-35ba-48da-be9c-a6af81ec2fa0"
/>


1 -- the bug on prod
2 -- how it looks when its not bugged on prod
3 -- this branches changes

<!-- This is an auto-generated description by cubic. -->
<a
href="https://cubic.dev/pr/twentyhq/twenty/pull/23415?utm_source=github"
target="_blank" rel="noopener noreferrer"
data-no-image-dialog="true"><picture><source
media="(prefers-color-scheme: dark)"
srcset="https://www.cubic.dev/buttons/review-in-cubic-dark.svg"><source
media="(prefers-color-scheme: light)"
srcset="https://www.cubic.dev/buttons/review-in-cubic-light.svg"><img
alt="Review in cubic"
src="https://www.cubic.dev/buttons/review-in-cubic-dark.svg"></picture></a>
<!-- End of auto-generated description by cubic. -->
2026-07-28 14:08:39 +00:00
..