feat(www2): add viche.social to projects - #32
Conversation
A client-first web app that puts Bluesky, Mastodon and Nostr in one timeline, with keys and accounts staying on the reader's device. Both domains are live, so the entry is `live`, and it leads the list — it is the largest thing in it. No GitHub link: the repo is private until the project opens up, and a dead link plus a stats fetch that finds nothing is worse than no link. `github` is optional, and the card and page already guard on it. The article skips the Examples beat the template asks for. Install and run instructions invite a clone that cannot happen yet, so the beat has no honest content while the source is closed. What it covers instead is drawn from the repo: the capability sets that replace network conditionals and generate the public feature matrix, feed merging as a setting rather than the shape of the app, and where credentials live. Viche's own mark comes with it — Phosphor's IntersectThree, duotone, inlined as SVG rather than added as a React-only dependency for one glyph. It does not share Lucide's grid, so it carries its own viewBox and fills instead of strokes, in the card, the page and the generated OG image alike. The hero images are viche.social's own OG cards, one per locale, converted to WebP on the way in — 48 KB to 17 KB each. Also cite it from the CV's open-source paragraph in both locales, as something being built with open source planned rather than as an open-source project, linking the project page rather than jumping straight off-site.
|
Warning Review limit reached
Next review available in: 51 minutes Enable usage-based reviews in Billing to review now. Otherwise, wait until the next included review is available. How can I continue?After more reviews become available, a review can be triggered using the To avoid repeated limits, reduce automatic review volume by pausing incremental auto-reviews earlier, using label-based review opt-in, excluding WIP or generated PR titles, or requesting reviews manually when the PR is ready. If your team needs uninterrupted high-volume reviews, an organization admin can enable usage-based reviews. How do review limits work?CodeRabbit enforces per-developer PR review limits for each organization. Most developers receive the normal plan review availability. For paid Pro and Pro+ PR reviews, CodeRabbit uses adaptive limits for sustained high-volume activity. When a developer's recent PR review activity reaches the 95th percentile or higher among CodeRabbit users, additional reviews become available more gradually as earlier reviews age out of the rolling window. Please refer docs for additional details. Review details⚙️ Run configurationConfiguration used: Organization UI Review profile: CHILL Plan: Pro Plus Run ID: 📒 Files selected for processing (6)
📝 WalkthroughWalkthroughAdds the Viche project to the projects catalog with bilingual documentation, localized WebP hero images, metadata, and reordered highlighted-project positions. Adds the IntersectThree icon to project cards, project pages, and filled OG image rendering. Updates the CV feed timestamp and bilingual web-development profile text with Viche information. Sequence Diagram(s)sequenceDiagram
participant Visitor
participant ProjectPage
participant ProjectData
participant IntersectThree
participant OGImage
Visitor->>ProjectPage: open Viche project page
ProjectPage->>ProjectData: load Viche metadata
ProjectData-->>ProjectPage: return project details and icon key
ProjectPage->>IntersectThree: render project icon
ProjectPage->>OGImage: generate project image data
OGImage-->>Visitor: provide rendered project image
Possibly related PRs
Poem
🚥 Pre-merge checks | ✅ 5✅ Passed checks (5 passed)
✨ Finishing Touches📝 Generate docstrings
🧪 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 |
There was a problem hiding this comment.
Pull request overview
Adds a new featured project entry for viche.social to the www2 projects list, along with bilingual project articles and supporting icon/OG-image rendering updates. Also updates the CV “open-source/projects” paragraph in both locales and bumps the CV feed timestamp so the change surfaces in feeds.
Changes:
- Add
vichetoapps/www2/src/data/projects.ts(highlighted, sortOrder lead) and create EN/UK MDX project articles. - Add a custom
IntersectThreeicon component and support rendering that filled icon in cards, project pages, and OG image generation. - Update EN/UK web-dev MDX CV copy to mention viche.social and bump
/cv’supdatedAtin feed pages.
Reviewed changes
Copilot reviewed 10 out of 12 changed files in this pull request and generated 2 comments.
Show a summary per file
| File | Description |
|---|---|
| packages/locales/mdx/web-dev.uk.mdx | Updates Ukrainian CV snippet to mention viche.social (contains a typo to fix). |
| packages/locales/mdx/web-dev.en.mdx | Updates English CV snippet to mention viche.social. |
| packages/locales/mdx/projects/viche.uk.mdx | Adds new Ukrainian project article for viche. |
| packages/locales/mdx/projects/viche.en.mdx | Adds new English project article for viche. |
| apps/www2/src/utils/ogImage.ts | Adds support for rendering filled/non-Lucide icons in generated OG images. |
| apps/www2/src/pages/[locale]/projects/[slug].astro | Adds intersect-three icon mapping for the project detail page. |
| apps/www2/src/data/projects.ts | Adds the viche project entry and shifts sort order for existing highlighted projects. |
| apps/www2/src/data/feedPages.ts | Bumps CV updatedAt so feed consumers see the CV text change. |
| apps/www2/src/components/ProjectCard.astro | Adds intersect-three icon mapping for project cards. |
| apps/www2/src/components/icons/IntersectThree.astro | Adds the custom SVG icon component used by cards/pages. |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
The mark's path data sat in both the Astro component and the OG renderer, so touching one would have silently desynced the page from its card. Move it to `utils/brandIcons.ts` and have both read from there. Also "зкачувань" -> "завантажень" on the CV. The typo predates this branch, but the line ships in this diff.
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 3
🧹 Nitpick comments (2)
apps/www2/src/utils/ogImage.ts (1)
67-67: 📐 Maintainability & Code Quality | 🔵 Trivial | 🏗️ Heavy liftUse one source of truth for the IntersectThree path data.
The full SVG path is duplicated between
apps/www2/src/utils/ogImage.tsandapps/www2/src/components/icons/IntersectThree.astro; extract the viewBox and shapes into a plain shared module so future icon edits cannot make the page and OG image diverge.🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@apps/www2/src/utils/ogImage.ts` at line 67, Extract the IntersectThree SVG viewBox and path data into a plain shared module, then update the OG image utility and the IntersectThree.astro component to import and reuse that single source of truth. Remove the duplicated inline path data while preserving the existing rendered SVG output.apps/www2/src/components/ProjectCard.astro (1)
4-4: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick winRestore the required import-group separators in both Astro files.
The new alias imports are correct, but both files need blank lines separating package imports, aliases, and relative imports.
apps/www2/src/components/ProjectCard.astro#L4-L4: add separators around the@/componentsalias group.apps/www2/src/pages/[locale]/projects/[slug].astro#L10-L10: add a separator between package imports and the@/alias group.🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@apps/www2/src/components/ProjectCard.astro` at line 4, Restore blank-line separators between import groups in apps/www2/src/components/ProjectCard.astro lines 4-4, placing the `@/components` alias imports apart from package and relative imports; also add the separator between package imports and the `@/` alias group in apps/www2/src/pages/[locale]/projects/[slug].astro lines 10-10.Source: Coding guidelines
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@packages/locales/mdx/projects/viche.en.mdx`:
- Around line 52-56: The Viche privacy wording currently overstates the trust
boundary and “no key ever stored” claim. In
packages/locales/mdx/projects/viche.en.mdx lines 52-56, revise the English text
to state that Viche’s backend never receives identity keys or credentials while
protocol requests and tokens go directly to relays, PDS/AppViews, and Mastodon
instances, and acknowledge the persisted throwaway session keypair; apply the
equivalent Ukrainian correction in packages/locales/mdx/projects/viche.uk.mdx
lines 52-56.
In `@packages/locales/mdx/projects/viche.uk.mdx`:
- Line 21: У рядку таблиці замініть ненормативне написання «крос-постингу» на
«кроспостингу» або «перехресного постингу», зберігши решту тексту без змін.
In `@packages/locales/mdx/web-dev.uk.mdx`:
- Line 7: У тексті українського профілю замініть «проектами» на «проєктами», а
«зкачувань» на «завантажень», не змінюючи решту змісту.
---
Nitpick comments:
In `@apps/www2/src/components/ProjectCard.astro`:
- Line 4: Restore blank-line separators between import groups in
apps/www2/src/components/ProjectCard.astro lines 4-4, placing the `@/components`
alias imports apart from package and relative imports; also add the separator
between package imports and the `@/` alias group in
apps/www2/src/pages/[locale]/projects/[slug].astro lines 10-10.
In `@apps/www2/src/utils/ogImage.ts`:
- Line 67: Extract the IntersectThree SVG viewBox and path data into a plain
shared module, then update the OG image utility and the IntersectThree.astro
component to import and reuse that single source of truth. Remove the duplicated
inline path data while preserving the existing rendered SVG output.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro Plus
Run ID: ba2ee82c-836f-4ddd-b511-489266c08e17
📒 Files selected for processing (12)
apps/www2/public/viche-en.webpapps/www2/public/viche-uk.webpapps/www2/src/components/ProjectCard.astroapps/www2/src/components/icons/IntersectThree.astroapps/www2/src/data/feedPages.tsapps/www2/src/data/projects.tsapps/www2/src/pages/[locale]/projects/[slug].astroapps/www2/src/utils/ogImage.tspackages/locales/mdx/projects/viche.en.mdxpackages/locales/mdx/projects/viche.uk.mdxpackages/locales/mdx/web-dev.en.mdxpackages/locales/mdx/web-dev.uk.mdx
…n forms "No key ever stored" contradicted its own sentence two lines later, which says a throwaway session keypair is persisted. The claim worth making is narrower and still strong: your identity key is never stored. Also 2019 orthography — кроспостингу, and проєктами in both places it appears on the CV, so the file matches the site's own «Проєкти».
Adds viche.social — a client-first web app putting Bluesky, Mastodon and Nostr in one timeline, with keys and accounts staying on the reader's device.
Leads the list at
sortOrder: 1; the other eight shift down by one.Entry
live— both domains are deployed and the app works todayviche.social(the article linksviche.appfor the product itself)dev, organisation AnnexareNo GitHub link. The repo is private until the project opens up, and a dead link plus a stats fetch that finds nothing is worse than no link at all.
githubis optional onProject, and both the card and the page already guard on it, so nothing needed changing.usescreditscountries-listamong others, which Viche genuinely depends on — so the two projects now cross-link.The article
Six beats, not seven. Examples is skipped: install and run instructions invite a clone that cannot happen while the source is closed, so the beat has no honest content.
packages/locales/mdx/projects/README.mdmarks beats 1–3 as required, so this is a deliberate deviation — worth a line in that README if closed-source projects become a pattern.What it covers instead: how the app decides what each network can do, why feed merging is a setting rather than the shape of the app, where credentials live, and why the integration seam belongs in the client at all.
Both locales are structurally identical — 19 paragraphs, 9 headings each — and the Ukrainian is written as Ukrainian rather than translated sentence by sentence.
Icon and images
Viche's mark is inlined as SVG rather than adding a React-only icon package for one glyph. It does not share Lucide's 24px stroke grid, so
iconDataUrigained a small branch for marks on their own viewBox. The path data lives inutils/brandIcons.ts, read by both the Astro component and the OG renderer, so the page and its card cannot drift.Hero images are viche.social's own OG cards, one per locale, converted PNG → WebP on the way in: 48 KB → 17 KB each. The existing
rehype-local-image-sizepass picks up their intrinsic size, so the tags carry width and height and the page does not shift.CV
Cited in the open-source paragraph in both locales — framed as being built, with open source planned, not as an open-source project, which it is not yet. Links the project page rather than jumping straight off-site, root-relative and locale-aware, matching how
faq.mdxalready links/en/projects.feedPagesCV date bumped, since its copy changed.Also fixes
зкачувань→завантаженьon that line. The typo predates this branch but ships in this diff.Verified
Lint, types, 37 tests and the build are green. Reviewed locally with CodeRabbit CLI, and one Copilot round on the PR — both its findings are addressed above.