Did You Know? React Component
@smarter/didyouknow holds the Did you know? trivia about The Smarter
Project: a couple of dozen facts, such as how the project is coded in part with
agentic AI, its Architecture Decision Records, its SDKs, its MCP server and its
Free Course Catalog. A fact that mentions a resource, such as a documentation
page, a repository or a blog post, links to it, and the link opens in a new tab.
Each fact is something that the project’s repositories show, so that it stays
true. The facts are translated, like the rest of the web console.
The package is both a library and a small React app.
As a library, built into its dist folder like @smarter/common, it exports
the facts, didYouKnowFacts(), and two ways to pick one: randomFact(), and
factOfTheDay(), the same fact for everyone from midnight to midnight UTC,
and the next one the next day. It also exports DidYouKnow, the note itself:
its title, the fact and its link. The note has no styles of its own. Each
consumer gives it class names, and may give it an icon before its title and
after its link, so that it looks the part where it is shown:
The Welcome dialog shows a random fact on one of its steps, picked at random, as a card below the step’s illustration.
The package’s own app shows the fact of the day below the web console’s title, The Smarter Project, as one line of small text as wide as the title bar, because the header has a fixed height. A fact that is still too long is cut short with an ellipsis, and shown in full on hover. The title bar,
templates/dashboard/header.html, includestemplates/react/didyouknow.htmlon every console page, which mounts the app only while theenable_web_console_did_you_knowwaffle switch is active. The switch is active by default. Like the title, the note is hidden on a phone.
To add a fact, add it to didYouKnowFacts() in
smarter-didyouknow/src/lib/facts.ts, with its link if it mentions a
resource, then regenerate and translate the message catalogs.