[blog] verification-panel SVG generator + image support - #55
Conversation
…o odoo post The cheap, repeatable, NO-BROWSER way to put Knowcap UI in posts. Instead of screenshotting the live app (slow, needs auth, redone every post), render the post's real human-confirmed claims to an SVG panel from data + DESIGN.md tokens. - routines/blogger/lib/gen-verification-panel.mjs — zero-dep generator (claims.json -> verification-inbox.svg), up to 6 claims, category-colored. - lib/README.md — usage + the routine step (case-study only, web-served path, honesty rule: only render genuinely human-confirmed claims). - app/lib/blog.ts — renderMarkdown now supports  images (the zero-dep renderer didn't; needed for this + future screenshots). - app/app/blog/blog-styles.ts — image + caption styling. - app/public/blog/<slug>/verification-inbox.svg — generated asset for the Odoo reconciliation post (4 real confirmed claims: decision/risk/task/fact, each with confirmer + timestamp). - the post embeds the panel after the story spine. Verified: generator output is valid SVG;  renders to <img> not a link; post parses; asset present.
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
|
Warning Review limit reached
More reviews will be available in 40 minutes and 10 seconds. Learn how PR review limits work. Your organization has used up its prepaid credits, and credit purchases are no longer available. Enable the review add-on in the billing tab to keep reviews running — you're only billed for reviews past your plan's rate limits ($0.25/file). ⌛ How to resolve this issue?After more reviews become available, a review can be triggered using the We recommend that you space out your commits to avoid hitting the rate limit. 🚦 How do rate limits work?CodeRabbit enforces hourly rate limits for each developer per organization. Our paid plans include higher PR review limits than trial, open-source, and free plans. In all cases, reviews become available again over time. During sustained high-volume PR review activity, CodeRabbit may temporarily slow when the next review becomes available. Please see our Fair Usage Limits Policy for further information. ℹ️ Review info⚙️ Run configurationConfiguration used: defaults Review profile: CHILL Plan: Pro Plus Run ID: ⛔ Files ignored due to path filters (1)
📒 Files selected for processing (6)
✨ Finishing Touches🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
1 participant
Verification-panel generator + image support (the cheap, no-browser way to put Knowcap UI in posts)
Answers "I want real Knowcap UI in the blog, but not by screenshotting the live app every time." The verification UI is deterministic and the routine already has the real confirmed claims — so we render them to SVG from data + DESIGN.md tokens. No browser, no auth, ~free, repeatable per post.
What's here
routines/blogger/lib/gen-verification-panel.mjs— zero-dep generator:claims.json → verification-inbox.svg. Up to 6 claims, category-colored (decision/task/risk/fact), each with confirmer + timestamp + the "no Confirm All" footer.routines/blogger/lib/README.md— usage + the routine step (case-study only, web-served path, honesty rule).routines/blogger/lib/examples/…claims.json— worked example (this post's claims).app/lib/blog.ts—renderMarkdownnow supportsimages. The zero-dep renderer didn't — needed for this and every future screenshot.app/app/blog/blog-styles.ts— image + caption styling.app/public/blog/<slug>/verification-inbox.svg— the generated asset (4 real human-confirmed claims from meetingccf3434e).Why SVG-from-data, not a screenshot
Faithful styled replica fed real data → no PII to mask, no browser chrome to crop, crisp at any size, always on-brand, accurate to the post's own claims. Literal pixels remain a connect-chrome fallback if ever needed.
Honesty rule (enforced in the README)
Only genuinely human-confirmed claims (
confirmation_source: human) get rendered as "Confirmed" — the panel exists to show the verification workflow, so faking it would defeat the thesis.Verification
Generator output is valid SVG (1160×676);
renders to<img>not a link; post parses via gray-matter; asset present.next buildnot run here (legacy API route blocks local SSG; Vercel builds fine).Note
The 1-line routine hook (call the generator in case-study mode) belongs in
ROUTINE.md/SKILL.md, which PR #45 already edits — I'll fold it there to avoid a conflict. This PR is the engine + first output.🤖 Generated with Claude Code