Vacancy Card
Matched job opening card from ResultsView's locked section (Bunch D, Phase 3) — Jooble (primary) + DOU RSS (secondary, title-filtered), deduped and capped at 3-5 per grade. Never shows an irrelevant vacancy to fill space — see the empty-state below.
Matched vacancies
Title, company/location, salary (if present), a source badge (Jooble/DOU), and an outbound link — opens in a new tab.
| Prop | Type | Default | Description |
|---|---|---|---|
| match | JobMatch | — | One normalized vacancy from Jooble or DOU (or a demo fixture). |
| linkLabel | string | — | Localized "View" label — from resultsCopy.jobMatchesViewLabel. |
Loading state
Shown while the /api/jobs fetch is in flight for an unlocked user — never fetched at all for a locked/anonymous viewer.
Empty state
Hard requirement from the Bunch D research: fewer than 1 relevant match found → show this, never irrelevant vacancies just to fill space.
No matches yet — check back later.
| Prop | Type | Default | Description |
|---|---|---|---|
| message | string | — | Localized empty-state copy — from resultsCopy.jobMatchesEmpty. |
VoiceMock was built by one designer
I'm Sergiy, a product designer. I built this trainer myself — research, design system, code. On LinkedIn I show how products like this come together, and what it changes in a designer's work.
Product Designer · AI Design Engineer · Designer for Startups
See it on LinkedIn